Initialize SvelteKit project with default routing, ESLint, Prettier, Storybook setup, and basic components.

src/routes/+layout.svelte

@@ -0,0 +1,34 @@
+<script lang="ts">
+	import './layout.css';
+	import favicon from '$lib/assets/favicon.svg';
+    import { AppBar } from "@skeletonlabs/skeleton-svelte";
+    import type { LayoutProps } from "./$types";
+
+    let { data, children }: LayoutProps = $props();
+</script>
+
+<svelte:head>
+    <link rel="icon" href={favicon} />
+</svelte:head>
+
+<div class="grid h-screen grid-rows-[auto_1fr_auto]">
+    <header>
+        <AppBar>
+            <AppBar.Toolbar class="grid-cols-[auto_1fr_auto]">
+                <AppBar.Headline>
+                    <h1 class="h3">BlackBook</h1> { data.status.options.title }
+                </AppBar.Headline>
+            </AppBar.Toolbar>
+        </AppBar>
+    </header>
+
+    <div class="grid grid-cols-1 md:grid-cols-[auto_1fr]">
+        <aside class="p-4">SIDEBAR</aside>
+
+        <main class="space-y-4 p-4">
+            {@render children()}
+        </main>
+    </div>
+
+    <footer class="p-4">FOOTER</footer>
+</div>