From e9d485fe3b5db8c426ac03b30ed8917df0baa62d Mon Sep 17 00:00:00 2001
From: Pauline <git@ethanlibs.co>
Date: Sun, 26 Nov 2023 17:13:07 -0500
Subject: feat(lint): switch to eslint config and formatting (use vscode for
 autoformat)

---
 apps/website/src/components/base/Button.astro      |  50 ++++-----
 apps/website/src/components/base/CodeBlock.astro   |  42 -------
 apps/website/src/components/base/Footer.astro      |   5 +-
 apps/website/src/components/base/Header.astro      |  40 +++----
 apps/website/src/components/base/Navbar.astro      |  34 +++---
 .../src/components/base/NavbarElement.astro        | 123 +++++++++++----------
 apps/website/src/components/base/Paragraph.astro   |  32 +++---
 .../src/components/base/ScreenOverlay.astro        |  16 +--
 .../base/ScrollbarOverlayContainer.astro           |  16 +--
 apps/website/src/components/base/Section.astro     |  54 ++++-----
 apps/website/src/components/base/Tag.astro         |  15 ++-
 11 files changed, 195 insertions(+), 232 deletions(-)

(limited to 'apps/website/src/components/base')

diff --git a/apps/website/src/components/base/Button.astro b/apps/website/src/components/base/Button.astro
index 0a4dc9f..438bafd 100644
--- a/apps/website/src/components/base/Button.astro
+++ b/apps/website/src/components/base/Button.astro
@@ -1,27 +1,27 @@
 ---
-import type { Icons } from "@components/icons/Icon.astro";
-import Icon from "@components/icons/Icon.astro";
-import type { HTMLAttributes } from "astro/types";
+import type { Icons } from '@components/icons/Icon.astro';
+import Icon from '@components/icons/Icon.astro';
+import type { HTMLAttributes } from 'astro/types';
 
 const styles = {
 	// TODO: adjust active / disabled colors
-	primary: "bg-blue-500 text-white hover:bg-blue-400 active:bg-blue-600 disabled:bg-blue-800 disabled:text-white-1/4",
-	secondary: "bg-blue-20 text-blue-60 border-[1px] border-blue-30 hover:bg-blue-200 active:bg-blue-300 disabled:bg-blue-50 disabled:text-blue-200",
-}
+	primary: 'bg-blue-500 text-white hover:bg-blue-400 active:bg-blue-600 disabled:bg-blue-800 disabled:text-white-1/4',
+	secondary: 'bg-blue-20 text-blue-60 border-[1px] border-blue-30 hover:bg-blue-200 active:bg-blue-300 disabled:bg-blue-50 disabled:text-blue-200',
+};
 
 const sizes = {
-	sm: "px-4 py-2 text-sm",
-	md: "px-5 py-3 text-md",
-	lg: "px-6 py-3 text-lg rounded-2xl"
-}
+	sm: 'px-4 py-2 text-sm',
+	md: 'px-5 py-3 text-md',
+	lg: 'px-6 py-3 text-lg rounded-2xl',
+};
 
 const iconSize = {
 	sm: 15,
 	md: 18,
-	lg: 24
-}
+	lg: 24,
+};
 
