feat(ui): update nav — show Browse link, username, and Sign out when logged in

This commit is contained in:
Admin
2026-03-03 14:03:32 +05:00
parent 9fa0776258
commit 5131ae0bc4

View File

@@ -1,7 +1,9 @@
<script lang="ts">
import '../app.css';
import type { Snippet } from 'svelte';
import type { LayoutData } from './$types';
let { children } = $props();
let { children, data }: { children: Snippet; data: LayoutData } = $props();
</script>
<svelte:head>
@@ -16,9 +18,34 @@
<a href="/" class="text-amber-400 font-bold text-lg tracking-tight hover:text-amber-300">
libnovel
</a>
{#if data.user}
<a href="/books" class="text-zinc-400 hover:text-zinc-100 text-sm transition-colors">
Library
</a>
<a href="/browse" class="text-zinc-400 hover:text-zinc-100 text-sm transition-colors">
Browse
</a>
<div class="ml-auto flex items-center gap-4">
<span class="text-zinc-400 text-sm hidden sm:block">{data.user.username}</span>
<form method="POST" action="/logout">
<button
type="submit"
class="text-zinc-400 hover:text-zinc-100 text-sm transition-colors"
>
Sign out
</button>
</form>
</div>
{:else}
<div class="ml-auto">
<a
href="/login"
class="text-sm px-3 py-1.5 rounded bg-amber-400 text-zinc-900 font-semibold hover:bg-amber-300 transition-colors"
>
Sign in
</a>
</div>
{/if}
</nav>
</header>