feat(web): flatten admin shell — horizontal tabs, drop redundant banner

The /admin layout had three nested concentric shells: the global Shell
header + main nav, then a per-admin header banner with a Sword icon, then
a left-aligned admin sub-nav (AdminSidebar) — two competing left-edge
navigation columns plus a redundant 'Admin' label that the URL and active
nav already conveyed.

Replaces the side sub-nav with a horizontal tab strip across the top of
the admin content (matches the discover-page tab pattern), drops the
duplicate header banner, and removes the disabled Users/Library
placeholder items so the tab strip only shows surfaces that actually
ship today. The component is renamed AdminSidebar -> AdminTabs to match
its new shape.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-05-01 22:14:39 -04:00
parent 4b088e6b6f
commit 14c1895beb
5 changed files with 100 additions and 138 deletions
+4 -13
View File
@@ -1,19 +1,10 @@
<script lang="ts">
import { Sword } from 'lucide-svelte';
import AdminSidebar from '$lib/components/AdminSidebar.svelte';
import AdminTabs from '$lib/components/AdminTabs.svelte';
let { children } = $props<{ children: import('svelte').Snippet }>();
</script>
<div class="min-h-screen bg-background text-text-primary">
<header class="flex items-center gap-3 border-b border-border bg-surface px-4 py-3">
<Sword size={20} strokeWidth={1.5} class="text-action-destructive" />
<h1 class="font-display text-xl font-medium">Admin</h1>
</header>
<div class="flex">
<AdminSidebar />
<main class="flex-1 p-6">
{@render children?.()}
</main>
</div>
<div class="space-y-6">
<AdminTabs />
{@render children?.()}
</div>