🙃

frontend/src/routes/+page.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+	import SunIcon from '@lucide/svelte/icons/sun';
+	import MoonIcon from '@lucide/svelte/icons/moon';
+
+	import { Button } from '$lib/components/ui/button/index.js';
+	import { toggleMode } from 'mode-watcher';
+	import Grid from '$lib/components/grid/grid.svelte';
+</script>
+
+<Button onclick={toggleMode} variant="outline" size="icon">
+	<SunIcon
+		class="h-[1.2rem] w-[1.2rem] scale-100 rotate-0 !transition-all dark:scale-0 dark:-rotate-90"
+	/>
+	<MoonIcon
+		class="absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 !transition-all dark:scale-100 dark:rotate-0"
+	/>
+	<span class="sr-only">Toggle theme</span>
+</Button>
+
+<div class="h-[80vh] overflow-hidden rounded-lg border">
+	<Grid />
+</div>