BradNut/AdelieStack
1
0
Fork 0
mirror of https://github.com/BradNut/AdelieStack synced 2025-09-08 17:40:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixing the layout.

Browse source
This commit is contained in:
Bradley Shellnut 2025-01-01 21:02:35 -08:00
parent ae21011b3f
commit 2c6a22d686
2 changed files with 17 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/routes/(app)/+layout.svelte
View file

@ -9,10 +9,10 @@
import * as Sheet from '$lib/components/ui/sheet/index.js'; import * as Sheet from '$lib/components/ui/sheet/index.js';
import { cn } from '$lib/utils/ui'; import { cn } from '$lib/utils/ui';
import HouseIcon from 'lucide-svelte/icons/house'; import HouseIcon from 'lucide-svelte/icons/house';
import { page } from '$app/stores'; import { page } from '$app/state';
import { enhance } from '$app/forms'; import { enhance } from '$app/forms';
let { children, data } = $props(); const { children, data } = $props();
const routes = [ const routes = [
{ {
@ -40,7 +40,7 @@
href={route.href} href={route.href}
class={cn( class={cn(
'text-muted-foreground transition-colors hover:text-foreground', 'text-muted-foreground transition-colors hover:text-foreground',
$page.url.pathname === route.href && page.url.pathname === route.href &&
'text-foreground transition-colors hover:text-foreground' 'text-foreground transition-colors hover:text-foreground'
)} )}
> >
@ -49,8 +49,8 @@
{/each} {/each}
</nav> </nav>
<Sheet.Root> <Sheet.Root>
<Sheet.Trigger asChild let:builder> <Sheet.Trigger>
<Button variant="outline" size="icon" class="shrink-0 md:hidden" builders={[builder]}> <Button variant="outline" size="icon" class="shrink-0 md:hidden">
<Menu class="h-5 w-5" /> <Menu class="h-5 w-5" />
<span class="sr-only">Toggle navigation menu</span> <span class="sr-only">Toggle navigation menu</span>
</Button> </Button>
@ -66,7 +66,7 @@
href={route.href} href={route.href}
class={cn( class={cn(
'text-muted-foreground hover:text-foreground', 'text-muted-foreground hover:text-foreground',
$page.url.pathname.startsWith(route.href) && 'hover:text-foreground' page.url.pathname.startsWith(route.href) && 'hover:text-foreground'
)} )}
> >
{route.label} {route.label}
@ -102,20 +102,22 @@
{#snippet userDropdown()} {#snippet userDropdown()}
<DropdownMenu.Root> <DropdownMenu.Root>
<DropdownMenu.Trigger asChild let:builder> <DropdownMenu.Trigger>
<Button builders={[builder]} variant="secondary" size="icon" class="rounded-full"> <Button variant="secondary" size="icon" class="rounded-full">
<CircleUser class="h-5 w-5" /> <CircleUser class="h-5 w-5" />
<span class="sr-only">Toggle user menu</span> <span class="sr-only">Toggle user menu</span>
</Button> </Button>
</DropdownMenu.Trigger> </DropdownMenu.Trigger>
<DropdownMenu.Content align="end"> <DropdownMenu.Content align="end">
<DropdownMenu.Item href="/settings">Settings</DropdownMenu.Item> <DropdownMenu.Item>
<a class="w-full" href="/settings">Settings</a>
</DropdownMenu.Item>
<DropdownMenu.Separator /> <DropdownMenu.Separator />
<DropdownMenu.Item> <DropdownMenu.Item>
<form action="/?/logout" method="POST" use:enhance class="w-full"> <form action="/?/logout" method="POST" use:enhance class="w-full">
<button class="w-full cursor-default text-start" type="submit">Logout</button> <button class="w-full cursor-default text-start" type="submit">Logout</button>
</form></DropdownMenu.Item </form>
> </DropdownMenu.Item>
</DropdownMenu.Content> </DropdownMenu.Content>
</DropdownMenu.Root> </DropdownMenu.Root>
{/snippet} {/snippet}

6
src/routes/+layout.svelte
View file

@ -3,9 +3,11 @@
import { ModeWatcher } from 'mode-watcher'; import { ModeWatcher } from 'mode-watcher';
import { Toaster } from "$lib/components/ui/sonner"; import { Toaster } from "$lib/components/ui/sonner";
let { children } = $props(); const { children } = $props();
</script> </script>
<ModeWatcher /> <ModeWatcher />
<Toaster /> <Toaster />
{@render children()} <main class="antialiased">
{@render children?.()}
</main>