From 36870785bcc80ad7122e5c3bc45742af0663b2bd Mon Sep 17 00:00:00 2001
From: z0x <homelab@home.arpa>
Date: Thu, 24 Apr 2025 22:12:22 -0400
Subject: [PATCH] refactor: biome lint

---
 components.json                             |  36 +-
 package.json                                | 122 ++---
 src/components/BlogCard.astro               |  22 +-
 src/components/Breadcrumbs.astro            |  28 +-
 src/components/Container.astro              |   6 +-
 src/components/Footer.astro                 |   8 +-
 src/components/Head.astro                   |  24 +-
 src/components/Header.astro                 |   8 +-
 src/components/Link.astro                   |  16 +-
 src/components/PostNavigation.astro         |  10 +-
 src/components/SocialIcons.astro            |  14 +-
 src/components/TableOfContents.astro        |  28 +-
 src/components/TableOfContentsHeading.astro |   6 +-
 src/components/ui/avatar.tsx                | 106 ++---
 src/components/ui/badge.tsx                 |  76 ++--
 src/components/ui/breadcrumb.tsx            | 174 +++----
 src/components/ui/card.tsx                  | 150 +++----
 src/components/ui/dropdown-menu.tsx         | 380 ++++++++--------
 src/components/ui/mode-toggle.tsx           | 118 ++---
 src/components/ui/pagination.tsx            | 309 +++++++------
 src/components/ui/scroll-area.tsx           |  92 ++--
 src/components/ui/separator.tsx             |  40 +-
 src/content.config.ts                       |  30 +-
 src/layouts/Layout.astro                    |  16 +-
 src/lib/server-utils.ts                     |  44 +-
 src/lib/utils.ts                            |  24 +-
 src/pages/404.astro                         |  14 +-
 src/pages/blog/[...page].astro              |  50 ++-
 src/pages/index.astro                       |  22 +-
 src/pages/robots.txt.ts                     |  10 +-
 src/pages/rss.xml.ts                        |  44 +-
 src/styles/callout.css                      | 473 ++++++++++----------
 src/styles/global.css                       | 132 +++---
 src/types.ts                                |  22 +-
 tsconfig.json                               |  20 +-
 35 files changed, 1344 insertions(+), 1330 deletions(-)

diff --git a/components.json b/components.json
index 8ff1f8e..d4ff7dc 100644
--- a/components.json
+++ b/components.json
@@ -1,20 +1,20 @@
 {
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "new-york",
-  "rsc": false,
-  "tsx": true,
-  "tailwind": {
-    "config": "tailwind.config.ts",
-    "css": "src/styles/global.css",
-    "baseColor": "neutral",
-    "cssVariables": true,
-    "prefix": ""
-  },
-  "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils",
-    "ui": "@/components/ui",
-    "lib": "@/lib",
-    "hooks": "@/hooks"
-  }
+	"$schema": "https://ui.shadcn.com/schema.json",
+	"style": "new-york",
+	"rsc": false,
+	"tsx": true,
+	"tailwind": {
+		"config": "tailwind.config.ts",
+		"css": "src/styles/global.css",
+		"baseColor": "neutral",
+		"cssVariables": true,
+		"prefix": ""
+	},
+	"aliases": {
+		"components": "@/components",
+		"utils": "@/lib/utils",
+		"ui": "@/components/ui",
+		"lib": "@/lib",
+		"hooks": "@/hooks"
+	}
 }
diff --git a/package.json b/package.json
index 4a0aaf5..d60d3f4 100644
--- a/package.json
+++ b/package.json
@@ -1,63 +1,63 @@
 {
-  "name": "astro-erudite",
-  "type": "module",
-  "version": "1.4.2",
-  "private": true,
-  "scripts": {
-    "dev": "astro dev",
-    "start": "astro dev",
-    "build": "astro build",
-    "preview": "astro preview",
-    "astro": "astro",
-    "prettier": "prettier --write .",
-    "postinstall": "patch-package"
-  },
-  "dependencies": {
-    "@astrojs/markdown-remark": "^6.3.1",
-    "@astrojs/partytown": "^2.1.4",
-    "@astrojs/react": "^4.2.5",
-    "@astrojs/rss": "^4.0.11",
-    "@astrojs/sitemap": "^3.3.1",
-    "@expressive-code/plugin-collapsible-sections": "^0.40.2",
-    "@expressive-code/plugin-line-numbers": "^0.40.2",
-    "@fontsource-variable/geist": "^5.2.5",
-    "@fontsource-variable/geist-mono": "^5.2.5",
-    "@iconify-json/lucide": "^1.2.39",
-    "@iconify-json/simple-icons": "^1.2.33",
-    "@r4ai/remark-callout": "^0.6.2",
-    "@radix-ui/react-avatar": "^1.1.7",
-    "@radix-ui/react-dropdown-menu": "^2.1.12",
-    "@radix-ui/react-icons": "^1.3.2",
-    "@radix-ui/react-scroll-area": "^1.2.6",
-    "@radix-ui/react-separator": "^1.1.4",
-    "@radix-ui/react-slot": "^1.2.0",
-    "@tailwindcss/vite": "^4.1.4",
-    "@types/react": "19.0.0",
-    "@types/react-dom": "19.0.0",
-    "@yeskunall/astro-umami": "^0.0.5",
-    "astro": "^5.7.5",
-    "astro-expressive-code": "^0.40.2",
-    "astro-icon": "^1.1.5",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "lucide-react": "^0.469.0",
-    "patch-package": "^8.0.0",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "rehype-document": "^7.0.3",
-    "rehype-external-links": "^3.0.0",
-    "rehype-katex": "^7.0.1",
-    "rehype-pretty-code": "^0.14.1",
-    "remark-emoji": "^5.0.1",
-    "remark-math": "^6.0.0",
-    "remark-sectionize": "^2.1.0",
-    "remark-toc": "^9.0.0",
-    "tailwind-merge": "^3.2.0",
-    "tailwindcss": "^4.1.4",
-    "typescript": "^5.8.3"
-  },
-  "devDependencies": {
-    "@biomejs/biome": "^1.9.4"
-  },
-  "trustedDependencies": ["@biomejs/biome", "esbuild", "sharp"]
+	"name": "astro-erudite",
+	"type": "module",
+	"version": "1.4.2",
+	"private": true,
+	"scripts": {
+		"dev": "astro dev",
+		"start": "astro dev",
+		"build": "astro build",
+		"preview": "astro preview",
+		"astro": "astro",
+		"prettier": "prettier --write .",
+		"postinstall": "patch-package"
+	},
+	"dependencies": {
+		"@astrojs/markdown-remark": "^6.3.1",
+		"@astrojs/partytown": "^2.1.4",
+		"@astrojs/react": "^4.2.5",
+		"@astrojs/rss": "^4.0.11",
+		"@astrojs/sitemap": "^3.3.1",
+		"@expressive-code/plugin-collapsible-sections": "^0.40.2",
+		"@expressive-code/plugin-line-numbers": "^0.40.2",
+		"@fontsource-variable/geist": "^5.2.5",
+		"@fontsource-variable/geist-mono": "^5.2.5",
+		"@iconify-json/lucide": "^1.2.39",
+		"@iconify-json/simple-icons": "^1.2.33",
+		"@r4ai/remark-callout": "^0.6.2",
+		"@radix-ui/react-avatar": "^1.1.7",
+		"@radix-ui/react-dropdown-menu": "^2.1.12",
+		"@radix-ui/react-icons": "^1.3.2",
+		"@radix-ui/react-scroll-area": "^1.2.6",
+		"@radix-ui/react-separator": "^1.1.4",
+		"@radix-ui/react-slot": "^1.2.0",
+		"@tailwindcss/vite": "^4.1.4",
+		"@types/react": "19.0.0",
+		"@types/react-dom": "19.0.0",
+		"@yeskunall/astro-umami": "^0.0.5",
+		"astro": "^5.7.5",
+		"astro-expressive-code": "^0.40.2",
+		"astro-icon": "^1.1.5",
+		"class-variance-authority": "^0.7.1",
+		"clsx": "^2.1.1",
+		"lucide-react": "^0.469.0",
+		"patch-package": "^8.0.0",
+		"react": "19.0.0",
+		"react-dom": "19.0.0",
+		"rehype-document": "^7.0.3",
+		"rehype-external-links": "^3.0.0",
+		"rehype-katex": "^7.0.1",
+		"rehype-pretty-code": "^0.14.1",
+		"remark-emoji": "^5.0.1",
+		"remark-math": "^6.0.0",
+		"remark-sectionize": "^2.1.0",
+		"remark-toc": "^9.0.0",
+		"tailwind-merge": "^3.2.0",
+		"tailwindcss": "^4.1.4",
+		"typescript": "^5.8.3"
+	},
+	"devDependencies": {
+		"@biomejs/biome": "^1.9.4"
+	},
+	"trustedDependencies": ["@biomejs/biome", "esbuild", "sharp"]
 }
diff --git a/src/components/BlogCard.astro b/src/components/BlogCard.astro
index d6bfcbf..5d9240b 100644
--- a/src/components/BlogCard.astro
+++ b/src/components/BlogCard.astro
@@ -1,20 +1,20 @@
 ---
-import { Separator } from '@/components/ui/separator'
-import { formatDate, readingTime } from '@/lib/utils'
-import { Image } from 'astro:assets'
-import type { CollectionEntry } from 'astro:content'
-import Link from './Link.astro'
+import { Image } from "astro:assets";
+import type { CollectionEntry } from "astro:content";
+import { Separator } from "@/components/ui/separator";
+import { formatDate, readingTime } from "@/lib/utils";
+import Link from "./Link.astro";
 
 type Props = {
-  entry: CollectionEntry<'blog'>
-}
+	entry: CollectionEntry<"blog">;
+};
 
 const { entry } = Astro.props as {
-  entry: CollectionEntry<'blog'>
-}
+	entry: CollectionEntry<"blog">;
+};
 
-const formattedDate = formatDate(entry.data.date)
-const readTime = readingTime(entry.body!)
+const formattedDate = formatDate(entry.data.date);
+const readTime = readingTime(entry.body!);
 ---
 
 <div
diff --git a/src/components/Breadcrumbs.astro b/src/components/Breadcrumbs.astro
index 87baa17..4eb6c2b 100644
--- a/src/components/Breadcrumbs.astro
+++ b/src/components/Breadcrumbs.astro
@@ -1,26 +1,26 @@
 ---
 import {
-  Breadcrumb,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbList,
-  BreadcrumbPage,
-  BreadcrumbSeparator,
-} from '@/components/ui/breadcrumb'
-import { Icon } from 'astro-icon/components'
+	Breadcrumb,
+	BreadcrumbItem,
+	BreadcrumbLink,
+	BreadcrumbList,
+	BreadcrumbPage,
+	BreadcrumbSeparator,
+} from "@/components/ui/breadcrumb";
+import { Icon } from "astro-icon/components";
 
 export interface BreadcrumbItem {
-  href?: string
-  label: string
-  icon?: string
+	href?: string;
+	label: string;
+	icon?: string;
 }
 
 interface Props {
-  items: BreadcrumbItem[]
-  class?: string
+	items: BreadcrumbItem[];
+	class?: string;
 }
 
-const { items, class: className } = Astro.props
+const { items, class: className } = Astro.props;
 ---
 
 <Breadcrumb className={className}>
diff --git a/src/components/Container.astro b/src/components/Container.astro
index fe3d4e3..c26cf8c 100644
--- a/src/components/Container.astro
+++ b/src/components/Container.astro
@@ -1,11 +1,11 @@
 ---
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 interface Props {
-  class?: string
+	class?: string;
 }
 
-const { class: className } = Astro.props
+const { class: className } = Astro.props;
 ---
 
 <div class={cn('mx-auto max-w-(--breakpoint-md) px-4', className)}>
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 3779da4..b782b3b 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -1,8 +1,8 @@
 ---
-import Container from '@/components/Container.astro'
-import { Separator } from '@/components/ui/separator'
-import { SOCIAL_LINKS } from '@/consts'
-import SocialIcons from './SocialIcons.astro'
+import Container from "@/components/Container.astro";
+import { Separator } from "@/components/ui/separator";
+import { SOCIAL_LINKS } from "@/consts";
+import SocialIcons from "./SocialIcons.astro";
 ---
 
 <footer class="py-4">
diff --git a/src/components/Head.astro b/src/components/Head.astro
index 7867fd1..2c7dd6e 100644
--- a/src/components/Head.astro
+++ b/src/components/Head.astro
@@ -1,22 +1,22 @@
 ---
