diff --git a/.prettierrc b/.prettierrc
index ff2677e..2fa6ca5 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -1,6 +1,6 @@
 {
 	"useTabs": true,
 	"singleQuote": true,
-	"trailingComma": "none",
+	"trailingComma": "all",
 	"printWidth": 100
 }
diff --git a/mdsvex.config.js b/mdsvex.config.js
new file mode 100644
index 0000000..4c8edd2
--- /dev/null
+++ b/mdsvex.config.js
@@ -0,0 +1,18 @@
+import { defineMDSveXConfig as defineConfig } from 'mdsvex';
+
+const config = defineConfig({
+	layout: {
+		project: './src/routes/projects/project.layout.svelte',
+	},
+
+	extensions: ['.svelte.md', '.md', '.svx'],
+
+	smartypants: {
+		dashes: 'oldschool',
+	},
+
+	remarkPlugins: [],
+	rehypePlugins: [],
+});
+
+export default config;
diff --git a/package.json b/package.json
index 06c3b20..bfb973f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,7 @@
 {
 	"name": "daichendt.one",
 	"version": "0.0.1",
+	"license": "AGPL-3.0-or-later",
 	"scripts": {
 		"dev": "svelte-kit dev",
 		"build": "svelte-kit build",
@@ -20,6 +21,7 @@
 		"eslint": "^8.16.0",
 		"eslint-config-prettier": "^8.3.0",
 		"eslint-plugin-svelte3": "^4.0.0",
+		"mdsvex": "^0.10.6",
 		"prettier": "^2.6.2",
 		"prettier-plugin-svelte": "^2.7.0",
 		"svelte": "^3.44.0",
@@ -30,7 +32,12 @@
 	},
 	"type": "module",
 	"dependencies": {
-		"@svelteuidev/composables": "0.6.5",
-		"@svelteuidev/core": "0.6.5"
+		"@fontsource/syne": "^4.5.9",
+		"@fontsource/voces": "^4.5.9",
+		"@mdi/js": "^6.7.96",
+		"@svelteuidev/composables": "^0.6.8",
+		"@svelteuidev/core": "^0.6.8",
+		"jetbrains-mono": "^1.0.6",
+		"mdi-svelte": "^1.1.2"
 	}
 }
diff --git a/src/routes/__layout.svelte b/src/routes/__layout.svelte
index d3798f0..9f7eb87 100644
--- a/src/routes/__layout.svelte
+++ b/src/routes/__layout.svelte
@@ -1,22 +1,28 @@
-<script context="module">
-	export const prerender = true;
-</script>
+<script>
+	import {
+		Button,
+		Switch,
+		Container,
+		createStyles,
+		SvelteUIProvider,
+		createTheme,
+	} from '@svelteuidev/core';
+	// import type { SvelteUIProviderProps } from '@svelteuidev/core';
+	import '@fontsource/syne';
 
-<script lang="ts">
-	import { Button, Switch, Container, createStyles, SvelteUIProvider } from '@svelteuidev/core';
-	import type { SvelteUIProviderProps } from '@svelteuidev/core';
+	const theme = createTheme('themeOverride', { fonts: { standard: 'Syne' } });
 