-interface Props extends HTMLAttributes<"button"> {
+interface Props extends HTMLAttributes<'button'> {
 	style?: keyof typeof styles
 	size?: keyof typeof sizes
 	text?: string
@@ -31,28 +31,28 @@ interface Props extends HTMLAttributes<"button"> {
 }
 
 const {
-	style = "primary",
-	size = "md",
-    text = "",
-	iconLeft = "",
-	iconRight = "",
+	style = 'primary',
+	size = 'md',
+	text = '',
+	iconLeft = '',
+	iconRight = '',
 	...rest
 } = Astro.props;
 
 const className = [
-	"flex flex-row justify-center items-center text-center focus-visible:ring-offset-4 focus-visible:outline-offset-4",
-	"rounded-xl font-medium",
+	'flex flex-row justify-center items-center text-center focus-visible:ring-offset-4 focus-visible:outline-offset-4',
+	'rounded-xl font-medium',
 	styles[style],
 	sizes[size],
-	"transition-colors",
-	rest.class
-].join(" ");
+	'transition-colors',
+	rest.class,
+].join(' ');
 
-const Element = rest.href ? "a" : "button" as any;
+const Element = rest.href ? 'a' : 'button' as any;
 ---
 
 <Element {...rest} class={className}>
 	{iconLeft && <span class="mr-2"><Icon icon={iconLeft} size={iconSize[size]}></Icon></span>}
-	{text ? text : <slot />}
+	{text || <slot />}
 	{iconRight && <span class="ml-2"><Icon icon={iconRight} size={iconSize[size]}></Icon></span>}
 </Element>
diff --git a/apps/website/src/components/base/CodeBlock.astro b/apps/website/src/components/base/CodeBlock.astro
index ceeecc0..fd2cdd6 100644
--- a/apps/website/src/components/base/CodeBlock.astro
+++ b/apps/website/src/components/base/CodeBlock.astro
@@ -19,45 +19,3 @@
 	<code></code>
 	<code><cd>&#125;</cd></code>
 </pre>
-
-<style>
-	/* thanks stackoverflow! https://stackoverflow.com/a/41309213 */
-	pre {
-		white-space: pre-wrap;
-		padding: 10px;
-		color: #546E7A;
-	}
-	pre::before {
-		counter-reset: listing;
-	}
-	pre code {
-		counter-increment: listing;
-		text-align: left;
-		float: left;
-		clear: left;
-		font-family: 'Roboto Mono', monospace !important;
-		font-size: 12px;
-		height: 1.5em;
-	}
-	pre code::before {
-		content: counter(listing) " ";
-		display: inline-block;
-		float: left;
-		height: 3em;
-		width: 2em;
-		padding: 0;
-		margin-left: auto;
-		margin-right: 10px;
-		text-align: right;
-		font-family: 'Roboto Mono', monospace !important;
-		font-size: 12px;
-	}
-
-	ca { color: #F07178; font-family: inherit; }
-	cb { color: #C792EA; font-family: inherit; }
-	cc { color: #82AAFF; font-family: inherit; }
-	cd { color: #EFF; font-family: inherit; }
-	ce { color: #89DDFF; font-family: inherit; }
-	cf { color: #C3E88D; font-family: inherit; }
-	cg { color: #F78C6C; font-family: inherit; }
-</style>
diff --git a/apps/website/src/components/base/Footer.astro b/apps/website/src/components/base/Footer.astro
index b24db5f..9bc1c61 100644
--- a/apps/website/src/components/base/Footer.astro
+++ b/apps/website/src/components/base/Footer.astro
@@ -2,6 +2,5 @@
 
 ---
 
-<footer class="flex min-h-[400px] bg-blue-100 mt-4">
-
-</footer>
+	<footer class="flex min-h-[400px] bg-blue-100 mt-4">
+	</footer>
diff --git a/apps/website/src/components/base/Header.astro b/apps/website/src/components/base/Header.astro
index d35ad9f..70dc799 100644
--- a/apps/website/src/components/base/Header.astro
+++ b/apps/website/src/components/base/Header.astro
@@ -1,40 +1,40 @@
 ---
-import type { HTMLAttributes } from "astro/types"
+import type { HTMLAttributes } from 'astro/types';
 
 const sizes = {
-	"xxl": "h1",
-    "xl": "h2",
-    "lg": "h2",
-    "md": "h3",
-    "sm": "h4",
-    "xs": "h5",
-    "xxs": "h6"
+	xxl: 'h1',
+	xl: 'h2',
+	lg: 'h2',
+	md: 'h3',
+	sm: 'h4',
+	xs: 'h5',
+	xxs: 'h6',
 };
 
-type Headers = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+type Headers = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
 
 interface Props extends HTMLAttributes<Headers> {
-    size?: keyof typeof sizes;
-	align?: "left" | "center" | "right" | "inherit";
+	size?: keyof typeof sizes
+	align?: 'left' | 'center' | 'right' | 'inherit'
 }
 
 const {
-	size = "lg",
-	align = "inherit",
+	size = 'lg',
+	align = 'inherit',
 	...attr
 } = Astro.props;
 const Element = sizes[size] as any; // Unfortunately gotta do this
 
-const className = (align == "inherit" ? "" : `text-${align} `)
-	+ (size == "xxl" ? " page-header" : "")
-	+ (attr.class ? ` ${attr.class}` : "");
+const className = (align == 'inherit' ? '' : `text-${align} `)
+	+ (size == 'xxl' ? ' page-header' : '')
+	+ (attr.class ? ` ${attr.class}` : '');
 ---
 
-<Element {...attr} class={className}>
-    <slot />
-</Element>
+	<Element {...attr} class={className}>
+		<slot />
+	</Element>
 
-<style>
+		<style>
     h1 {
 		font-size: theme("fontSize.header-lg");
 		&.page-header {
diff --git a/apps/website/src/components/base/Navbar.astro b/apps/website/src/components/base/Navbar.astro
index a3a82fe..8fa98df 100644
--- a/apps/website/src/components/base/Navbar.astro
+++ b/apps/website/src/components/base/Navbar.astro
@@ -1,21 +1,21 @@
 ---
-import config from "config";
-import type { Config } from "@webtypes/Config";
-import NavbarElement from "./NavbarElement.astro";
+import config from 'config';
+import type { Config } from '@webtypes/Config';
+import NavbarElement from './NavbarElement.astro';
 
 ---
 
-<div class="absolute w-full flex flex-row justify-center h-screen max-h-[110px] px-3">
-    <nav class="w-full max-w-[1080px] flex flex-col md:flex-row justify-between items-center">
-        <ul class="flex flex-row justify-start gap-4">
-            {(config as Config).navbar.left.map((element, index) => (
-                <NavbarElement {element} {index} />
-            ))}
-        </ul>
-        <ul class="flex flex-row justify-end gap-4">
-            {(config as Config).navbar.right.map((element, index) => (
-                <NavbarElement {element} {index} />
-            ))}
-        </ul>
-    </nav>
-</div>
+	<div class="absolute w-full flex flex-row justify-center h-screen max-h-[110px] px-3">
+		<nav class="w-full max-w-[1080px] flex flex-col md:flex-row justify-between items-center">
+			<ul class="flex flex-row justify-start gap-4">
+				{(config as Config).navbar.left.map((element, index) => (
+					<NavbarElement {element} {index} />
+				))}
+			</ul>
+			<ul class="flex flex-row justify-end gap-4">
+				{(config as Config).navbar.right.map((element, index) => (
+					<NavbarElement {element} {index} />
+				))}
+			</ul>
+		</nav>
+	</div>
diff --git a/apps/website/src/components/base/NavbarElement.astro b/apps/website/src/components/base/NavbarElement.astro
index b0f1282..17c3662 100644
--- a/apps/website/src/components/base/NavbarElement.astro
+++ b/apps/website/src/components/base/NavbarElement.astro
@@ -1,45 +1,46 @@
 ---
-import ChevronDown from "@components/icons/ChevronDown.svg";
-import type { LogoType, NavbarElement } from "@webtypes/Config";
-import ScreenOverlay from "./ScreenOverlay.astro";
-import Header from "./Header.astro";
-import Tag from "./Tag.astro";
-import Logo from "@components/logos/Logo.astro";
-import ScrollbarOverlayContainer from "./ScrollbarOverlayContainer.astro";
-import Icon from "@components/icons/Icon.astro";
+import type { LogoType, NavbarElement } from '@webtypes/Config';
+import Logo from '@components/logos/Logo.astro';
+import Icon from '@components/icons/Icon.astro';
+import ScreenOverlay from './ScreenOverlay.astro';
+import Header from './Header.astro';
+import Tag from './Tag.astro';
+import ScrollbarOverlayContainer from './ScrollbarOverlayContainer.astro';
 
 interface Props {
-    element: NavbarElement;
-    index: number;
+	element: NavbarElement
+	index: number
 }
 
 const {
-    element,
-    index
+	element,
+	index,
 } = Astro.props;
 ---
 
-<li class="sm:relative max-sm:overflow-hidden flex flex-row justify-center items-center text-center">
-    <label for={`navbar-input-${index}`} class="group">
+	<li class="sm:relative max-sm:overflow-hidden flex flex-row justify-center items-center text-center">
+		<label for={`navbar-input-${index}`} class="group">
 
-        {element.path ? (
-            <a href={element.path} class="p-2 flex flex-row justify-center items-center text-gray-700 hover:text-blue-500">
-                {element.text && element.text}
-                {element.logo && <Logo size={element.logo[1] < 0 ? undefined : element.logo[1]} logo={element.logo[0] as LogoType} />}
-                {element.dropdown && <Icon icon="chevron-down" />}
-            </a>
-        ) : (
-            <p class="p-2 flex flex-row justify-center items-center text-gray-700 hover:text-blue-500 cursor-default">
-                {element.text && element.text}
-                {element.logo && <Logo size={element.logo[1] < 0 ? undefined : element.logo[1]} logo={element.logo[0] as LogoType} />}
-                {element.dropdown && <Icon icon="chevron-down" />}
-            </p>
-        )}
+			{element.path
+				? (
+					<a href={element.path} class="p-2 flex flex-row justify-center items-center text-gray-700 hover:text-blue-500">
+						{element.text && element.text}
+						{element.logo && <Logo size={element.logo[1] < 0 ? undefined : element.logo[1]} logo={element.logo[0] as LogoType} />}
+						{element.dropdown && <Icon icon="chevron-down" />}
+					</a>
+					)
+				: (
+					<p class="p-2 flex flex-row justify-center items-center text-gray-700 hover:text-blue-500 cursor-default">
+						{element.text && element.text}
+						{element.logo && <Logo size={element.logo[1] < 0 ? undefined : element.logo[1]} logo={element.logo[0] as LogoType} />}
+						{element.dropdown && <Icon icon="chevron-down" />}
+					</p>
+					)}
 
-        {element.dropdown && (
-            <ScreenOverlay class="max-sm:group-focus-within:opacity-100" />
-            <input tabindex="-1" type="checkbox" id={`navbar-input-${index}`} class="peer appearance-none absolute">
-            <div class={`
+			{element.dropdown && (
+				<ScreenOverlay class="max-sm:group-focus-within:opacity-100" />
+					<input tabindex="-1" type="checkbox" id={`navbar-input-${index}`} class="peer appearance-none absolute">
+					<div class={`
 				transition-opacity
                 fixed md:absolute right-0 max-sm:bottom-0
                 max-sm:overflow-hidden
@@ -51,8 +52,11 @@ const {
                 group-focus-within:pointer-events-auto group-focus-within:opacity-100
                 focus-within:pointer-events-auto focus-within:opacity-100
                 hover:pointer-events-auto hover:opacity-100
-            `}>
-                <ScrollbarOverlayContainer tabindex="-1" class={`
+            `}
+					>
+						<ScrollbarOverlayContainer
+							tabindex="-1"
+							class={`
                     bg-gray-50
                     rounded-t-lg md:rounded-lg
                     transition-transform
@@ -60,30 +64,31 @@ const {
                     group-focus-within:translate-y-0
                     max-h-full md:max-h-96 overflow-y-auto
 					md:shadow-lg
-                `}>
-                    <ul class="p-4">
-                        {element.dropdown.map((item) => (
-                            <li>
-                                <a href={item.path} class="flex sm:min-w-[400px] sm:max-w-[400px]">
-                                    <div class="transition-colors text-left w-full flex flex-row justify-start rounded-md items-center px-6 py-4 gap-6 hover:bg-blue-50">
-                                        <div class="w-[36px]">
-                                            {item.logo && <Logo size={40} logo={item.logo} />}
-                                        </div>
+                `}
+						>
+							<ul class="p-4">
+								{element.dropdown.map(item => (
+									<li>
+										<a href={item.path} class="flex sm:min-w-[400px] sm:max-w-[400px]">
+										<div class="transition-colors text-left w-full flex flex-row justify-start rounded-md items-center px-6 py-4 gap-6 hover:bg-blue-50">
+										<div class="w-[36px]">
+										{item.logo && <Logo size={40} logo={item.logo} />}
+         </div>
 
-                                        <div class="flex flex-col justify-start items-start">
-                                            <div class="flex flex-row gap-2">
-                                                <Header size="sm" class="text-gray-800">{item.name}</Header>
-                                                {item.tag && <Tag>{item.tag}</Tag>}
-                                            </div>
-                                            <p class="text-sm text-gray-400 font-light">{item.description}</p>
-                                        </div>
-                                    </div>
-                                </a>
-                            </li>
-                        ))}
-                    </ul>
-                </ScrollbarOverlayContainer>
-            </div>
-        )}
-    </label>
-</li>
+										<div class="flex flex-col justify-start items-start">
+										<div class="flex flex-row gap-2">
+										<Header size="sm" class="text-gray-800">{item.name}</Header>
+										{item.tag && <Tag>{item.tag}</Tag>}
+         </div>
+										<p class="text-sm text-gray-400 font-light">{item.description}</p>
+         </div>
+         </div>
+         </a>
+         </li>
+								))}
+							</ul>
+						</ScrollbarOverlayContainer>
+					</div>
+			)}
+		</label>
+	</li>
diff --git a/apps/website/src/components/base/Paragraph.astro b/apps/website/src/components/base/Paragraph.astro
index 08fbbdd..832b296 100644
--- a/apps/website/src/components/base/Paragraph.astro
+++ b/apps/website/src/components/base/Paragraph.astro
@@ -1,31 +1,31 @@
 ---
-import type { HTMLAttributes } from "astro/types";
+import type { HTMLAttributes } from 'astro/types';
 
 const sizes = {
-	xs: "text-xs",
-	sm: "text-sm",
-	md: "text-md",
-	lg: "text-lg",
-	xl: "text-xl"
-}
+	xs: 'text-xs',
+	sm: 'text-sm',
+	md: 'text-md',
+	lg: 'text-lg',
+	xl: 'text-xl',
+};
 
-interface Props extends HTMLAttributes<"p"> {
-	text?: string,
+interface Props extends HTMLAttributes<'p'> {
+	text?: string
 	size?: keyof typeof sizes
 }
 
 const {
-	text = "",
-	size = "md",
+	text = '',
+	size = 'md',
 	...props
 } = Astro.props;
 
 const className = [
 	sizes[size],
-	props.class
-].join(" ");
+	props.class,
+].join(' ');
 ---
 
-<p class={className} {...props}>
-	{text ? text : <slot />}
-</p>
+	<p class={className} {...props}>
+		{text || <slot />}
+	</p>
diff --git a/apps/website/src/components/base/ScreenOverlay.astro b/apps/website/src/components/base/ScreenOverlay.astro
index 7be8bc5..1b97152 100644
--- a/apps/website/src/components/base/ScreenOverlay.astro
+++ b/apps/website/src/components/base/ScreenOverlay.astro
@@ -1,16 +1,16 @@
 ---
-import type { HTMLAttributes } from "astro/types";
+import type { HTMLAttributes } from 'astro/types';
 
-interface Props extends HTMLAttributes<"div"> {
-    zIndex?: number;
+interface Props extends HTMLAttributes<'div'> {
+	zIndex?: number
 }
 
 const {
-    zIndex = 0,
-    ...rest
+	zIndex = 0,
+	...rest
 } = Astro.props;
 ---
 
-<div class="pointer-events-none absolute left-0 top-0">
-    <div class={`transition-opacity fixed opacity-0 w-screen h-screen z-[${zIndex}] bg-black/30 ${rest.class}`} {...rest}></div>
-</div>
\ No newline at end of file
+	<div class="pointer-events-none absolute left-0 top-0">
+		<div class={`transition-opacity fixed opacity-0 w-screen h-screen z-[${zIndex}] bg-black/30 ${rest.class}`} {...rest}></div>
+	</div>
diff --git a/apps/website/src/components/base/ScrollbarOverlayContainer.astro b/apps/website/src/components/base/ScrollbarOverlayContainer.astro
index d8d315d..84bedf5 100644
--- a/apps/website/src/components/base/ScrollbarOverlayContainer.astro
+++ b/apps/website/src/components/base/ScrollbarOverlayContainer.astro
@@ -1,21 +1,21 @@
 ---
-import type { HTMLAttributes } from "astro/types";
+import type { HTMLAttributes } from 'astro/types';
 
-interface Props extends HTMLAttributes<"div"> {
+interface Props extends HTMLAttributes<'div'> {
 
 }
 
 const { ...attr } = Astro.props;
 ---
 
-<div {...attr}>
-    <slot></slot>
-</div>
+	<div {...attr}>
+		<slot></slot>
+	</div>
 
-<style>
+		<style>
 @media (hover: hover) {
     div {
-        
+
     }
 
     div::-webkit-scrollbar {
@@ -48,4 +48,4 @@ const { ...attr } = Astro.props;
         background-color: #00000040;
     }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/apps/website/src/components/base/Section.astro b/apps/website/src/components/base/Section.astro
index bb7a062..51d9fa1 100644
--- a/apps/website/src/components/base/Section.astro
+++ b/apps/website/src/components/base/Section.astro
@@ -1,40 +1,42 @@
 ---
-import type { HTMLAttributes } from "astro/types";
+import type { HTMLAttributes } from 'astro/types';
 
-interface Props extends HTMLAttributes<"section"> {
-	maxWidth?: "none" | String;
-	colReverse?: boolean;
-	wrapperClass?: string;
-	wFull?: boolean;
+interface Props extends HTMLAttributes<'section'> {
+	maxWidth?: 'none' | String
+	colReverse?: boolean
+	wrapperClass?: string
+	wFull?: boolean
 }
 
 const {
-	maxWidth = "1080px",
+	maxWidth = '1080px',
 	colReverse = true,
-	wrapperClass = "",
+	wrapperClass = '',
 	wFull = true,
 	...props
 } = Astro.props;
 
-const twoColumn = Astro.slots.has("left") || Astro.slots.has("right");
+const twoColumn = Astro.slots.has('left') || Astro.slots.has('right');
 
-const className = `max-w-[${maxWidth}] ${wFull ? "w-full" : ""} px-5 md:p-0 flex gap-4`
-	+ (twoColumn ? ` ${maxWidth == "none" ? "justify-center" : "justify-between md:justify-evenly lg:justify-between"} ${colReverse ? "flex-col-reverse" : "flex-col"} md:flex-row md:items-center md:flex-row` : "")
-	+ (props.class ? ` ${props.class}` : "");
+const className = `max-w-[${maxWidth}] ${wFull ? 'w-full' : ''} px-5 md:p-0 flex gap-4${
+	 twoColumn ? ` ${maxWidth == 'none' ? 'justify-center' : 'justify-between md:justify-evenly lg:justify-between'} ${colReverse ? 'flex-col-reverse' : 'flex-col'} md:flex-row md:items-center md:flex-row` : ''
+	 }${props.class ? ` ${props.class}` : ''}`;
 ---
 
-<section class={`w-full flex justify-center ${wrapperClass ?? ""}`}>
-	<div class={className} {...props}>
-		{twoColumn ? (
-			<div class="flex flex-col items-start text-left relative">
-				<slot name="left"></slot>
-			</div>
+	<section class={`w-full flex justify-center ${wrapperClass ?? ''}`}>
+		<div class={className} {...props}>
+			{twoColumn
+				? (
+					<div class="flex flex-col items-start text-left relative">
+						<slot name="left"></slot>
+					</div>
 
-			<div class="flex flex-col items-start text-left relative">
-				<slot name="right"></slot>
-			</div>
-		) : (
-			<slot></slot>
-		)}
-	</div>
-</section>
+						<div class="flex flex-col items-start text-left relative">
+							<slot name="right"></slot>
+						</div>
+					)
+				: (
+					<slot></slot>
+					)}
+		</div>
+	</section>
diff --git a/apps/website/src/components/base/Tag.astro b/apps/website/src/components/base/Tag.astro
index e6fd34f..b903344 100644
--- a/apps/website/src/components/base/Tag.astro
+++ b/apps/website/src/components/base/Tag.astro
@@ -1,14 +1,13 @@
 ---
-import type { HTMLAttributes } from "astro/types";
+import type { HTMLAttributes } from 'astro/types';
 
-interface Props extends HTMLAttributes<"span"> {}
+interface Props extends HTMLAttributes<'span'> {}
 
 const { ...attr } = Astro.props;
 ---
 
-<div class="transition-colors text-blue-500 hover:bg-blue-500/20 text-xs font-medium bg-blue-500/10 rounded-md flex flex-col justify-center items-center px-2 py-0.5">
-    <span {...attr}>
-        <slot></slot>
-    </span>
-</div>
-
+	<div class="transition-colors text-blue-500 hover:bg-blue-500/20 text-xs font-medium bg-blue-500/10 rounded-md flex flex-col justify-center items-center px-2 py-0.5">
+		<span {...attr}>
+			<slot></slot>
+		</span>
+	</div>
-- 
cgit