Files

T

greeneclipse 8580c996c3 Initial commit of Descrybe v2 without local scratch artifacts.

Drop one-shot tmp/axe scripts and agent i18n scratch so the Gitea tree is deployable.

2026-08-09 22:47:43 +02:00

2.5 KiB

Raw Blame History

07 — Admin shell (layout / nav / chrome)

Platform admin UI lives under /admin/* with a dedicated shell (not the tenant dashboard layout). This doc covers the shared chrome only — page bodies own their own data/actions.

Stack: Go chi API + SvelteKit 5 / Svelte / Tailwind (not Laravel).

Goals

Brand sidebar via semantic --sidebar-* tokens (russian-violet light / deepened dark).
Both themes: html.dark + shared $lib/theme.svelte; content uses bg-background / text-foreground / bg-card — not a light-only paint.
Chart tokens in layout.css stay preserved for analytics.
No sticky AdminHeader. Theme via ThemeToggle in sidebar footer + mobile chrome.
No Migration readiness / cutover banner in the shell.
/admin is the command center (signals + curated shortcuts) — not a flat tool-card grid.
Responsive: persistent sidebar ≥ lg; off-canvas drawer below; mobile menu hook only in layout.
Accessible: skip link, aria-current, focus-visible rings, mobile focus trap + Escape.

Files

Piece	Path
Admin branch	`apps/web/src/routes/+layout.svelte` (`#admin-shell`)
Nav IA catalog	`apps/web/src/lib/admin-nav.ts`
Sidebar	`apps/web/src/lib/components/AdminNav.svelte`
Drawer state	`apps/web/src/lib/admin-nav-ui.svelte.ts`
Theme	`apps/web/src/lib/theme.svelte.ts` + `ThemeToggle.svelte`
Command center	`apps/web/src/routes/admin/+page.svelte`
Tokens	`apps/web/src/routes/layout.css`

Nav IA

Source: ADMIN_NAV_ROUTES / ADMIN_NAV_SECTIONS in $lib/admin-nav.ts.

Section	Links	Gate
Overview	Command center (`/admin`), Analytics	Analytics: full admin
Directory	Users & orgs	full admin
Support	Tickets, Knowledge	Knowledge: full admin
Operations	Diagnostics, Stuck products	full admin
Commerce	Billing	full admin
System	Settings	full admin

Support-only: Tickets (+ Command center in nav; home redirects to /admin/support).

Footer: staff chip · ThemeToggle · Back to app · Sign out.

Structure

[SkipLink]
[#admin-shell]  /* inherits html.dark tokens */
  [AdminNav #admin-sidebar]   w-[15.5rem], bg-sidebar, sidebar-* tokens
  [content lg:ml-[15.5rem]]
    SystemModeBanner / BillingRecoveryBanner
    [mobile] menu + adminPageTitle + ThemeToggle
    <main data-admin-shell="main">

Page chrome contract

Use PageShell. Slots: data-admin-shell="main", data-admin-slot="diagnostics-panels", data-admin-chrome="staff".

2.5 KiB Raw Blame History