-	const config: SvelteUIProviderProps['config'] = {
+	const config = {
 		light: { bg: 'White', color: 'Black' },
-		dark: { bg: '#373737', color: '#C1C2C5' }
+		dark: { bg: '#373737', color: '#C1C2C5' },
 	};
 
 	const MENU_ITEMS = [
 		{ label: 'Blog', href: '/blog' },
-		{ label: 'Projects', href: '/projects' }
+		{ label: 'Projects', href: '/projects' },
 	];
 	// current y coordinate of the scroll bar
-	let y: number;
+	let y = 0;
 	let isDark = false;
 	function toggleTheme() {
 		isDark = !isDark;
@@ -30,27 +36,28 @@
 				alignItems: 'center',
 				position: 'sticky',
 				top: 0,
+				marginBottom: theme.space[12],
 				padding: theme.space[4],
 				'&.scrolled': {
 					[`${theme.dark} &`]: {
 						// using of SvelteUI utilities
 						// bc === backgroundColor
-						bc: theme.colors['dark500'].value
+						//bc: theme.colors['dark500'].value,
 					},
-					bc: theme.colors['gray700'].value,
+					bc: '#242424',
 					color: 'rgb(223 223 223);',
-					boxShadow: theme.shadows.lg
-				}
+					boxShadow: theme.shadows.lg,
+				},
 			},
 			list: {
 				listStyle: 'none',
 				display: 'flex',
 				marginBlock: '0px',
-				gap: theme.space[2]
+				gap: theme.space[2],
 			},
 			menuItem: {
-				fontWeight: theme.fontWeights.bold
-			}
+				fontWeight: theme.fontWeights.bold,
+			},
 		};
 	});
 	$: ({ classes, getStyles, cx } = useStyles());
@@ -60,19 +67,20 @@
 
 <SvelteUIProvider
 	{config}
+	class={theme}
 	themeObserver={isDark ? 'dark' : 'light'}
 	withNormalizeCSS
 	withGlobalStyles
 	ssr
 >
 	<div class={cx(getStyles(), { scrolled: y > 0 })}>