-import '@fontsource-variable/geist'
-import '@fontsource-variable/geist-mono'
-import '../styles/callout.css'
-import '../styles/global.css'
-import '../styles/typography.css'
+import "@fontsource-variable/geist";
+import "@fontsource-variable/geist-mono";
+import "../styles/callout.css";
+import "../styles/global.css";
+import "../styles/typography.css";
 
-import { SITE } from '@/consts'
-import { ClientRouter } from 'astro:transitions'
+import { ClientRouter } from "astro:transitions";
+import { SITE } from "@/consts";
 
 interface Props {
-  title: string
-  description: string
-  image?: string
+	title: string;
+	description: string;
+	image?: string;
 }
 
-const canonicalURL = new URL(Astro.url.pathname, Astro.site)
+const canonicalURL = new URL(Astro.url.pathname, Astro.site);
 
-const { title, description, image = '/static/twitter-card.png' } = Astro.props
+const { title, description, image = "/static/twitter-card.png" } = Astro.props;
 ---
 
 <meta charset="utf-8" />
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 2f09021..b0685f7 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -1,8 +1,8 @@
 ---
-import Container from '@/components/Container.astro'
-import Link from '@/components/Link.astro'
-import { ModeToggle } from '@/components/ui/mode-toggle'
-import { SITE } from '@/consts'
+import Container from "@/components/Container.astro";
+import Link from "@/components/Link.astro";
+import { ModeToggle } from "@/components/ui/mode-toggle";
+import { SITE } from "@/consts";
 ---
 
 <header
diff --git a/src/components/Link.astro b/src/components/Link.astro
index 197a299..e7ddc70 100644
--- a/src/components/Link.astro
+++ b/src/components/Link.astro
@@ -1,15 +1,15 @@
 ---
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 type Props = {
-  href: string
-  external?: boolean
-  class?: string
-  underline?: boolean
-  [key: string]: any
-}
+	href: string;
+	external?: boolean;
+	class?: string;
+	underline?: boolean;
+	[key: string]: any;
+};
 
-const { href, external, class: className, underline, ...rest } = Astro.props
+const { href, external, class: className, underline, ...rest } = Astro.props;
 ---
 
 <a
diff --git a/src/components/PostNavigation.astro b/src/components/PostNavigation.astro
index a735ca9..a3394fa 100644
--- a/src/components/PostNavigation.astro
+++ b/src/components/PostNavigation.astro
@@ -1,10 +1,10 @@
 ---
-import Link from '@/components/Link.astro'
-import { buttonVariants } from '@/components/ui/button'
-import { cn } from '@/lib/utils'
-import { Icon } from 'astro-icon/components'
+import Link from "@/components/Link.astro";
+import { buttonVariants } from "@/components/ui/button";
+import { cn } from "@/lib/utils";
+import { Icon } from "astro-icon/components";
 
-const { prevPost, nextPost } = Astro.props
+const { prevPost, nextPost } = Astro.props;
 ---
 
 <div class="col-start-2 grid grid-cols-1 gap-4 sm:grid-cols-2">
diff --git a/src/components/SocialIcons.astro b/src/components/SocialIcons.astro
index 236bb6a..27b1d97 100644
--- a/src/components/SocialIcons.astro
+++ b/src/components/SocialIcons.astro
@@ -1,15 +1,15 @@
 ---
-import Link from '@/components/Link.astro'
-import { buttonVariants } from '@/components/ui/button'
-import { ICON_MAP } from '@/consts'
-import type { SocialLink } from '@/types'
-import { Icon } from 'astro-icon/components'
+import Link from "@/components/Link.astro";
+import { buttonVariants } from "@/components/ui/button";
+import { ICON_MAP } from "@/consts";
+import type { SocialLink } from "@/types";
+import { Icon } from "astro-icon/components";
 
 interface Props {
-  links: SocialLink[]
+	links: SocialLink[];
 }
 
-const { links } = Astro.props
+const { links } = Astro.props;
 ---
 
 <ul class="flex flex-wrap gap-2" role="list">
diff --git a/src/components/TableOfContents.astro b/src/components/TableOfContents.astro
index 0c18c0f..616cd4a 100644
--- a/src/components/TableOfContents.astro
+++ b/src/components/TableOfContents.astro
@@ -1,23 +1,23 @@
 ---
-import { ScrollArea } from '@/components/ui/scroll-area'
-import { cn } from '@/lib/utils'
-import type { MarkdownHeading } from 'astro'
-import { Icon } from 'astro-icon/components'
+import { ScrollArea } from "@/components/ui/scroll-area";
+import { cn } from "@/lib/utils";
+import type { MarkdownHeading } from "astro";
+import { Icon } from "astro-icon/components";
 
 type Props = {
-  headings: MarkdownHeading[]
-}
+	headings: MarkdownHeading[];
+};
 
-const { headings } = Astro.props
+const { headings } = Astro.props;
 
 function getHeadingMargin(depth: number): string {
-  const margins: Record<number, string> = {
-    3: 'ml-4',
-    4: 'ml-8',
-    5: 'ml-12',
-    6: 'ml-16',
-  }
-  return margins[depth] || ''
+	const margins: Record<number, string> = {
+		3: "ml-4",
+		4: "ml-8",
+		5: "ml-12",
+		6: "ml-16",
+	};
+	return margins[depth] || "";
 }
 ---
 
diff --git a/src/components/TableOfContentsHeading.astro b/src/components/TableOfContentsHeading.astro
index 8d32b48..bacf061 100644
--- a/src/components/TableOfContentsHeading.astro
+++ b/src/components/TableOfContentsHeading.astro
@@ -1,8 +1,8 @@
 ---
-import Link from './Link.astro'
-import type { Heading } from './TableOfContents.astro'
+import Link from "./Link.astro";
+import type { Heading } from "./TableOfContents.astro";
 
-const { heading } = Astro.props
+const { heading } = Astro.props;
 ---
 
 <li
diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx
index d6328d7..b5b3976 100644
--- a/src/components/ui/avatar.tsx
+++ b/src/components/ui/avatar.tsx
@@ -1,74 +1,74 @@
-import * as React from 'react'
-import * as AvatarPrimitive from '@radix-ui/react-avatar'
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 function Avatar({
-  className,
-  ...props
+	className,
+	...props
 }: React.ComponentProps<typeof AvatarPrimitive.Root>) {
-  return (
-    <AvatarPrimitive.Root
-      data-slot="avatar"
-      className={cn(
-        'relative flex size-8 shrink-0 overflow-hidden rounded-full',
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<AvatarPrimitive.Root
+			data-slot="avatar"
+			className={cn(
+				"relative flex size-8 shrink-0 overflow-hidden rounded-full",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 function AvatarImage({
-  className,
-  ...props
+	className,
+	...props
 }: React.ComponentProps<typeof AvatarPrimitive.Image>) {
-  return (
-    <AvatarPrimitive.Image
-      data-slot="avatar-image"
-      className={cn('aspect-square size-full', className)}
-      {...props}
-    />
-  )
+	return (
+		<AvatarPrimitive.Image
+			data-slot="avatar-image"
+			className={cn("aspect-square size-full", className)}
+			{...props}
+		/>
+	);
 }
 
 function AvatarFallback({
-  className,
-  ...props
+	className,
+	...props
 }: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {
-  return (
-    <AvatarPrimitive.Fallback
-      data-slot="avatar-fallback"
-      className={cn(
-        'bg-muted flex size-full items-center justify-center rounded-full',
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<AvatarPrimitive.Fallback
+			data-slot="avatar-fallback"
+			className={cn(
+				"bg-muted flex size-full items-center justify-center rounded-full",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 const AvatarComponent: React.FC<AvatarComponentProps> = ({
-  src,
-  alt,
-  fallback,
-  className,
+	src,
+	alt,
+	fallback,
+	className,
 }) => {
-  return (
-    <Avatar className={className}>
-      <AvatarImage src={src} alt={alt} />
-      <AvatarFallback>{fallback}</AvatarFallback>
-    </Avatar>
-  )
-}
+	return (
+		<Avatar className={className}>
+			<AvatarImage src={src} alt={alt} />
+			<AvatarFallback>{fallback}</AvatarFallback>
+		</Avatar>
+	);
+};
 
-export default AvatarComponent
+export default AvatarComponent;
 
 interface AvatarComponentProps {
-  src?: string
-  alt?: string
-  fallback: string
-  className?: string
+	src?: string;
+	alt?: string;
+	fallback: string;
+	className?: string;
 }
 
-export { Avatar, AvatarImage, AvatarFallback }
+export { Avatar, AvatarImage, AvatarFallback };
diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx
index 0cb4f6f..225770f 100644
--- a/src/components/ui/badge.tsx
+++ b/src/components/ui/badge.tsx
@@ -1,46 +1,46 @@
-import * as React from 'react'
-import { Slot } from '@radix-ui/react-slot'
-import { cva, type VariantProps } from 'class-variance-authority'
+import { Slot } from "@radix-ui/react-slot";
+import { type VariantProps, cva } from "class-variance-authority";
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 const badgeVariants = cva(
-  'inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden',
-  {
-    variants: {
-      variant: {
-        default:
-          'border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90',
-        secondary:
-          'border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90',
-        destructive:
-          'border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70',
-        outline:
-          'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground',
-      },
-    },
-    defaultVariants: {
-      variant: 'default',
-    },
-  },
-)
+	"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
+	{
+		variants: {
+			variant: {
+				default:
+					"border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+				secondary:
+					"border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+				destructive:
+					"border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70",
+				outline:
+					"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+			},
+		},
+		defaultVariants: {
+			variant: "default",
+		},
+	},
+);
 
 function Badge({
-  className,
-  variant,
-  asChild = false,
-  ...props
-}: React.ComponentProps<'span'> &
-  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
-  const Comp = asChild ? Slot : 'span'
+	className,
+	variant,
+	asChild = false,
+	...props
+}: React.ComponentProps<"span"> &
+	VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
+	const Comp = asChild ? Slot : "span";
 
-  return (
-    <Comp
-      data-slot="badge"
-      className={cn(badgeVariants({ variant }), className)}
-      {...props}
-    />
-  )
+	return (
+		<Comp
+			data-slot="badge"
+			className={cn(badgeVariants({ variant }), className)}
+			{...props}
+		/>
+	);
 }
 
-export { Badge, badgeVariants }
+export { Badge, badgeVariants };
diff --git a/src/components/ui/breadcrumb.tsx b/src/components/ui/breadcrumb.tsx
index 0fa892c..9e0bd69 100644
--- a/src/components/ui/breadcrumb.tsx
+++ b/src/components/ui/breadcrumb.tsx
@@ -1,108 +1,108 @@
-import * as React from 'react'
-import { Slot } from '@radix-ui/react-slot'
-import { cn } from '@/lib/utils'
-import { ChevronRightIcon, DotsHorizontalIcon } from '@radix-ui/react-icons'
+import { cn } from "@/lib/utils";
+import { ChevronRightIcon, DotsHorizontalIcon } from "@radix-ui/react-icons";
+import { Slot } from "@radix-ui/react-slot";
+import type * as React from "react";
 
-function Breadcrumb({ ...props }: React.ComponentProps<'nav'>) {
-  return <nav aria-label="breadcrumb" data-slot="breadcrumb" {...props} />
+function Breadcrumb({ ...props }: React.ComponentProps<"nav">) {
+	return <nav aria-label="breadcrumb" data-slot="breadcrumb" {...props} />;
 }
 
-function BreadcrumbList({ className, ...props }: React.ComponentProps<'ol'>) {
-  return (
-    <ol
-      data-slot="breadcrumb-list"
-      className={cn(
-        'text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5',
-        className,
-      )}
-      {...props}
-    />
-  )
+function BreadcrumbList({ className, ...props }: React.ComponentProps<"ol">) {
+	return (
+		<ol
+			data-slot="breadcrumb-list"
+			className={cn(
+				"text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
-function BreadcrumbItem({ className, ...props }: React.ComponentProps<'li'>) {
-  return (
-    <li
-      data-slot="breadcrumb-item"
-      className={cn('inline-flex items-center gap-1.5', className)}
-      {...props}
-    />
-  )
+function BreadcrumbItem({ className, ...props }: React.ComponentProps<"li">) {
+	return (
+		<li
+			data-slot="breadcrumb-item"
+			className={cn("inline-flex items-center gap-1.5", className)}
+			{...props}
+		/>
+	);
 }
 
 function BreadcrumbLink({
-  asChild,
-  className,
-  ...props
-}: React.ComponentProps<'a'> & {
-  asChild?: boolean
+	asChild,
+	className,
+	...props
+}: React.ComponentProps<"a"> & {
+	asChild?: boolean;
 }) {
-  const Comp = asChild ? Slot : 'a'
+	const Comp = asChild ? Slot : "a";
 
-  return (
-    <Comp
-      data-slot="breadcrumb-link"
-      className={cn('hover:text-foreground transition-colors', className)}
-      {...props}
-    />
-  )
+	return (
+		<Comp
+			data-slot="breadcrumb-link"
+			className={cn("hover:text-foreground transition-colors", className)}
+			{...props}
+		/>
+	);
 }
 
-function BreadcrumbPage({ className, ...props }: React.ComponentProps<'span'>) {
-  return (
-    <span
-      data-slot="breadcrumb-page"
-      role="link"
-      aria-disabled="true"
-      aria-current="page"
-      className={cn('text-foreground font-normal', className)}
-      {...props}
-    />
-  )
+function BreadcrumbPage({ className, ...props }: React.ComponentProps<"span">) {
+	return (
+		<span
+			data-slot="breadcrumb-page"
+			role="link"
+			aria-disabled="true"
+			aria-current="page"
+			className={cn("text-foreground font-normal", className)}
+			{...props}
+		/>
+	);
 }
 
 function BreadcrumbSeparator({
-  children,
-  className,
-  ...props
-}: React.ComponentProps<'li'>) {
-  return (
-    <li
-      data-slot="breadcrumb-separator"
-      role="presentation"
-      aria-hidden="true"
-      className={cn('[&>svg]:size-3.5', className)}
-      {...props}
-    >
-      {children ?? <ChevronRightIcon />}
-    </li>
-  )
+	children,
+	className,
+	...props
+}: React.ComponentProps<"li">) {
+	return (
+		<li
+			data-slot="breadcrumb-separator"
+			role="presentation"
+			aria-hidden="true"
+			className={cn("[&>svg]:size-3.5", className)}
+			{...props}
+		>
+			{children ?? <ChevronRightIcon />}
+		</li>
+	);
 }
 
 function BreadcrumbEllipsis({
-  className,
-  ...props
-}: React.ComponentProps<'span'>) {
-  return (
-    <span
-      data-slot="breadcrumb-ellipsis"
-      role="presentation"
-      aria-hidden="true"
-      className={cn('flex size-9 items-center justify-center', className)}
-      {...props}
-    >
-      <DotsHorizontalIcon className="size-4" />
-      <span className="sr-only">More</span>
-    </span>
-  )
+	className,
+	...props
+}: React.ComponentProps<"span">) {
+	return (
+		<span
+			data-slot="breadcrumb-ellipsis"
+			role="presentation"
+			aria-hidden="true"
+			className={cn("flex size-9 items-center justify-center", className)}
+			{...props}
+		>
+			<DotsHorizontalIcon className="size-4" />
+			<span className="sr-only">More</span>
+		</span>
+	);
 }
 
 export {
-  Breadcrumb,
-  BreadcrumbList,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbPage,
-  BreadcrumbSeparator,
-  BreadcrumbEllipsis,
-}
+	Breadcrumb,
+	BreadcrumbList,
+	BreadcrumbItem,
+	BreadcrumbLink,
+	BreadcrumbPage,
+	BreadcrumbSeparator,
+	BreadcrumbEllipsis,
+};
diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx
index b3a70d8..608225e 100644
--- a/src/components/ui/card.tsx
+++ b/src/components/ui/card.tsx
@@ -1,92 +1,92 @@
-import * as React from 'react'
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
-function Card({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card"
-      className={cn(
-        'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
-        className,
-      )}
-      {...props}
-    />
-  )
+function Card({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card"
+			className={cn(
+				"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
-function CardHeader({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card-header"
-      className={cn(
-        '@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6',
-        className,
-      )}
-      {...props}
-    />
-  )
+function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card-header"
+			className={cn(
+				"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
-function CardTitle({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card-title"
-      className={cn('leading-none font-medium', className)}
-      {...props}
-    />
-  )
+function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card-title"
+			className={cn("leading-none font-medium", className)}
+			{...props}
+		/>
+	);
 }
 
-function CardDescription({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card-description"
-      className={cn('text-muted-foreground text-sm', className)}
-      {...props}
-    />
-  )
+function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card-description"
+			className={cn("text-muted-foreground text-sm", className)}
+			{...props}
+		/>
+	);
 }
 
-function CardAction({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card-action"
-      className={cn(
-        'col-start-2 row-span-2 row-start-1 self-start justify-self-end',
-        className,
-      )}
-      {...props}
-    />
-  )
+function CardAction({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card-action"
+			className={cn(
+				"col-start-2 row-span-2 row-start-1 self-start justify-self-end",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
-function CardContent({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card-content"
-      className={cn('px-6', className)}
-      {...props}
-    />
-  )
+function CardContent({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card-content"
+			className={cn("px-6", className)}
+			{...props}
+		/>
+	);
 }
 
-function CardFooter({ className, ...props }: React.ComponentProps<'div'>) {
-  return (
-    <div
-      data-slot="card-footer"
-      className={cn('flex items-center px-6 [.border-t]:pt-6', className)}
-      {...props}
-    />
-  )
+function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
+	return (
+		<div
+			data-slot="card-footer"
+			className={cn("flex items-center px-6 [.border-t]:pt-6", className)}
+			{...props}
+		/>
+	);
 }
 
 export {
-  Card,
-  CardHeader,
-  CardFooter,
-  CardTitle,
-  CardAction,
-  CardDescription,
-  CardContent,
-}
+	Card,
+	CardHeader,
+	CardFooter,
+	CardTitle,
+	CardAction,
+	CardDescription,
+	CardContent,
+};
diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx
index 58a0ca3..8c993ed 100644
--- a/src/components/ui/dropdown-menu.tsx
+++ b/src/components/ui/dropdown-menu.tsx
@@ -1,255 +1,255 @@
-import * as React from 'react'
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
-import { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react'
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
+import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 function DropdownMenu({
-  ...props
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
-  return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />
+	return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />;
 }
 
 function DropdownMenuPortal({
-  ...props
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {
-  return (
-    <DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
-  )
+	return (
+		<DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
+	);
 }
 
 function DropdownMenuTrigger({
-  ...props
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {
-  return (
-    <DropdownMenuPrimitive.Trigger
-      data-slot="dropdown-menu-trigger"
-      {...props}
-    />
-  )
+	return (
+		<DropdownMenuPrimitive.Trigger
+			data-slot="dropdown-menu-trigger"
+			{...props}
+		/>
+	);
 }
 
 function DropdownMenuContent({
-  className,
-  sideOffset = 4,
-  ...props
+	className,
+	sideOffset = 4,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {
-  return (
-    <DropdownMenuPrimitive.Portal>
-      <DropdownMenuPrimitive.Content
-        data-slot="dropdown-menu-content"
-        sideOffset={sideOffset}
-        className={cn(
-          'bg-popover text-popover-foreground z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
-          className,
-        )}
-        {...props}
-      />
-    </DropdownMenuPrimitive.Portal>
-  )
+	return (
+		<DropdownMenuPrimitive.Portal>
+			<DropdownMenuPrimitive.Content
+				data-slot="dropdown-menu-content"
+				sideOffset={sideOffset}
+				className={cn(
+					"bg-popover text-popover-foreground z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
+					className,
+				)}
+				{...props}
+			/>
+		</DropdownMenuPrimitive.Portal>
+	);
 }
 
 function DropdownMenuGroup({
-  ...props
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {
-  return (
-    <DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
-  )
+	return (
+		<DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
+	);
 }
 
 function DropdownMenuItem({
-  className,
-  inset,
-  variant = 'default',
-  ...props
+	className,
+	inset,
+	variant = "default",
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
-  inset?: boolean
-  variant?: 'default' | 'destructive'
+	inset?: boolean;
+	variant?: "default" | "destructive";
 }) {
-  return (
-    <DropdownMenuPrimitive.Item
-      data-slot="dropdown-menu-item"
-      data-inset={inset}
-      data-variant={variant}
-      className={cn(
-        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<DropdownMenuPrimitive.Item
+			data-slot="dropdown-menu-item"
+			data-inset={inset}
+			data-variant={variant}
+			className={cn(
+				"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 function DropdownMenuCheckboxItem({
-  className,
-  children,
-  checked,
-  ...props
+	className,
+	children,
+	checked,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {
-  return (
-    <DropdownMenuPrimitive.CheckboxItem
-      data-slot="dropdown-menu-checkbox-item"
-      className={cn(
-        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className,
-      )}
-      checked={checked}
-      {...props}
-    >
-      <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
-        <DropdownMenuPrimitive.ItemIndicator>
-          <CheckIcon className="size-4" />
-        </DropdownMenuPrimitive.ItemIndicator>
-      </span>
-      {children}
-    </DropdownMenuPrimitive.CheckboxItem>
-  )
+	return (
+		<DropdownMenuPrimitive.CheckboxItem
+			data-slot="dropdown-menu-checkbox-item"
+			className={cn(
+				"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+				className,
+			)}
+			checked={checked}
+			{...props}
+		>
+			<span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+				<DropdownMenuPrimitive.ItemIndicator>
+					<CheckIcon className="size-4" />
+				</DropdownMenuPrimitive.ItemIndicator>
+			</span>
+			{children}
+		</DropdownMenuPrimitive.CheckboxItem>
+	);
 }
 
 function DropdownMenuRadioGroup({
-  ...props
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {
-  return (
-    <DropdownMenuPrimitive.RadioGroup
-      data-slot="dropdown-menu-radio-group"
-      {...props}
-    />
-  )
+	return (
+		<DropdownMenuPrimitive.RadioGroup
+			data-slot="dropdown-menu-radio-group"
+			{...props}
+		/>
+	);
 }
 
 function DropdownMenuRadioItem({
-  className,
-  children,
-  ...props
+	className,
+	children,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {
-  return (
-    <DropdownMenuPrimitive.RadioItem
-      data-slot="dropdown-menu-radio-item"
-      className={cn(
-        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        className,
-      )}
-      {...props}
-    >
-      <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
-        <DropdownMenuPrimitive.ItemIndicator>
-          <CircleIcon className="size-2 fill-current" />
-        </DropdownMenuPrimitive.ItemIndicator>
-      </span>
-      {children}
-    </DropdownMenuPrimitive.RadioItem>
-  )
+	return (
+		<DropdownMenuPrimitive.RadioItem
+			data-slot="dropdown-menu-radio-item"
+			className={cn(
+				"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+				className,
+			)}
+			{...props}
+		>
+			<span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+				<DropdownMenuPrimitive.ItemIndicator>
+					<CircleIcon className="size-2 fill-current" />
+				</DropdownMenuPrimitive.ItemIndicator>
+			</span>
+			{children}
+		</DropdownMenuPrimitive.RadioItem>
+	);
 }
 
 function DropdownMenuLabel({
-  className,
-  inset,
-  ...props
+	className,
+	inset,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
-  inset?: boolean
+	inset?: boolean;
 }) {
-  return (
-    <DropdownMenuPrimitive.Label
-      data-slot="dropdown-menu-label"
-      data-inset={inset}
-      className={cn(
-        'px-2 py-1.5 text-sm font-medium data-[inset]:pl-8',
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<DropdownMenuPrimitive.Label
+			data-slot="dropdown-menu-label"
+			data-inset={inset}
+			className={cn(
+				"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 function DropdownMenuSeparator({
-  className,
-  ...props
+	className,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {
-  return (
-    <DropdownMenuPrimitive.Separator
-      data-slot="dropdown-menu-separator"
-      className={cn('bg-border -mx-1 my-1 h-px', className)}
-      {...props}
-    />
-  )
+	return (
+		<DropdownMenuPrimitive.Separator
+			data-slot="dropdown-menu-separator"
+			className={cn("bg-border -mx-1 my-1 h-px", className)}
+			{...props}
+		/>
+	);
 }
 
 function DropdownMenuShortcut({
-  className,
-  ...props
-}: React.ComponentProps<'span'>) {
-  return (
-    <span
-      data-slot="dropdown-menu-shortcut"
-      className={cn(
-        'text-muted-foreground ml-auto text-xs tracking-widest',
-        className,
-      )}
-      {...props}
-    />
-  )
+	className,
+	...props
+}: React.ComponentProps<"span">) {
+	return (
+		<span
+			data-slot="dropdown-menu-shortcut"
+			className={cn(
+				"text-muted-foreground ml-auto text-xs tracking-widest",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 function DropdownMenuSub({
-  ...props
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {
-  return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />
+	return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />;
 }
 
 function DropdownMenuSubTrigger({
-  className,
-  inset,
-  children,
-  ...props
+	className,
+	inset,
+	children,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
-  inset?: boolean
+	inset?: boolean;
 }) {
-  return (
-    <DropdownMenuPrimitive.SubTrigger
-      data-slot="dropdown-menu-sub-trigger"
-      data-inset={inset}
-      className={cn(
-        'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8',
-        className,
-      )}
-      {...props}
-    >
-      {children}
-      <ChevronRightIcon className="ml-auto size-4" />
-    </DropdownMenuPrimitive.SubTrigger>
-  )
+	return (
+		<DropdownMenuPrimitive.SubTrigger
+			data-slot="dropdown-menu-sub-trigger"
+			data-inset={inset}
+			className={cn(
+				"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8",
+				className,
+			)}
+			{...props}
+		>
+			{children}
+			<ChevronRightIcon className="ml-auto size-4" />
+		</DropdownMenuPrimitive.SubTrigger>
+	);
 }
 
 function DropdownMenuSubContent({
-  className,
-  ...props
+	className,
+	...props
 }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {
-  return (
-    <DropdownMenuPrimitive.SubContent
-      data-slot="dropdown-menu-sub-content"
-      className={cn(
-        'bg-popover text-popover-foreground z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<DropdownMenuPrimitive.SubContent
+			data-slot="dropdown-menu-sub-content"
+			className={cn(
+				"bg-popover text-popover-foreground z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 export {
-  DropdownMenu,
-  DropdownMenuPortal,
-  DropdownMenuTrigger,
-  DropdownMenuContent,
-  DropdownMenuGroup,
-  DropdownMenuLabel,
-  DropdownMenuItem,
-  DropdownMenuCheckboxItem,
-  DropdownMenuRadioGroup,
-  DropdownMenuRadioItem,
-  DropdownMenuSeparator,
-  DropdownMenuShortcut,
-  DropdownMenuSub,
-  DropdownMenuSubTrigger,
-  DropdownMenuSubContent,
-}
+	DropdownMenu,
+	DropdownMenuPortal,
+	DropdownMenuTrigger,
+	DropdownMenuContent,
+	DropdownMenuGroup,
+	DropdownMenuLabel,
+	DropdownMenuItem,
+	DropdownMenuCheckboxItem,
+	DropdownMenuRadioGroup,
+	DropdownMenuRadioItem,
+	DropdownMenuSeparator,
+	DropdownMenuShortcut,
+	DropdownMenuSub,
+	DropdownMenuSubTrigger,
+	DropdownMenuSubContent,
+};
diff --git a/src/components/ui/mode-toggle.tsx b/src/components/ui/mode-toggle.tsx
index d608e66..32b70af 100644
--- a/src/components/ui/mode-toggle.tsx
+++ b/src/components/ui/mode-toggle.tsx
@@ -1,70 +1,70 @@
-import { Button } from '@/components/ui/button'
+import { Button } from "@/components/ui/button";
 import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu'
-import { Laptop, Moon, Sun } from 'lucide-react'
-import * as React from 'react'
+	DropdownMenu,
+	DropdownMenuContent,
+	DropdownMenuItem,
+	DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { Laptop, Moon, Sun } from "lucide-react";
+import * as React from "react";
 
 export function ModeToggle() {
-  const [theme, setThemeState] = React.useState<
-    'theme-light' | 'dark' | 'system'
-  >('theme-light')
+	const [theme, setThemeState] = React.useState<
+		"theme-light" | "dark" | "system"
+	>("theme-light");
 
-  React.useEffect(() => {
-    const isDarkMode = document.documentElement.classList.contains('dark')
-    setThemeState(isDarkMode ? 'dark' : 'theme-light')
-  }, [])
+	React.useEffect(() => {
+		const isDarkMode = document.documentElement.classList.contains("dark");
+		setThemeState(isDarkMode ? "dark" : "theme-light");
+	}, []);
 
-  React.useEffect(() => {
-    const isDark =
-      theme === 'dark' ||
-      (theme === 'system' &&
-        window.matchMedia('(prefers-color-scheme: dark)').matches)
+	React.useEffect(() => {
+		const isDark =
+			theme === "dark" ||
+			(theme === "system" &&
+				window.matchMedia("(prefers-color-scheme: dark)").matches);
 
-    document.documentElement.classList.add('disable-transitions')
+		document.documentElement.classList.add("disable-transitions");
 
-    document.documentElement.classList[isDark ? 'add' : 'remove']('dark')
+		document.documentElement.classList[isDark ? "add" : "remove"]("dark");
 
-    window
-      .getComputedStyle(document.documentElement)
-      .getPropertyValue('opacity')
+		window
+			.getComputedStyle(document.documentElement)
+			.getPropertyValue("opacity");
 
-    requestAnimationFrame(() => {
-      document.documentElement.classList.remove('disable-transitions')
-    })
-  }, [theme])
+		requestAnimationFrame(() => {
+			document.documentElement.classList.remove("disable-transitions");
+		});
+	}, [theme]);
 
-  return (
-    <DropdownMenu modal={false}>
-      <DropdownMenuTrigger asChild>
-        <Button
-          variant="outline"
-          size="icon"
-          className="group"
-          title="Toggle theme"
-        >
-          <Sun className="size-4 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" />
-          <Moon className="absolute size-4 scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" />
-          <span className="sr-only">Toggle theme</span>
-        </Button>
-      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="bg-background">
-        <DropdownMenuItem onClick={() => setThemeState('theme-light')}>
-          <Sun className="mr-2 size-4" />
-          <span>Light</span>
-        </DropdownMenuItem>
-        <DropdownMenuItem onClick={() => setThemeState('dark')}>
-          <Moon className="mr-2 size-4" />
-          <span>Dark</span>
-        </DropdownMenuItem>
-        <DropdownMenuItem onClick={() => setThemeState('system')}>
-          <Laptop className="mr-2 size-4" />
-          <span>System</span>
-        </DropdownMenuItem>
-      </DropdownMenuContent>
-    </DropdownMenu>
-  )
+	return (
+		<DropdownMenu modal={false}>
+			<DropdownMenuTrigger asChild>
+				<Button
+					variant="outline"
+					size="icon"
+					className="group"
+					title="Toggle theme"
+				>
+					<Sun className="size-4 scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90" />
+					<Moon className="absolute size-4 scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0" />
+					<span className="sr-only">Toggle theme</span>
+				</Button>
+			</DropdownMenuTrigger>
+			<DropdownMenuContent align="end" className="bg-background">
+				<DropdownMenuItem onClick={() => setThemeState("theme-light")}>
+					<Sun className="mr-2 size-4" />
+					<span>Light</span>
+				</DropdownMenuItem>
+				<DropdownMenuItem onClick={() => setThemeState("dark")}>
+					<Moon className="mr-2 size-4" />
+					<span>Dark</span>
+				</DropdownMenuItem>
+				<DropdownMenuItem onClick={() => setThemeState("system")}>
+					<Laptop className="mr-2 size-4" />
+					<span>System</span>
+				</DropdownMenuItem>
+			</DropdownMenuContent>
+		</DropdownMenu>
+	);
 }
diff --git a/src/components/ui/pagination.tsx b/src/components/ui/pagination.tsx
index ad0d40c..c1f6c21 100644
--- a/src/components/ui/pagination.tsx
+++ b/src/components/ui/pagination.tsx
@@ -1,195 +1,194 @@
-import * as React from 'react'
 import {
-  ChevronLeftIcon,
-  ChevronRightIcon,
-  MoreHorizontalIcon,
-} from 'lucide-react'
+	ChevronLeftIcon,
+	ChevronRightIcon,
+	MoreHorizontalIcon,
+} from "lucide-react";
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
-import { Button, buttonVariants } from '@/components/ui/button'
+import { type Button, buttonVariants } from "@/components/ui/button";
+import { cn } from "@/lib/utils";
 
-function Pagination({ className, ...props }: React.ComponentProps<'nav'>) {
-  return (
-    <nav
-      role="navigation"
-      aria-label="pagination"
-      data-slot="pagination"
-      className={cn('mx-auto flex w-full justify-center', className)}
-      {...props}
-    />
-  )
+function Pagination({ className, ...props }: React.ComponentProps<"nav">) {
+	return (
+		<nav
+			aria-label="pagination"
+			data-slot="pagination"
+			className={cn("mx-auto flex w-full justify-center", className)}
+			{...props}
+		/>
+	);
 }
 
 function PaginationContent({
-  className,
-  ...props
-}: React.ComponentProps<'ul'>) {
-  return (
-    <ul
-      data-slot="pagination-content"
-      className={cn('flex flex-row items-center gap-1', className)}
-      {...props}
-    />
-  )
+	className,
+	...props
+}: React.ComponentProps<"ul">) {
+	return (
+		<ul
+			data-slot="pagination-content"
+			className={cn("flex flex-row items-center gap-1", className)}
+			{...props}
+		/>
+	);
 }
 
-function PaginationItem({ ...props }: React.ComponentProps<'li'>) {
-  return <li data-slot="pagination-item" {...props} />
+function PaginationItem({ ...props }: React.ComponentProps<"li">) {
+	return <li data-slot="pagination-item" {...props} />;
 }
 
 type PaginationLinkProps = {
-  isActive?: boolean
-  isDisabled?: boolean
-} & Pick<React.ComponentProps<typeof Button>, 'size'> &
-  React.ComponentProps<'a'>
+	isActive?: boolean;
+	isDisabled?: boolean;
+} & Pick<React.ComponentProps<typeof Button>, "size"> &
+	React.ComponentProps<"a">;
 
 function PaginationLink({
-  className,
-  isActive,
-  isDisabled,
-  size = 'icon',
-  ...props
+	className,
+	isActive,
+	isDisabled,
+	size = "icon",
+	...props
 }: PaginationLinkProps) {
-  return (
-    <a
-      aria-current={isActive ? 'page' : undefined}
-      data-slot="pagination-link"
-      data-active={isActive}
-      data-disabled={isDisabled}
-      className={cn(
-        buttonVariants({
-          variant: isActive ? 'outline' : 'ghost',
-          size,
-        }),
-        isDisabled && 'pointer-events-none opacity-50',
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<a
+			aria-current={isActive ? "page" : undefined}
+			data-slot="pagination-link"
+			data-active={isActive}
+			data-disabled={isDisabled}
+			className={cn(
+				buttonVariants({
+					variant: isActive ? "outline" : "ghost",
+					size,
+				}),
+				isDisabled && "pointer-events-none opacity-50",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
 function PaginationPrevious({
-  className,
-  isDisabled,
-  ...props
+	className,
+	isDisabled,
+	...props
 }: React.ComponentProps<typeof PaginationLink>) {
-  return (
-    <PaginationLink
-      aria-label="Go to previous page"
-      size="default"
-      className={cn('gap-1 px-2.5 sm:pl-2.5', className)}
-      isDisabled={isDisabled}
-      {...props}
-    >
-      <ChevronLeftIcon />
-      <span className="hidden sm:block">Previous</span>
-    </PaginationLink>
-  )
+	return (
+		<PaginationLink
+			aria-label="Go to previous page"
+			size="default"
+			className={cn("gap-1 px-2.5 sm:pl-2.5", className)}
+			isDisabled={isDisabled}
+			{...props}
+		>
+			<ChevronLeftIcon />
+			<span className="hidden sm:block">Previous</span>
+		</PaginationLink>
+	);
 }
 
 function PaginationNext({
-  className,
-  isDisabled,
-  ...props
+	className,
+	isDisabled,
+	...props
 }: React.ComponentProps<typeof PaginationLink>) {
-  return (
-    <PaginationLink
-      aria-label="Go to next page"
-      size="default"
-      className={cn('gap-1 px-2.5 sm:pr-2.5', className)}
-      isDisabled={isDisabled}
-      {...props}
-    >
-      <span className="hidden sm:block">Next</span>
-      <ChevronRightIcon />
-    </PaginationLink>
-  )
+	return (
+		<PaginationLink
+			aria-label="Go to next page"
+			size="default"
+			className={cn("gap-1 px-2.5 sm:pr-2.5", className)}
+			isDisabled={isDisabled}
+			{...props}
+		>
+			<span className="hidden sm:block">Next</span>
+			<ChevronRightIcon />
+		</PaginationLink>
+	);
 }
 
 function PaginationEllipsis({
-  className,
-  ...props
-}: React.ComponentProps<'span'>) {
-  return (
-    <span
-      aria-hidden
-      data-slot="pagination-ellipsis"
-      className={cn('flex size-9 items-center justify-center', className)}
-      {...props}
-    >
-      <MoreHorizontalIcon className="size-4" />
-      <span className="sr-only">More pages</span>
-    </span>
-  )
+	className,
+	...props
+}: React.ComponentProps<"span">) {
+	return (
+		<span
+			aria-hidden
+			data-slot="pagination-ellipsis"
+			className={cn("flex size-9 items-center justify-center", className)}
+			{...props}
+		>
+			<MoreHorizontalIcon className="size-4" />
+			<span className="sr-only">More pages</span>
+		</span>
+	);
 }
 
 const PaginationComponent: React.FC<PaginationProps> = ({
-  currentPage,
-  totalPages,
-  baseUrl,
+	currentPage,
+	totalPages,
+	baseUrl,
 }) => {
-  const pages = Array.from({ length: totalPages }, (_, i) => i + 1)
+	const pages = Array.from({ length: totalPages }, (_, i) => i + 1);
 
-  const getPageUrl = (page: number) => {
-    if (page === 1) return baseUrl
-    return `${baseUrl}${page}`
-  }
+	const getPageUrl = (page: number) => {
+		if (page === 1) return baseUrl;
+		return `${baseUrl}${page}`;
+	};
 
-  return (
-    <Pagination>
-      <PaginationContent className="flex-wrap">
-        <PaginationItem>
-          <PaginationPrevious
-            href={currentPage > 1 ? getPageUrl(currentPage - 1) : undefined}
-            isDisabled={currentPage === 1}
-          />
-        </PaginationItem>
+	return (
+		<Pagination>
+			<PaginationContent className="flex-wrap">
+				<PaginationItem>
+					<PaginationPrevious
+						href={currentPage > 1 ? getPageUrl(currentPage - 1) : undefined}
+						isDisabled={currentPage === 1}
+					/>
+				</PaginationItem>
 
-        {pages.map((page) => (
-          <PaginationItem key={page}>
-            <PaginationLink
-              href={getPageUrl(page)}
-              isActive={page === currentPage}
-            >
-              {page}
-            </PaginationLink>
-          </PaginationItem>
-        ))}
+				{pages.map((page) => (
+					<PaginationItem key={page}>
+						<PaginationLink
+							href={getPageUrl(page)}
+							isActive={page === currentPage}
+						>
+							{page}
+						</PaginationLink>
+					</PaginationItem>
+				))}
 
-        {totalPages > 5 && (
-          <PaginationItem>
-            <PaginationEllipsis />
-          </PaginationItem>
-        )}
+				{totalPages > 5 && (
+					<PaginationItem>
+						<PaginationEllipsis />
+					</PaginationItem>
+				)}
 
-        <PaginationItem>
-          <PaginationNext
-            href={
-              currentPage < totalPages ? getPageUrl(currentPage + 1) : undefined
-            }
-            isDisabled={currentPage === totalPages}
-          />
-        </PaginationItem>
-      </PaginationContent>
-    </Pagination>
-  )
-}
+				<PaginationItem>
+					<PaginationNext
+						href={
+							currentPage < totalPages ? getPageUrl(currentPage + 1) : undefined
+						}
+						isDisabled={currentPage === totalPages}
+					/>
+				</PaginationItem>
+			</PaginationContent>
+		</Pagination>
+	);
+};
 
 interface PaginationProps {
-  currentPage: number
-  totalPages: number
-  baseUrl: string
+	currentPage: number;
+	totalPages: number;
+	baseUrl: string;
 }
 
-export default PaginationComponent
+export default PaginationComponent;
 
 export {
-  Pagination,
-  PaginationContent,
-  PaginationLink,
-  PaginationItem,
-  PaginationPrevious,
-  PaginationNext,
-  PaginationEllipsis,
-}
+	Pagination,
+	PaginationContent,
+	PaginationLink,
+	PaginationItem,
+	PaginationPrevious,
+	PaginationNext,
+	PaginationEllipsis,
+};
diff --git a/src/components/ui/scroll-area.tsx b/src/components/ui/scroll-area.tsx
index 852201a..01ed9ed 100644
--- a/src/components/ui/scroll-area.tsx
+++ b/src/components/ui/scroll-area.tsx
@@ -1,56 +1,56 @@
-import * as React from 'react'
-import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area'
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 function ScrollArea({
-  className,
-  children,
-  ...props
+	className,
+	children,
+	...props
 }: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {
-  return (
-    <ScrollAreaPrimitive.Root
-      data-slot="scroll-area"
-      className={cn('relative', className)}
-      {...props}
-    >
-      <ScrollAreaPrimitive.Viewport
-        data-slot="scroll-area-viewport"
-        className="ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1"
-      >
-        {children}
-      </ScrollAreaPrimitive.Viewport>
-      <ScrollBar />
-      <ScrollAreaPrimitive.Corner />
-    </ScrollAreaPrimitive.Root>
-  )
+	return (
+		<ScrollAreaPrimitive.Root
+			data-slot="scroll-area"
+			className={cn("relative", className)}
+			{...props}
+		>
+			<ScrollAreaPrimitive.Viewport
+				data-slot="scroll-area-viewport"
+				className="ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1"
+			>
+				{children}
+			</ScrollAreaPrimitive.Viewport>
+			<ScrollBar />
+			<ScrollAreaPrimitive.Corner />
+		</ScrollAreaPrimitive.Root>
+	);
 }
 
 function ScrollBar({
-  className,
-  orientation = 'vertical',
-  ...props
+	className,
+	orientation = "vertical",
+	...props
 }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {
-  return (
-    <ScrollAreaPrimitive.ScrollAreaScrollbar
-      data-slot="scroll-area-scrollbar"
-      orientation={orientation}
-      className={cn(
-        'flex touch-none p-px transition-colors select-none',
-        orientation === 'vertical' &&
-          'h-full w-2.5 border-l border-l-transparent',
-        orientation === 'horizontal' &&
-          'h-2.5 flex-col border-t border-t-transparent',
-        className,
-      )}
-      {...props}
-    >
-      <ScrollAreaPrimitive.ScrollAreaThumb
-        data-slot="scroll-area-thumb"
-        className="bg-border relative flex-1 rounded-full"
-      />
-    </ScrollAreaPrimitive.ScrollAreaScrollbar>
-  )
+	return (
+		<ScrollAreaPrimitive.ScrollAreaScrollbar
+			data-slot="scroll-area-scrollbar"
+			orientation={orientation}
+			className={cn(
+				"flex touch-none p-px transition-colors select-none",
+				orientation === "vertical" &&
+					"h-full w-2.5 border-l border-l-transparent",
+				orientation === "horizontal" &&
+					"h-2.5 flex-col border-t border-t-transparent",
+				className,
+			)}
+			{...props}
+		>
+			<ScrollAreaPrimitive.ScrollAreaThumb
+				data-slot="scroll-area-thumb"
+				className="bg-border relative flex-1 rounded-full"
+			/>
+		</ScrollAreaPrimitive.ScrollAreaScrollbar>
+	);
 }
 
-export { ScrollArea, ScrollBar }
+export { ScrollArea, ScrollBar };
diff --git a/src/components/ui/separator.tsx b/src/components/ui/separator.tsx
index 778b46d..7802362 100644
--- a/src/components/ui/separator.tsx
+++ b/src/components/ui/separator.tsx
@@ -1,26 +1,26 @@
-import * as React from 'react'
-import * as SeparatorPrimitive from '@radix-ui/react-separator'
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
+import type * as React from "react";
 
-import { cn } from '@/lib/utils'
+import { cn } from "@/lib/utils";
 
 function Separator({
-  className,
-  orientation = 'horizontal',
-  decorative = true,
-  ...props
+	className,
+	orientation = "horizontal",
+	decorative = true,
+	...props
 }: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
-  return (
-    <SeparatorPrimitive.Root
-      data-slot="separator-root"
-      decorative={decorative}
-      orientation={orientation}
-      className={cn(
-        'bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px',
-        className,
-      )}
-      {...props}
-    />
-  )
+	return (
+		<SeparatorPrimitive.Root
+			data-slot="separator-root"
+			decorative={decorative}
+			orientation={orientation}
+			className={cn(
+				"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
+				className,
+			)}
+			{...props}
+		/>
+	);
 }
 
-export { Separator }
+export { Separator };
diff --git a/src/content.config.ts b/src/content.config.ts
index 9d870fc..6c2f1e3 100644
--- a/src/content.config.ts
+++ b/src/content.config.ts
@@ -1,18 +1,18 @@
-import { glob } from 'astro/loaders'
-import { defineCollection, z } from 'astro:content'
+import { defineCollection, z } from "astro:content";
+import { glob } from "astro/loaders";
 
 const blog = defineCollection({
-  loader: glob({ pattern: '**/*.{md,mdx}', base: './src/content' }),
-  schema: ({ image }) =>
-    z.object({
-      title: z.string(),
-      description: z.string(),
-      date: z.coerce.date(),
-      image: image().optional(),
-      tags: z.array(z.string()).optional(),
-      authors: z.array(z.string()).optional(),
-      draft: z.boolean().optional(),
-    }),
-})
+	loader: glob({ pattern: "**/*.{md,mdx}", base: "./src/content" }),
+	schema: ({ image }) =>
+		z.object({
+			title: z.string(),
+			description: z.string(),
+			date: z.coerce.date(),
+			image: image().optional(),
+			tags: z.array(z.string()).optional(),
+			authors: z.array(z.string()).optional(),
+			draft: z.boolean().optional(),
+		}),
+});
 
-export const collections = { blog }
+export const collections = { blog };
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 32f71a1..87e692c 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,15 +1,15 @@
 ---
-import Footer from '@/components/Footer.astro'
-import Head from '@/components/Head.astro'
-import Header from '@/components/Header.astro'
-import { SITE } from '@/consts'
+import Footer from "@/components/Footer.astro";
+import Head from "@/components/Head.astro";
+import Header from "@/components/Header.astro";
+import { SITE } from "@/consts";
 
 type Props = {
-  title: string
-  description: string
-}
+	title: string;
+	description: string;
+};
 
-const { title, description } = Astro.props
+const { title, description } = Astro.props;
 ---
 
 <!doctype html>
diff --git a/src/lib/server-utils.ts b/src/lib/server-utils.ts
index 3fe917b..134cd45 100644
--- a/src/lib/server-utils.ts
+++ b/src/lib/server-utils.ts
@@ -1,27 +1,27 @@
-import { getEntry } from 'astro:content'
+import { getEntry } from "astro:content";
 
 export async function parseAuthors(authors: string[]) {
-  if (!authors || authors.length === 0) return []
+	if (!authors || authors.length === 0) return [];
 
-  const parseAuthor = async (id: string) => {
-    try {
-      const author = await getEntry('authors', id)
-      return {
-        id,
-        name: author?.data?.name || id,
-        avatar: author?.data?.avatar || '/static/logo.png',
-        isRegistered: !!author,
-      }
-    } catch (error) {
-      console.error(`Error fetching author with id ${id}:`, error)
-      return {
-        id,
-        name: id,
-        avatar: '/static/logo.png',
-        isRegistered: false,
-      }
-    }
-  }
+	const parseAuthor = async (id: string) => {
+		try {
+			const author = await getEntry("authors", id);
+			return {
+				id,
+				name: author?.data?.name || id,
+				avatar: author?.data?.avatar || "/static/logo.png",
+				isRegistered: !!author,
+			};
+		} catch (error) {
+			console.error(`Error fetching author with id ${id}:`, error);
+			return {
+				id,
+				name: id,
+				avatar: "/static/logo.png",
+				isRegistered: false,
+			};
+		}
+	};
 
-  return await Promise.all(authors.map(parseAuthor))
+	return await Promise.all(authors.map(parseAuthor));
 }
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 3900a3d..c730512 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -1,21 +1,21 @@
-import { type ClassValue, clsx } from 'clsx'
-import { twMerge } from 'tailwind-merge'
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
 
 export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
+	return twMerge(clsx(inputs));
 }
 
 export function formatDate(date: Date) {
-  return Intl.DateTimeFormat('en-US', {
-    year: 'numeric',
-    month: 'long',
-    day: 'numeric',
-  }).format(date)
+	return Intl.DateTimeFormat("en-US", {
+		year: "numeric",
+		month: "long",
+		day: "numeric",
+	}).format(date);
 }
 
 export function readingTime(html: string) {
-  const textOnly = html.replace(/<[^>]+>/g, '')
-  const wordCount = textOnly.split(/\s+/).length
-  const readingTimeMinutes = (wordCount / 200 + 1).toFixed()
-  return `${readingTimeMinutes} min read`
+	const textOnly = html.replace(/<[^>]+>/g, "");
+	const wordCount = textOnly.split(/\s+/).length;
+	const readingTimeMinutes = (wordCount / 200 + 1).toFixed();
+	return `${readingTimeMinutes} min read`;
 }
diff --git a/src/pages/404.astro b/src/pages/404.astro
index 29a416f..62101a4 100644
--- a/src/pages/404.astro
+++ b/src/pages/404.astro
@@ -1,11 +1,11 @@
 ---
-import Breadcrumbs from '@/components/Breadcrumbs.astro'
-import Container from '@/components/Container.astro'
-import Link from '@/components/Link.astro'
-import { buttonVariants } from '@/components/ui/button'
-import { SITE } from '@/consts'
-import Layout from '@/layouts/Layout.astro'
-import { cn } from '@/lib/utils'
+import Breadcrumbs from "@/components/Breadcrumbs.astro";
+import Container from "@/components/Container.astro";
+import Link from "@/components/Link.astro";
+import { buttonVariants } from "@/components/ui/button";
+import { SITE } from "@/consts";
+import Layout from "@/layouts/Layout.astro";
+import { cn } from "@/lib/utils";
 ---
 
 <Layout title="404" description={SITE.description}>
diff --git a/src/pages/blog/[...page].astro b/src/pages/blog/[...page].astro
index ae30dc0..4af7658 100644
--- a/src/pages/blog/[...page].astro
+++ b/src/pages/blog/[...page].astro
@@ -1,37 +1,39 @@
 ---
-import BlogCard from '@/components/BlogCard.astro'
-import Breadcrumbs from '@/components/Breadcrumbs.astro'
-import Container from '@/components/Container.astro'
-import PaginationComponent from '@/components/ui/pagination'
-import { SITE } from '@/consts'
-import Layout from '@/layouts/Layout.astro'
-import type { PaginateFunction } from 'astro'
-import { type CollectionEntry, getCollection } from 'astro:content'
+import { type CollectionEntry, getCollection } from "astro:content";
+import BlogCard from "@/components/BlogCard.astro";
+import Breadcrumbs from "@/components/Breadcrumbs.astro";
+import Container from "@/components/Container.astro";
+import PaginationComponent from "@/components/ui/pagination";
+import { SITE } from "@/consts";
+import Layout from "@/layouts/Layout.astro";
+import type { PaginateFunction } from "astro";
 
 export async function getStaticPaths({
-  paginate,
+	paginate,
 }: {
-  paginate: PaginateFunction
+	paginate: PaginateFunction;
 }) {
-  const allPosts = await getCollection('blog', ({ data }) => !data.draft)
-  return paginate(
-    allPosts.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf()),
-    { pageSize: SITE.postsPerPage },
-  )
+	const allPosts = await getCollection("blog", ({ data }) => !data.draft);
+	return paginate(
+		allPosts.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf()),
+		{ pageSize: SITE.postsPerPage },
+	);
 }
 
-const { page } = Astro.props
+const { page } = Astro.props;
 
 const postsByYear = page.data.reduce(
-  (acc: Record<string, CollectionEntry<'blog'>[]>, post) => {
-    const year = post.data.date.getFullYear().toString()
-    ;(acc[year] ??= []).push(post)
-    return acc
-  },
-  {},
-)
+	(acc: Record<string, CollectionEntry<"blog">[]>, post) => {
+		const year = post.data.date.getFullYear().toString();
+		(acc[year] ??= []).push(post);
+		return acc;
+	},
+	{},
+);
 
-const years = Object.keys(postsByYear).sort((a, b) => parseInt(b) - parseInt(a))
+const years = Object.keys(postsByYear).sort(
+	(a, b) => Number.parseInt(b) - Number.parseInt(a),
+);
 ---
 
 <Layout title="Blog" description="Blog">
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 6778359..9dd1b88 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,16 +1,16 @@
 ---
-import BlogCard from '@/components/BlogCard.astro'
-import Container from '@/components/Container.astro'
-import Link from '@/components/Link.astro'
-import { buttonVariants } from '@/components/ui/button'
-import { SITE } from '@/consts'
-import Layout from '@/layouts/Layout.astro'
-import { getCollection } from 'astro:content'
+import { getCollection } from "astro:content";
+import BlogCard from "@/components/BlogCard.astro";
+import Container from "@/components/Container.astro";
+import Link from "@/components/Link.astro";
+import { buttonVariants } from "@/components/ui/button";
+import { SITE } from "@/consts";
+import Layout from "@/layouts/Layout.astro";
 
-const blog = (await getCollection('blog'))
-  .filter((post) => !post.data.draft)
-  .sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
-  .slice(0, SITE.featuredPostCount)
+const blog = (await getCollection("blog"))
+	.filter((post) => !post.data.draft)
+	.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
+	.slice(0, SITE.featuredPostCount);
 ---
 
 <Layout title="Home" description={SITE.description}>
diff --git a/src/pages/robots.txt.ts b/src/pages/robots.txt.ts
index 8fa2c2f..7ac4e0e 100644
--- a/src/pages/robots.txt.ts
+++ b/src/pages/robots.txt.ts
@@ -1,4 +1,4 @@
-import type { APIRoute } from 'astro'
+import type { APIRoute } from "astro";
 
 const getRobotsTxt = (sitemapURL: URL) => `
 User-agent: AI2Bot
@@ -49,9 +49,9 @@ User-agent: YouBot
 Disallow: /
 
 Sitemap: ${sitemapURL.href}
-`
+`;
 
 export const GET: APIRoute = ({ site }) => {
-  const sitemapURL = new URL('sitemap-index.xml', site)
-  return new Response(getRobotsTxt(sitemapURL))
-}
+	const sitemapURL = new URL("sitemap-index.xml", site);
+	return new Response(getRobotsTxt(sitemapURL));
+};
diff --git a/src/pages/rss.xml.ts b/src/pages/rss.xml.ts
index deef5e0..22477bd 100644
--- a/src/pages/rss.xml.ts
+++ b/src/pages/rss.xml.ts
@@ -1,26 +1,26 @@
-import { SITE } from '@/consts'
-import rss from '@astrojs/rss'
-import type { APIContext } from 'astro'
-import { getCollection } from 'astro:content'
+import { getCollection } from "astro:content";
+import { SITE } from "@/consts";
+import rss from "@astrojs/rss";
+import type { APIContext } from "astro";
 
 export async function GET(context: APIContext) {
-  try {
-    const posts = await getCollection('blog', ({ data }) => !data.draft)
-    posts.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
+	try {
+		const posts = await getCollection("blog", ({ data }) => !data.draft);
+		posts.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
 
-    return rss({
-      title: SITE.title,
-      description: SITE.description,
-      site: context.site ?? SITE.href,
-      items: posts.map((post) => ({
-        title: post.data.title,
-        description: post.data.description,
-        pubDate: post.data.date,
-        link: `/blog/${post.id}/`,
-      })),
-    })
-  } catch (error) {
-    console.error('Error generating RSS feed:', error)
-    return new Response('Error generating RSS feed', { status: 500 })
-  }
+		return rss({
+			title: SITE.title,
+			description: SITE.description,
+			site: context.site ?? SITE.href,
+			items: posts.map((post) => ({
+				title: post.data.title,
+				description: post.data.description,
+				pubDate: post.data.date,
+				link: `/blog/${post.id}/`,
+			})),
+		});
+	} catch (error) {
+		console.error("Error generating RSS feed:", error);
+		return new Response("Error generating RSS feed", { status: 500 });
+	}
 }
diff --git a/src/styles/callout.css b/src/styles/callout.css
index 3e70d21..040464e 100644
--- a/src/styles/callout.css
+++ b/src/styles/callout.css
@@ -1,386 +1,397 @@
-@import 'tailwindcss';
+@import "tailwindcss";
 
 [data-callout] {
-  & {
-    @apply my-6 space-y-2 rounded-lg border border-blue-600/20 bg-blue-400/20 p-4 pb-5 dark:border-blue-800/20 dark:bg-blue-600/10;
-  }
+	& {
+		@apply my-6 space-y-2 rounded-lg border border-blue-600/20 bg-blue-400/20 p-4 pb-5 dark:border-blue-800/20 dark:bg-blue-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply flex flex-row items-start gap-2 p-0 font-bold text-blue-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply flex flex-row items-start gap-2 p-0 font-bold text-blue-500;
+		}
 
-    &:not:only-child {
-      @apply mb-2;
-    }
+		&:not:only-child {
+			@apply mb-2;
+		}
 
-    &:empty::after {
-      content: "Note";
-    }
+		&:empty::after {
+			content: "Note";
+		}
 
-    &::before {
-      @apply mt-1 block h-5 w-5 bg-current content-[""];
-      mask-repeat: no-repeat;
-      mask-size: cover;
+		&::before {
+			@apply mt-1 block h-5 w-5 bg-current content-[""];
+			mask-repeat: no-repeat;
+			mask-size: cover;
 
-      /* lucide-pencil */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTE3IDNhMi44NSAyLjgzIDAgMSAxIDQgNEw3LjUgMjAuNUwyIDIybDEuNS01LjVabS0yIDJsNCA0Ii8+PC9zdmc+");
-    }
-  }
+			/* lucide-pencil */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTE3IDNhMi44NSAyLjgzIDAgMSAxIDQgNEw3LjUgMjAuNUwyIDIybDEuNS01LjVabS0yIDJsNCA0Ii8+PC9zdmc+");
+		}
+	}
 
-  & > [data-callout-body] {
-    & {
-      @apply space-y-2;
-    }
+	& > [data-callout-body] {
+		& {
+			@apply space-y-2;
+		}
 
-    & > * {
-      @apply m-0;
-    }
-  }
+		& > * {
+			@apply m-0;
+		}
+	}
 }
 
 details[data-callout] > summary[data-callout-title] {
-  & {
-    @apply cursor-pointer;
-  }
+	& {
+		@apply cursor-pointer;
+	}
 
-  &::after {
-    @apply w-full bg-right bg-no-repeat;
-    content: "";
+	&::after {
+		@apply w-full bg-right bg-no-repeat;
+		content: "";
 
-    /* lucide:chevron-right */
-    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im05IDE4bDYtNmwtNi02Ii8+PC9zdmc+");
-    background-size: 1.5rem;
-  }
+		/* lucide:chevron-right */
+		background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im05IDE4bDYtNmwtNi02Ii8+PC9zdmc+");
+		background-size: 1.5rem;
+	}
 
-  &:not(:empty)::after {
-    @apply my-auto ml-auto h-6 w-6;
-  }
+	&:not(:empty)::after {
+		@apply my-auto ml-auto h-6 w-6;
+	}
 }
 
 details[data-callout][open] > summary[data-callout-title]::after {
-  /* lucide:chevron-down */
-  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im02IDlsNiA2bDYtNiIvPjwvc3ZnPg==");
+	/* lucide:chevron-down */
+	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiIGQ9Im02IDlsNiA2bDYtNiIvPjwvc3ZnPg==");
 }
 
 [data-callout][data-callout-type="info"] {
-  & {
-    @apply border-blue-600/20 bg-blue-400/20 dark:border-blue-800/20 dark:bg-blue-600/10;
-  }
+	& {
+		@apply border-blue-600/20 bg-blue-400/20 dark:border-blue-800/20 dark:bg-blue-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-blue-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-blue-500;
+		}
 
-    &:empty::after {
-      content: "Info";
-    }
+		&:empty::after {
+			content: "Info";
+		}
 
-    &::before {
-      /* lucide:info */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjEwIi8+PHBhdGggZD0iTTEyIDE2di00bTAtNGguMDEiLz48L2c+PC9zdmc+");
-    }
-  }
+		&::before {
+			/* lucide:info */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjEwIi8+PHBhdGggZD0iTTEyIDE2di00bTAtNGguMDEiLz48L2c+PC9zdmc+");
+		}
+	}
 }
 
 [data-callout][data-callout-type="todo"] {
-  & {
-    @apply border-blue-600/20 bg-blue-400/20 dark:border-blue-800/20 dark:bg-blue-600/10;
-  }
+	& {
+		@apply border-blue-600/20 bg-blue-400/20 dark:border-blue-800/20 dark:bg-blue-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-blue-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-blue-500;
+		}
 
-    &:empty::after {
-      content: "ToDo";
-    }
+		&:empty::after {
+			content: "ToDo";
+		}
 
-    &::before {
-      /* lucide:circle-check-big */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiPjxwYXRoIGQ9Ik0yMiAxMS4wOFYxMmExMCAxMCAwIDEgMS01LjkzLTkuMTQiLz48cGF0aCBkPSJtOSAxMWwzIDNMMjIgNCIvPjwvZz48L3N2Zz4=");
-    }
-  }
+		&::before {
+			/* lucide:circle-check-big */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzg4ODg4OCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjIiPjxwYXRoIGQ9Ik0yMiAxMS4wOFYxMmExMCAxMCAwIDEgMS01LjkzLTkuMTQiLz48cGF0aCBkPSJtOSAxMWwzIDNMMjIgNCIvPjwvZz48L3N2Zz4=");
+		}
+	}
 }
 
 [data-callout][data-callout-type="abstract"],
 [data-callout][data-callout-type="summary"],
 [data-callout][data-callout-type="tldr"] {
-  & {
-    @apply border-cyan-600/20 bg-cyan-400/20 dark:border-cyan-800/20 dark:bg-cyan-600/10;
-  }
+	& {
+		@apply border-cyan-600/20 bg-cyan-400/20 dark:border-cyan-800/20 dark:bg-cyan-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-cyan-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-cyan-500;
+		}
 
-    &::before {
-      /* lucide:clipboard-list */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiI+PHJlY3Qgd2lkdGg9IjgiIGhlaWdodD0iNCIgeD0iOCIgeT0iMiIgcng9IjEiIHJ5PSIxIi8+PHBhdGggZD0iTTE2IDRoMmEyIDIgMCAwIDEgMiAydjE0YTIgMiAwIDAgMS0yIDJINmEyIDIgMCAwIDEtMi0yVjZhMiAyIDAgMCAxIDItMmgybTQgN2g0bS00IDVoNG0tOC01aC4wMU04IDE2aC4wMSIvPjwvZz48L3N2Zz4=");
-    }
-  }
+		&::before {
+			/* lucide:clipboard-list */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiI+PHJlY3Qgd2lkdGg9IjgiIGhlaWdodD0iNCIgeD0iOCIgeT0iMiIgcng9IjEiIHJ5PSIxIi8+PHBhdGggZD0iTTE2IDRoMmEyIDIgMCAwIDEgMiAydjE0YTIgMiAwIDAgMS0yIDJINmEyIDIgMCAwIDEtMi0yVjZhMiAyIDAgMCAxIDItMmgybTQgN2g0bS00IDVoNG0tOC01aC4wMU04IDE2aC4wMSIvPjwvZz48L3N2Zz4=");
+		}
+	}
 }
 
-[data-callout][data-callout-type="abstract"] > [data-callout-title]:empty::after {
-  content: "Abstract";
+[data-callout][data-callout-type="abstract"]
+	> [data-callout-title]:empty::after {
+	content: "Abstract";
 }
 
-[data-callout][data-callout-type="summary"] > [data-callout-title]:empty::after {
-  content: "Summary";
+[data-callout][data-callout-type="summary"]
+	> [data-callout-title]:empty::after {
+	content: "Summary";
 }
 
 [data-callout][data-callout-type="tldr"] > [data-callout-title]:empty::after {
-  content: "TL;DR";
+	content: "TL;DR";
 }
 
 [data-callout][data-callout-type="tip"],
 [data-callout][data-callout-type="hint"],
 [data-callout][data-callout-type="important"] {
-  & {
-    @apply border-cyan-600/20 bg-cyan-400/20 dark:border-cyan-800/20 dark:bg-cyan-600/10;
-  }
+	& {
+		@apply border-cyan-600/20 bg-cyan-400/20 dark:border-cyan-800/20 dark:bg-cyan-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-cyan-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-cyan-500;
+		}
 
-    &::before {
-      /* lucide:flame */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTguNSAxNC41QTIuNSAyLjUgMCAwIDAgMTEgMTJjMC0xLjM4LS41LTItMS0zYy0xLjA3Mi0yLjE0My0uMjI0LTQuMDU0IDItNmMuNSAyLjUgMiA0LjkgNCA2LjVjMiAxLjYgMyAzLjUgMyA1LjVhNyA3IDAgMSAxLTE0IDBjMC0xLjE1My40MzMtMi4yOTQgMS0zYTIuNSAyLjUgMCAwIDAgMi41IDIuNSIvPjwvc3ZnPg==");
-    }
-  }
+		&::before {
+			/* lucide:flame */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTguNSAxNC41QTIuNSAyLjUgMCAwIDAgMTEgMTJjMC0xLjM4LS41LTItMS0zYy0xLjA3Mi0yLjE0My0uMjI0LTQuMDU0IDItNmMuNSAyLjUgMiA0LjkgNCA2LjVjMiAxLjYgMyAzLjUgMyA1LjVhNyA3IDAgMSAxLTE0IDBjMC0xLjE1My40MzMtMi4yOTQgMS0zYTIuNSAyLjUgMCAwIDAgMi41IDIuNSIvPjwvc3ZnPg==");
+		}
+	}
 }
 
 [data-callout][data-callout-type="tip"] > [data-callout-title]:empty::after {
-  content: "Tip";
+	content: "Tip";
 }
 
 [data-callout][data-callout-type="hint"] > [data-callout-title]:empty::after {
-  content: "Hint";
+	content: "Hint";
 }
 
-[data-callout][data-callout-type="important"] > [data-callout-title]:empty::after {
-  content: "Important";
+[data-callout][data-callout-type="important"]
+	> [data-callout-title]:empty::after {
+	content: "Important";
 }
 
 [data-callout][data-callout-type="success"],
 [data-callout][data-callout-type="check"],
 [data-callout][data-callout-type="done"] {
-  & {
-    @apply border-green-600/20 bg-green-400/20 dark:border-green-800/20 dark:bg-green-600/10;
-  }
+	& {
+		@apply border-green-600/20 bg-green-400/20 dark:border-green-800/20 dark:bg-green-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-green-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-green-500;
+		}
 
-    &::before {
-      /* lucide:check */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTIwIDZMOSAxN2wtNS01Ii8+PC9zdmc+");
-    }
-  }
+		&::before {
+			/* lucide:check */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTIwIDZMOSAxN2wtNS01Ii8+PC9zdmc+");
+		}
+	}
 }
 
-[data-callout][data-callout-type="success"] > [data-callout-title]:empty::after {
-  content: "Success";
+[data-callout][data-callout-type="success"]
+	> [data-callout-title]:empty::after {
+	content: "Success";
 }
 
 [data-callout][data-callout-type="check"] > [data-callout-title]:empty::after {
-  content: "Check";
+	content: "Check";
 }
 
 [data-callout][data-callout-type="done"] > [data-callout-title]:empty::after {
-  content: "Done";
+	content: "Done";
 }
 
 [data-callout][data-callout-type="question"],
 [data-callout][data-callout-type="help"],
 [data-callout][data-callout-type="faq"] {
-  & {
-    @apply border-orange-600/20 bg-orange-400/20 dark:border-orange-800/20 dark:bg-orange-600/10;
-  }
+	& {
+		@apply border-orange-600/20 bg-orange-400/20 dark:border-orange-800/20 dark:bg-orange-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-orange-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-orange-500;
+		}
 
-    &::before {
-      /* lucide:circle-help */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiI+PGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMTAiLz48cGF0aCBkPSJNOS4wOSA5YTMgMyAwIDAgMSA1LjgzIDFjMCAyLTMgMy0zIDNtLjA4IDRoLjAxIi8+PC9nPjwvc3ZnPg==");
-    }
-  }
+		&::before {
+			/* lucide:circle-help */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiI+PGNpcmNsZSBjeD0iMTIiIGN5PSIxMiIgcj0iMTAiLz48cGF0aCBkPSJNOS4wOSA5YTMgMyAwIDAgMSA1LjgzIDFjMCAyLTMgMy0zIDNtLjA4IDRoLjAxIi8+PC9nPjwvc3ZnPg==");
+		}
+	}
 }
 
-[data-callout][data-callout-type="question"] > [data-callout-title]:empty::after {
-  content: "Question";
+[data-callout][data-callout-type="question"]
+	> [data-callout-title]:empty::after {
+	content: "Question";
 }
 
 [data-callout][data-callout-type="help"] > [data-callout-title]:empty::after {
-  content: "Help";
+	content: "Help";
 }
 
 [data-callout][data-callout-type="faq"] > [data-callout-title]:empty::after {
-  content: "FAQ";
+	content: "FAQ";
 }
 
 [data-callout][data-callout-type="warning"],
 [data-callout][data-callout-type="caution"],
 [data-callout][data-callout-type="attention"] {
-  & {
-    @apply border-orange-600/20 bg-orange-400/20 dark:border-orange-800/20 dark:bg-orange-600/10;
-  }
+	& {
+		@apply border-orange-600/20 bg-orange-400/20 dark:border-orange-800/20 dark:bg-orange-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-orange-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-orange-500;
+		}
 
-    &::before {
-      /* lucide:triangle-alert */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0ibTIxLjczIDE4bC04LTE0YTIgMiAwIDAgMC0zLjQ4IDBsLTggMTRBMiAyIDAgMCAwIDQgMjFoMTZhMiAyIDAgMCAwIDEuNzMtM00xMiA5djRtMCA0aC4wMSIvPjwvc3ZnPg==");
-    }
-  }
+		&::before {
+			/* lucide:triangle-alert */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0ibTIxLjczIDE4bC04LTE0YTIgMiAwIDAgMC0zLjQ4IDBsLTggMTRBMiAyIDAgMCAwIDQgMjFoMTZhMiAyIDAgMCAwIDEuNzMtM00xMiA5djRtMCA0aC4wMSIvPjwvc3ZnPg==");
+		}
+	}
 }
 
-[data-callout][data-callout-type="warning"] > [data-callout-title]:empty::after {
-  content: "Warning";
+[data-callout][data-callout-type="warning"]
+	> [data-callout-title]:empty::after {
+	content: "Warning";
 }
 
-[data-callout][data-callout-type="caution"] > [data-callout-title]:empty::after {
-  content: "Caution";
+[data-callout][data-callout-type="caution"]
+	> [data-callout-title]:empty::after {
+	content: "Caution";
 }
 
-[data-callout][data-callout-type="attention"] > [data-callout-title]:empty::after {
-  content: "Attention";
+[data-callout][data-callout-type="attention"]
+	> [data-callout-title]:empty::after {
+	content: "Attention";
 }
 
 [data-callout][data-callout-type="failure"],
 [data-callout][data-callout-type="fail"],
 [data-callout][data-callout-type="missing"] {
-  & {
-    @apply border-red-600/20 bg-red-400/20 dark:border-red-800/20 dark:bg-red-600/10;
-  }
+	& {
+		@apply border-red-600/20 bg-red-400/20 dark:border-red-800/20 dark:bg-red-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-red-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-red-500;
+		}
 
-    &::before {
-      /* lucide:check */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTIwIDZMOSAxN2wtNS01Ii8+PC9zdmc+");
-    }
-  }
+		&::before {
+			/* lucide:check */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTIwIDZMOSAxN2wtNS01Ii8+PC9zdmc+");
+		}
+	}
 }
 
-[data-callout][data-callout-type="failure"] > [data-callout-title]:empty::after {
-  content: "Failure";
+[data-callout][data-callout-type="failure"]
+	> [data-callout-title]:empty::after {
+	content: "Failure";
 }
 
 [data-callout][data-callout-type="fail"] > [data-callout-title]:empty::after {
-  content: "Fail";
+	content: "Fail";
 }
 
-[data-callout][data-callout-type="missing"] > [data-callout-title]:empty::after {
-  content: "Missing";
+[data-callout][data-callout-type="missing"]
+	> [data-callout-title]:empty::after {
+	content: "Missing";
 }
 
 [data-callout][data-callout-type="danger"],
 [data-callout][data-callout-type="error"] {
-  & {
-    @apply border-red-600/20 bg-red-400/20 dark:border-red-800/20 dark:bg-red-600/10;
-  }
+	& {
+		@apply border-red-600/20 bg-red-400/20 dark:border-red-800/20 dark:bg-red-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-red-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-red-500;
+		}
 
-    &::before {
-      /* lucide:zap */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXphcCI+PHBhdGggZD0iTTQgMTRhMSAxIDAgMCAxLS43OC0xLjYzbDkuOS0xMC4yYS41LjUgMCAwIDEgLjg2LjQ2bC0xLjkyIDYuMDJBMSAxIDAgMCAwIDEzIDEwaDdhMSAxIDAgMCAxIC43OCAxLjYzbC05LjkgMTAuMmEuNS41IDAgMCAxLS44Ni0uNDZsMS45Mi02LjAyQTEgMSAwIDAgMCAxMSAxNHoiLz48L3N2Zz4=");
-    }
-  }
+		&::before {
+			/* lucide:zap */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXphcCI+PHBhdGggZD0iTTQgMTRhMSAxIDAgMCAxLS43OC0xLjYzbDkuOS0xMC4yYS41LjUgMCAwIDEgLjg2LjQ2bC0xLjkyIDYuMDJBMSAxIDAgMCAwIDEzIDEwaDdhMSAxIDAgMCAxIC43OCAxLjYzbC05LjkgMTAuMmEuNS41IDAgMCAxLS44Ni0uNDZsMS45Mi02LjAyQTEgMSAwIDAgMCAxMSAxNHoiLz48L3N2Zz4=");
+		}
+	}
 }
 
 [data-callout][data-callout-type="danger"] > [data-callout-title]:empty::after {
-  content: "Danger";
+	content: "Danger";
 }
 
 [data-callout][data-callout-type="error"] > [data-callout-title]:empty::after {
-  content: "Error";
+	content: "Error";
 }
 
 [data-callout][data-callout-type="bug"] {
-  & {
-    @apply border-red-600/20 bg-red-400/20 dark:border-red-800/20 dark:bg-red-600/10;
-  }
+	& {
+		@apply border-red-600/20 bg-red-400/20 dark:border-red-800/20 dark:bg-red-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-red-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-red-500;
+		}
 
-    &::before {
-      /* lucide:bug */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiI+PHBhdGggZD0ibTggMmwxLjg4IDEuODhtNC4yNCAwTDE2IDJNOSA3LjEzdi0xYTMuMDAzIDMuMDAzIDAgMSAxIDYgMHYxIi8+PHBhdGggZD0iTTEyIDIwYy0zLjMgMC02LTIuNy02LTZ2LTNhNCA0IDAgMCAxIDQtNGg0YTQgNCAwIDAgMSA0IDR2M2MwIDMuMy0yLjcgNi02IDZtMCAwdi05Ii8+PHBhdGggZD0iTTYuNTMgOUM0LjYgOC44IDMgNy4xIDMgNW0zIDhIMm0xIDhjMC0yLjEgMS43LTMuOSAzLjgtNE0yMC45NyA1YzAgMi4xLTEuNiAzLjgtMy41IDRNMjIgMTNoLTRtLS44IDRjMi4xLjEgMy44IDEuOSAzLjggNCIvPjwvZz48L3N2Zz4=");
-    }
-  }
+		&::before {
+			/* lucide:bug */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxnIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiI+PHBhdGggZD0ibTggMmwxLjg4IDEuODhtNC4yNCAwTDE2IDJNOSA3LjEzdi0xYTMuMDAzIDMuMDAzIDAgMSAxIDYgMHYxIi8+PHBhdGggZD0iTTEyIDIwYy0zLjMgMC02LTIuNy02LTZ2LTNhNCA0IDAgMCAxIDQtNGg0YTQgNCAwIDAgMSA0IDR2M2MwIDMuMy0yLjcgNi02IDZtMCAwdi05Ii8+PHBhdGggZD0iTTYuNTMgOUM0LjYgOC44IDMgNy4xIDMgNW0zIDhIMm0xIDhjMC0yLjEgMS43LTMuOSAzLjgtNE0yMC45NyA1YzAgMi4xLTEuNiAzLjgtMy41IDRNMjIgMTNoLTRtLS44IDRjMi4xLjEgMy44IDEuOSAzLjggNCIvPjwvZz48L3N2Zz4=");
+		}
+	}
 }
 
 [data-callout][data-callout-type="bug"] > [data-callout-title]:empty::after {
-  content: "Bug";
+	content: "Bug";
 }
 
 [data-callout][data-callout-type="example"] {
-  & {
-    @apply border-purple-600/20 bg-purple-400/20 dark:border-purple-800/20 dark:bg-purple-600/10;
-  }
+	& {
+		@apply border-purple-600/20 bg-purple-400/20 dark:border-purple-800/20 dark:bg-purple-600/10;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-purple-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-purple-500;
+		}
 
-    &::before {
-      /* lucide:list */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTggNmgxM004IDEyaDEzTTggMThoMTNNMyA2aC4wMU0zIDEyaC4wMU0zIDE4aC4wMSIvPjwvc3ZnPg==");
-    }
-  }
+		&::before {
+			/* lucide:list */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTggNmgxM004IDEyaDEzTTggMThoMTNNMyA2aC4wMU0zIDEyaC4wMU0zIDE4aC4wMSIvPjwvc3ZnPg==");
+		}
+	}
 }
 
-[data-callout][data-callout-type="example"] > [data-callout-title]:empty::after {
-  content: "Example";
+[data-callout][data-callout-type="example"]
+	> [data-callout-title]:empty::after {
+	content: "Example";
 }
 
 [data-callout][data-callout-type="quote"],
 [data-callout][data-callout-type="cite"] {
-  & {
-    @apply border-zinc-600/20 bg-zinc-400/20 dark:border-zinc-800/20 dark:bg-zinc-600/15;
-  }
+	& {
+		@apply border-zinc-600/20 bg-zinc-400/20 dark:border-zinc-800/20 dark:bg-zinc-600/15;
+	}
 
-  & > [data-callout-title] {
-    & {
-      @apply text-zinc-500;
-    }
+	& > [data-callout-title] {
+		& {
+			@apply text-zinc-500;
+		}
 
-    &::before {
-      /* lucide:quote */
-      mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTMgMjFjMyAwIDctMSA3LThWNWMwLTEuMjUtLjc1Ni0yLjAxNy0yLTJINGMtMS4yNSAwLTIgLjc1LTIgMS45NzJWMTFjMCAxLjI1Ljc1IDIgMiAyYzEgMCAxIDAgMSAxdjFjMCAxLTEgMi0yIDJzLTEgLjAwOC0xIDEuMDMxVjIwYzAgMSAwIDEgMSAxbTEyIDBjMyAwIDctMSA3LThWNWMwLTEuMjUtLjc1Ny0yLjAxNy0yLTJoLTRjLTEuMjUgMC0yIC43NS0yIDEuOTcyVjExYzAgMS4yNS43NSAyIDIgMmguNzVjMCAyLjI1LjI1IDQtMi43NSA0djNjMCAxIDAgMSAxIDEiLz48L3N2Zz4=");
-    }
-  }
+		&::before {
+			/* lucide:quote */
+			mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxZW0iIGhlaWdodD0iMWVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGZpbGw9Im5vbmUiIHN0cm9rZT0iY3VycmVudENvbG9yIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMiIgZD0iTTMgMjFjMyAwIDctMSA3LThWNWMwLTEuMjUtLjc1Ni0yLjAxNy0yLTJINGMtMS4yNSAwLTIgLjc1LTIgMS45NzJWMTFjMCAxLjI1Ljc1IDIgMiAyYzEgMCAxIDAgMSAxdjFjMCAxLTEgMi0yIDJzLTEgLjAwOC0xIDEuMDMxVjIwYzAgMSAwIDEgMSAxbTEyIDBjMyAwIDctMSA3LThWNWMwLTEuMjUtLjc1Ny0yLjAxNy0yLTJoLTRjLTEuMjUgMC0yIC43NS0yIDEuOTcyVjExYzAgMS4yNS43NSAyIDIgMmguNzVjMCAyLjI1LjI1IDQtMi43NSA0djNjMCAxIDAgMSAxIDEiLz48L3N2Zz4=");
+		}
+	}
 }
 
 [data-callout][data-callout-type="quote"] > [data-callout-title]:empty::after {
-  content: "Quote";
+	content: "Quote";
 }
 
 [data-callout][data-callout-type="cite"] > [data-callout-title]:empty::after {
-  content: "Cite";
-}
\ No newline at end of file
+	content: "Cite";
+}
diff --git a/src/styles/global.css b/src/styles/global.css
index 3f27863..aa3767b 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -1,91 +1,93 @@
-@import 'tailwindcss';
+@import "tailwindcss";
 
 @custom-variant dark (&:is(.dark *));
 
 @theme inline {
-  --font-sans: 'Geist Variable', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-  --font-mono: "Geist Mono Variable", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
+	--font-sans: "Geist Variable", ui-sans-serif, system-ui, sans-serif,
+		"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+	--font-mono: "Geist Mono Variable", ui-monospace, SFMono-Regular, Menlo,
+		Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
 
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
+	--color-background: var(--background);
+	--color-foreground: var(--foreground);
 
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
+	--color-primary: var(--primary);
+	--color-primary-foreground: var(--primary-foreground);
 
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
+	--color-secondary: var(--secondary);
+	--color-secondary-foreground: var(--secondary-foreground);
 
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
+	--color-muted: var(--muted);
+	--color-muted-foreground: var(--muted-foreground);
 
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
+	--color-accent: var(--accent);
+	--color-accent-foreground: var(--accent-foreground);
 
-  --color-additive: var(--additive);
-  --color-additive-foreground: var(--additive-foreground);
+	--color-additive: var(--additive);
+	--color-additive-foreground: var(--additive-foreground);
 
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
+	--color-destructive: var(--destructive);
+	--color-destructive-foreground: var(--destructive-foreground);
 
-  --color-border: var(--border);
-  --color-ring: var(--ring);
+	--color-border: var(--border);
+	--color-ring: var(--ring);
 }
 
 :root {
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
-  --secondary: oklch(0.97 0 0);
-  --secondary-foreground: oklch(0.205 0 0);
-  --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.556 0 0);
-  --accent: oklch(0.97 0 0);
-  --accent-foreground: oklch(0.205 0 0);
-  --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.922 0 0);
-  --ring: oklch(0.708 0 0);
+	--background: oklch(1 0 0);
+	--foreground: oklch(0.145 0 0);
+	--primary: oklch(0.205 0 0);
+	--primary-foreground: oklch(0.985 0 0);
+	--secondary: oklch(0.97 0 0);
+	--secondary-foreground: oklch(0.205 0 0);
+	--muted: oklch(0.97 0 0);
+	--muted-foreground: oklch(0.556 0 0);
+	--accent: oklch(0.97 0 0);
+	--accent-foreground: oklch(0.205 0 0);
+	--destructive: oklch(0.577 0.245 27.325);
+	--border: oklch(0.922 0 0);
+	--ring: oklch(0.708 0 0);
 }
 
 .dark {
-  --background: oklch(0.145 0 0);
-  --foreground: oklch(0.985 0 0);
-  --primary: oklch(0.922 0 0);
-  --primary-foreground: oklch(0.205 0 0);
-  --secondary: oklch(0.269 0 0);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.269 0 0);
-  --muted-foreground: oklch(0.708 0 0);
-  --accent: oklch(0.269 0 0);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --ring: oklch(0.556 0 0);
+	--background: oklch(0.145 0 0);
+	--foreground: oklch(0.985 0 0);
+	--primary: oklch(0.922 0 0);
+	--primary-foreground: oklch(0.205 0 0);
+	--secondary: oklch(0.269 0 0);
+	--secondary-foreground: oklch(0.985 0 0);
+	--muted: oklch(0.269 0 0);
+	--muted-foreground: oklch(0.708 0 0);
+	--accent: oklch(0.269 0 0);
+	--accent-foreground: oklch(0.985 0 0);
+	--destructive: oklch(0.704 0.191 22.216);
+	--border: oklch(1 0 0 / 10%);
+	--ring: oklch(0.556 0 0);
 }
 
 @layer base {
-  *,
-  ::after,
-  ::before,
-  ::backdrop,
-  ::file-selector-button {
-    @apply border-border outline-ring/50 tracking-tight;
-  }
+	*,
+	::after,
+	::before,
+	::backdrop,
+	::file-selector-button {
+		@apply border-border outline-ring/50 tracking-tight;
+	}
 
-  html {
-    @apply bg-background text-foreground scheme-light;
+	html {
+		@apply bg-background text-foreground scheme-light;
 
-    &.dark {
-      @apply scheme-dark;
-    }
+		&.dark {
+			@apply scheme-dark;
+		}
 
-    ::-webkit-scrollbar-corner {
-      @apply bg-transparent;
-    }
-  }
+		::-webkit-scrollbar-corner {
+			@apply bg-transparent;
+		}
+	}
 
-  .disable-transitions,
-  .disable-transitions * {
-    @apply transition-none!;
-  }
+	.disable-transitions,
+	.disable-transitions * {
+		@apply transition-none!;
+	}
 }
diff --git a/src/types.ts b/src/types.ts
index cca598a..2c71994 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -1,16 +1,16 @@
 export type Site = {
-  title: string
-  description: string
-  href: string
-  featuredPostCount: number
-  postsPerPage: number
-}
+	title: string;
+	description: string;
+	href: string;
+	featuredPostCount: number;
+	postsPerPage: number;
+};
 
 export type SocialLink = {
-  href: string
-  label: string
-}
+	href: string;
+	label: string;
+};
 
 export type IconMap = {
-  [key: string]: string
-}
+	[key: string]: string;
+};
diff --git a/tsconfig.json b/tsconfig.json
index 494564d..033aad8 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,12 +1,12 @@
 {
-  "extends": "astro/tsconfigs/strict",
-  "compilerOptions": {
-    "strictNullChecks": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"]
-    },
-    "jsx": "react-jsx",
-    "jsxImportSource": "react"
-  }
+	"extends": "astro/tsconfigs/strict",
+	"compilerOptions": {
+		"strictNullChecks": true,
+		"baseUrl": ".",
+		"paths": {
+			"@/*": ["./src/*"]
+		},
+		"jsx": "react-jsx",
+		"jsxImportSource": "react"
+	}
 }