-		<h1>Alex' Website</h1>
+		<h1><a href="/">Yard of Stuffs</a></h1>
 		<nav>
 			<ul class={classes.list}>
 				{#each MENU_ITEMS as menuItem}
-					<li>
-						<Button variant="subtle" color="cyan" radius="xl" uppercase ripple>
-							<a class={classes.menuItem} href={menuItem.href}>{menuItem.label}</a>
+					<li class={classes.menuItem}>
+						<Button href={menuItem.href} variant="subtle" color="cyan" radius="xl" uppercase ripple>
+							{menuItem.label}
 						</Button>
 					</li>
 				{/each}
@@ -80,13 +88,17 @@
 		</nav>
 		<Switch offLabel="Dark" size="lg" color="yellow" on:change={toggleTheme} />
 	</div>
-	<Container>
+	<Container class={classes.main}>
 		<slot />
 	</Container>
 </SvelteUIProvider>
 
 <style>
-	a {
+	:global(body) {
+		font-family: 'Syne', sans-serif;
+	}
+
+	:global(a) {
 		text-decoration: none;
 		color: inherit;
 	}
diff --git a/src/routes/blog/index.svelte b/src/routes/blog/index.svelte
index e69de29..1ca6207 100644
--- a/src/routes/blog/index.svelte
+++ b/src/routes/blog/index.svelte
@@ -0,0 +1,282 @@
+<script context="module">
+	export const prerender = true;
+</script>
+
+<h1>blog</h1>
+
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
+et magnis. Adipiscing vitae proin sagittis nisl rhoncus. Accumsan lacus vel facilisis volutpat est
+velit. Elementum nisi quis eleifend quam adipiscing vitae proin sagittis. Nibh mauris cursus mattis
+molestie. Malesuada fames ac turpis egestas maecenas pharetra convallis posuere morbi. Ipsum
+suspendisse ultrices gravida dictum fusce ut. Tellus cras adipiscing enim eu. Commodo viverra
+maecenas accumsan lacus vel facilisis volutpat est. Quis vel eros donec ac odio tempor. Orci ac
+auctor augue mauris augue neque. Rhoncus mattis rhoncus urna neque viverra justo nec. Ultricies mi
+eget mauris pharetra et ultrices neque ornare aenean. Consectetur adipiscing elit ut aliquam purus
+sit. Eu volutpat odio facilisis mauris. Scelerisque eu ultrices vitae auctor. Massa tincidunt nunc
+pulvinar sapien et. Commodo odio aenean sed adipiscing diam. Purus faucibus ornare suspendisse sed
+nisi. Pretium viverra suspendisse potenti nullam ac tortor. Curabitur vitae nunc sed velit dignissim
+sodales. Mattis pellentesque id nibh tortor id. Scelerisque felis imperdiet proin fermentum leo.
+Duis tristique sollicitudin nibh sit amet commodo nulla facilisi. Sit amet facilisis magna etiam te
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 76d8e65..c6a034d 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -1,7 +1,3 @@
-<script context="module">
-	export const prerender = true;
-</script>
-
 <h1>Welcome to SvelteKit</h1>
 <p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
diff --git a/src/routes/projects/__layout.svelte b/src/routes/projects/__layout.svelte
new file mode 100644
index 0000000..c085994
--- /dev/null
+++ b/src/routes/projects/__layout.svelte
@@ -0,0 +1,118 @@
+<script context="module" lang="ts">
+	export async function load({ fetch }: LoadEvent): LoadOutput {
+		const response = await fetch(`/projects/projects.json`);
+		const asJson = await response.json();
+		return {
+			status: response.status,
+			props: {
+				projects: response.ok && asJson.projects,
+			},
+		};
+	}
+</script>
+
+<script lang="ts">
+	import Icon from 'mdi-svelte';
+	import { Card, createStyles, Text, TextInput, theme, Title, Tooltip } from '@svelteuidev/core';
+	import { mdiMagnify, mdiAccountMultiple } from '@mdi/js';
+	import type { Project } from './types';
+	import type { LoadEvent, LoadOutput } from '@sveltejs/kit';
+
+	export let projects: Project[] = [];
+	let search = '';
+
+	const useStyles = createStyles((theme) => {
+		return {
+			root: {
+				mt: theme.space[8],
+			},
+			main: {
+				display: 'flex',
+			},
+			sidebar: { maxWidth: 250 },
+			input: { width: '100%' },
+			projects: {
+				display: 'grid',
+				gap: theme.space.smPX,
+				listStyle: 'none',
+				margin: theme.space[2],
+				padding: 0,
+			},
+			project: {
+				transition: 'all 250ms cubic-bezier(0.4, 0, 0.2, 1) 0s',
+				'&:hover': {
+					boxShadow: 'rgb(46 41 51 / 8%) 0px 4px 16px, rgb(71 63 79 / 16%) 0px 8px 24px',
+					position: 'relative',
+					backgroundColor: 'White',
+				},
+			},
+			projectTop: {
+				display: 'flex',
+				mb: theme.space[8],
+				justifyContent: 'space-between',
+			},
+			content: {
+				marginLeft: theme.space[10],
+				marginRight: theme.space[10],
+			},
+			projectTopSmall: {
+				fontSize: '0.8rem',
+			},
+		};
+	});
+	$: ({ classes, getStyles, cx } = useStyles());
+</script>
+
+<div class={getStyles()}>
+	<h1>Projects</h1>
+	<div class={classes.main}>
+		<aside class={classes.sidebar}>
+			<div class="searchbar">
+				<Icon path={mdiMagnify} color="black" />
+				<TextInput class={classes.input} placeholder="Search Projects" bind:value={search} />
+			</div>
+			<ul class={classes.projects}>
+				{#each projects as project}
+					<li>
+						<a href={project.url}>
+							<Card.Container
+								p={12}
+								class={classes.project}
+								override={{
+									br: '$md',
+									boxShadow: 'unset',
+									backgroundColor: theme.colors['gray100'],
+									opacity: 0.8,
+								}}
+							>
+								<div class={classes.projectTop}>
+									<Title order={4} override={{ mb: 8, fontWeight: theme.fontWeights.extrabold }}
+										>{project.title}</Title
+									>
+									<Tooltip label="Daily visitors" withArrow>
+										<div class={classes.projectTopSmall}>
+											<Icon path={mdiAccountMultiple} size="0.9rem" />
+											{project.usersPerDay}
+										</div>
+									</Tooltip>
+								</div>
+
+								<Text override={{ fontWeight: theme.fontWeights.extralight }}
+									>{project.description}</Text
+								>
+							</Card.Container>
+						</a>
+					</li>
+				{/each}
+			</ul>
+		</aside>
+		<div class={classes.content}><slot /></div>
+	</div>
+</div>
+
+<style>
+	.searchbar {
+		display: flex;
+		align-items: center;
+	}
+</style>
diff --git a/src/routes/projects/discretize-website.svx b/src/routes/projects/discretize-website.svx
new file mode 100644
index 0000000..4229b87
--- /dev/null
+++ b/src/routes/projects/discretize-website.svx
@@ -0,0 +1,12 @@
+---
+title: 'Discretize Website'
+description: >-
+  The Gear Optimizer helps players of the MMORPG Guild Wars 2 to find the most optimal builds for their favourit content while respecting input parameters.
+concluded: false
+timeActive: 2021-now
+usersPerDay: 500
+layout: project
+---
+
+
+testico
\ No newline at end of file
diff --git a/src/routes/projects/index.svelte b/src/routes/projects/index.svelte
index e69de29..eee8f88 100644
--- a/src/routes/projects/index.svelte
+++ b/src/routes/projects/index.svelte
@@ -0,0 +1,5 @@
+<script context="module">
+	export async function load({ url, fetch }) {
+		return { headers: { location: '/projects/optimizer' }, status: 300 };
+	}
+</script>
diff --git a/src/routes/projects/optimizer.svx b/src/routes/projects/optimizer.svx
new file mode 100644
index 0000000..df5740f
--- /dev/null
+++ b/src/routes/projects/optimizer.svx
@@ -0,0 +1,12 @@
+---
+title: 'Gear Optimizer'
+description: >-
+  The Gear Optimizer helps players of the MMORPG Guild Wars 2 to find the most optimal builds for their favourit content while respecting input parameters.
+concluded: false
+timeActive: 2021-now
+usersPerDay: 500
+layout: project
+---
+
+
+The gear optimizer helps players of the MMORP [Guild Wars 2](https://www.guildwars2.com/en/) finding the most optimal gear meeting arbitrary constraints. Players may use templates to select the most common builds or adjust the settings manually - which requires some understanding of the available options. An easy-mode hides more advanced features.
diff --git a/src/routes/projects/project.layout.svelte b/src/routes/projects/project.layout.svelte
new file mode 100644
index 0000000..73c9703
--- /dev/null
+++ b/src/routes/projects/project.layout.svelte
@@ -0,0 +1,19 @@
+<script>
+	export let title = '';
+	export let description = '';
+	export let timeActive = '';
+	export let concluded = false;
+	export let usersPerDay = 0;
+</script>
+
+<div>
+	<h1>{title}</h1>
+
+	<sub>{description}</sub>
+	<ul>
+		<li>{timeActive}</li>
+		<li>{concluded}</li>
+		<li>{usersPerDay}</li>
+	</ul>
+	<slot />
+</div>
diff --git a/src/routes/projects/projects.json.ts b/src/routes/projects/projects.json.ts
new file mode 100644
index 0000000..6d7bd6e
--- /dev/null
+++ b/src/routes/projects/projects.json.ts
@@ -0,0 +1,24 @@
+import type { Project } from './types';
+
+export async function get() {
+	const modules = import.meta.glob('./*.svx');
+
+	const projects: Project[] = [];
+
+	const resolved = await Promise.all(Object.values(modules).map((f) => f()));
+	resolved.forEach((project, index) => {
+		const { concluded, description, timeActive, title, usersPerDay } = project.metadata;
+
+		projects.push({
+			concluded,
+			description,
+			timeActive,
+			title,
+			usersPerDay,
+			url: `/projects/${Object.keys(modules)[index].replace('.svx', '').replace('./', '')}`,
+		});
+	});
+	return {
+		body: { projects },
+	};
+}
diff --git a/src/routes/projects/types.ts b/src/routes/projects/types.ts
new file mode 100644
index 0000000..369b781
--- /dev/null
+++ b/src/routes/projects/types.ts
@@ -0,0 +1,8 @@
+export interface Project {
+	title: string;
+	description: string;
+	concluded: boolean;
+	timeActive: string;
+	usersPerDay: number;
+	url: string;
+}
diff --git a/svelte.config.js b/svelte.config.js
index 892f0c4..9de73a7 100644
--- a/svelte.config.js
+++ b/svelte.config.js
@@ -1,11 +1,15 @@
 import adapter from '@sveltejs/adapter-auto';
 import preprocess from 'svelte-preprocess';
+import mdsvexConfig from './mdsvex.config.js';
+import { mdsvex } from 'mdsvex';
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
+	extensions: ['.svelte', ...mdsvexConfig.extensions],
+
 	// Consult https://github.com/sveltejs/svelte-preprocess
 	// for more information about preprocessors
-	preprocess: preprocess(),
+	preprocess: [mdsvex(mdsvexConfig), preprocess()],
 
 	kit: {
 		adapter: adapter()
diff --git a/yarn.lock b/yarn.lock
index b03a060..6b02be8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -17,6 +17,28 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
+"@floating-ui/core@^0.7.2":
+  version "0.7.2"
+  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-0.7.2.tgz#f7af9613d080dc29360e77c970965b79b524d45a"
+  integrity sha512-FRVAkSNU/vGXLIsgbggcs70GkXKEOXgBBbNpYPNHSaKsCAMMd00NrjbtKTesxkdv9xm9N3+XiDlcFGY6WnatBg==
+
+"@floating-ui/dom@0.5.2":
+  version "0.5.2"
+  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-0.5.2.tgz#908f3febbfc0d6696d70921616ec194fe07af183"
+  integrity sha512-z1DnEa7F3d8Fm/eXSbii8UEGpcjZGkQaYYUI0WpEVgD3vBfebDW8j/3ysusxonuMexoigA+A3b/fYH7sEqiwyg==
+  dependencies:
+    "@floating-ui/core" "^0.7.2"
+
+"@fontsource/syne@^4.5.9":
+  version "4.5.9"
+  resolved "https://registry.yarnpkg.com/@fontsource/syne/-/syne-4.5.9.tgz#c0327731a6cc6068d6318514650641523878b128"
+  integrity sha512-DDo68cQgUxfNaH/rHvhGByZezF6+uOup7AQFxqa9jDGlY2eTp0m5E379mfKni5oPMLesYOKfOYn7o2qY3M4j7g==
+
+"@fontsource/voces@^4.5.9":
+  version "4.5.9"
+  resolved "https://registry.yarnpkg.com/@fontsource/voces/-/voces-4.5.9.tgz#26bc035a6c2edaf5b5a9e5e23349f214f788abef"
+  integrity sha512-MfupQOTSwPYmeu+++GzCflZaAhg4P3Up09QVOxN488nuPZehbDV+FFlwFi1eV2t8y1HI+bIOO1VTXeuH0KYKHQ==
+
 "@humanwhocodes/config-array@^0.9.2":
   version "0.9.5"
   resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.9.5.tgz#2cbaf9a89460da24b5ca6531b8bbfc23e1df50c7"
@@ -69,6 +91,11 @@
     semver "^7.3.5"
     tar "^6.1.11"
 
+"@mdi/js@^6.7.96":
+  version "6.7.96"
+  resolved "https://registry.yarnpkg.com/@mdi/js/-/js-6.7.96.tgz#6cd13ba64eeaf347c857feb3c328d31af3e75876"
+  integrity sha512-vZvhFrNN9LQx+Awu3nU6ESfXXDpRA/CA4mwikzU5g8uf9NpAocK43ecQvVNntwiXlLKpyplas8d4lsfpqjtXLA==
+
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
@@ -160,16 +187,17 @@
     magic-string "^0.26.2"
     svelte-hmr "^0.14.12"
 
-"@svelteuidev/composables@0.6.5":
-  version "0.6.5"
-  resolved "https://registry.yarnpkg.com/@svelteuidev/composables/-/composables-0.6.5.tgz#993f1cc2c888137c2ba8c48d68fe64c58b32ceee"
-  integrity sha512-aFhNLGkf4067nK7522LIEUbzfKDHJUxFjNX4JMOPkPyuv7iNyMeWvMAqZgqvyUKZ+EKi1qMZJUFevIB4IsQzEw==
+"@svelteuidev/composables@^0.6.8":
+  version "0.6.8"
+  resolved "https://registry.yarnpkg.com/@svelteuidev/composables/-/composables-0.6.8.tgz#2b4da905cf6e20af8df5b17d7334816a8a672ee6"
+  integrity sha512-Mb8uDh5M0+kJxbUXP6gEHM1bZrCTfeBAztKOCLbvqlODZT3fOojhbHh5+Z4OJCqewLRDdrkB7LSV7YDKQHdJXw==
 
-"@svelteuidev/core@0.6.5":
-  version "0.6.5"
-  resolved "https://registry.yarnpkg.com/@svelteuidev/core/-/core-0.6.5.tgz#1503251b71b6748c4ebf8d6c18cb945e3938b6e6"
-  integrity sha512-H3PnmYmfYaQEowQsE3J2UULlStcIrAaiht2eO1QDNrZ7H2PIXKkBBZdpdoNYrGZg0AP/t5ovU/+q4lOOCTNVWA==
+"@svelteuidev/core@^0.6.8":
+  version "0.6.8"
+  resolved "https://registry.yarnpkg.com/@svelteuidev/core/-/core-0.6.8.tgz#4e76d602c92ba49b121d97031fc6a717b256335a"
+  integrity sha512-EA1dFSR2R0jgfgPVt9c34zMrOSnvfYOseu6MzxaDeHZvsH0GKa8U8xDVOp20d0CgOW2Q5kF6tfwz9YxDYZN1kA==
   dependencies:
+    "@floating-ui/dom" "0.5.2"
     "@stitches/core" "1.2.8"
 
 "@types/json-schema@^7.0.9":
@@ -194,6 +222,11 @@
   dependencies:
     "@types/node" "*"
 
+"@types/unist@^2.0.0", "@types/unist@^2.0.2", "@types/unist@^2.0.3":
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.6.tgz#250a7b16c3b91f672a24552ec64678eeb1d3a08d"
+  integrity sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==
+
 "@typescript-eslint/eslint-plugin@^5.27.0":
   version "5.27.1"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.27.1.tgz#fdf59c905354139046b41b3ed95d1609913d0758"
@@ -1157,6 +1190,11 @@ isexe@^2.0.0:
   resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10"
   integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==
 
+jetbrains-mono@^1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/jetbrains-mono/-/jetbrains-mono-1.0.6.tgz#f716b35b9b750e4ad3ec82b6148e35d09373bf27"
+  integrity sha512-nVHwukZwQHKEQ3ZP1qlXFyFoUyBnonwrqLQf/ZlsoDPgTHm7T0EL0m1KJQ9U4ghu4emYuSR21uqmZalzNvvoUA==
+
 js-yaml@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-4.1.0.tgz#c1fb65f8f5017901cdd2c951864ba18458a10602"
@@ -1220,6 +1258,21 @@ make-dir@^3.1.0:
   dependencies:
     semver "^6.0.0"
 
+mdi-svelte@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/mdi-svelte/-/mdi-svelte-1.1.2.tgz#b0fd281587c69891e40e31cf4e0b4da6be073462"
+  integrity sha512-jVn/CxVzOXTVWDJpUgkgbL/Dt3GTcxa51bOZHQtmrW+lPNypKXddNJIvcqSX+xW6KRIgjB4m715XjaqbDT/mFA==
+
+mdsvex@^0.10.6:
+  version "0.10.6"
+  resolved "https://registry.yarnpkg.com/mdsvex/-/mdsvex-0.10.6.tgz#5ba975f4616e5255ca31cd93d33e2c2a22845631"
+  integrity sha512-aGRDY0r5jx9+OOgFdyB9Xm3EBr9OUmcrTDPWLB7a7g8VPRxzPy4MOBmcVYgz7ErhAJ7bZ/coUoj6aHio3x/2mA==
+  dependencies:
+    "@types/unist" "^2.0.3"
+    prism-svelte "^0.4.7"
+    prismjs "^1.17.1"
+    vfile-message "^2.0.4"
+
 merge2@^1.3.0, merge2@^1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
@@ -1528,6 +1581,16 @@ prettier@^2.6.2:
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.6.2.tgz#e26d71a18a74c3d0f0597f55f01fb6c06c206032"
   integrity sha512-PkUpF+qoXTqhOeWL9fu7As8LXsIUZ1WYaJiY/a7McAQzxjk82OF0tibkFXVCDImZtWxbvojFjerkiLb0/q8mew==
 
+prism-svelte@^0.4.7:
+  version "0.4.7"
+  resolved "https://registry.yarnpkg.com/prism-svelte/-/prism-svelte-0.4.7.tgz#fbc6709450b4e2ed660ddb82c3718817fc584cbe"
+  integrity sha512-yABh19CYbM24V7aS7TuPYRNMqthxwbvx6FF/Rw920YbyBWO3tnyPIqRMgHuSVsLmuHkkBS1Akyof463FVdkeDQ==
+
+prismjs@^1.17.1:
+  version "1.28.0"
+  resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.28.0.tgz#0d8f561fa0f7cf6ebca901747828b149147044b6"
+  integrity sha512-8aaXdYvl1F7iC7Xm1spqSaY/OJBpYW3v+KJ+F17iYxvdc8sfjW194COK5wVhMZX45tGteiBQgdvD/nhxcRwylw==
+
 process-nextick-args@~2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.1.tgz#7820d9b16120cc55ca9ae7792680ae7dba6d7fe2"
@@ -1952,6 +2015,13 @@ typescript@*, typescript@^4.7.2:
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.3.tgz#8364b502d5257b540f9de4c40be84c98e23a129d"
   integrity sha512-WOkT3XYvrpXx4vMMqlD+8R8R37fZkjyLGlxavMc4iB8lrl8L0DeTcHbYgw/v0N/z9wAFsgBhcsF0ruoySS22mA==
 
+unist-util-stringify-position@^2.0.0:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/unist-util-stringify-position/-/unist-util-stringify-position-2.0.3.tgz#cce3bfa1cdf85ba7375d1d5b17bdc4cada9bd9da"
+  integrity sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g==
+  dependencies:
+    "@types/unist" "^2.0.2"
+
 uri-js@^4.2.2:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
@@ -1969,6 +2039,14 @@ v8-compile-cache@^2.0.3:
   resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"
   integrity sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==
 
+vfile-message@^2.0.4:
+  version "2.0.4"
+  resolved "https://registry.yarnpkg.com/vfile-message/-/vfile-message-2.0.4.tgz#5b43b88171d409eae58477d13f23dd41d52c371a"
+  integrity sha512-DjssxRGkMvifUOJre00juHoP9DPWuzjxKuMDrhNbk2TdaYYBNMStsNhEOt3idrtI12VQYM/1+iM0KOzXi4pxwQ==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-stringify-position "^2.0.0"
+
 vite@^2.9.10:
   version "2.9.10"
   resolved "https://registry.yarnpkg.com/vite/-/vite-2.9.10.tgz#f574d96655622c2e0fbc662edd0ed199c60fe91a"