enricobuehler
56f724815e
Move the management console (web/) off shadcn/ui to the shared @unom/ui design system the marketing site + docs are built on, on the punktfunk violet brand over dark chrome: - Add @unom/ui/@unom/style/motion/radix-ui/zod + Geist; web/.npmrc maps the @unom scope (packages are public-read, so CI needs no npm auth). - styles.css: one dark-violet palette (#141019/#1c1530, brand #6c5bf3 -> #a79ff8) exposed under BOTH the shadcn token names the routes use and @unom/ui's contract, so routes + components both resolve; pulls in @unom/ui's material gloss + easings. - components/ui/* now back onto @unom/ui (AnimatedButton/InputText/Label/ AnimatedCard); brand-mark/wordmark/logo replace the generic Radio icon in the shell + login. - MaterialProvider (specular gloss) at the root. No UI sounds, like the site. docs-site: new /api route renders the host management REST API as an interactive Scalar reference (reads public/openapi.json, a snapshot of docs/api/openapi.json), branded violet and linked from the top nav, the docs sidebar, the landing page, and host-cli.md. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
55 lines
1.4 KiB
TypeScript
55 lines
1.4 KiB
TypeScript
/// <reference types="vite/client" />
|
|
import {
|
|
createRootRouteWithContext,
|
|
HeadContent,
|
|
Outlet,
|
|
Scripts,
|
|
useRouterState,
|
|
} from '@tanstack/react-router'
|
|
import type { QueryClient } from '@tanstack/react-query'
|
|
import '@fontsource-variable/geist'
|
|
import { AppShell } from '@/components/app-shell'
|
|
import { UnomProviders } from '@/components/unom-providers'
|
|
import appCss from '@/styles.css?url'
|
|
|
|
export interface RouterContext {
|
|
queryClient: QueryClient
|
|
}
|
|
|
|
export const Route = createRootRouteWithContext<RouterContext>()({
|
|
head: () => ({
|
|
meta: [
|
|
{ charSet: 'utf-8' },
|
|
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
|
|
{ name: 'color-scheme', content: 'dark light' },
|
|
{ title: 'punktfunk' },
|
|
],
|
|
links: [{ rel: 'stylesheet', href: appCss }],
|
|
}),
|
|
component: RootComponent,
|
|
})
|
|
|
|
function RootComponent() {
|
|
// The login screen renders bare (no sidebar); everything else gets the app shell.
|
|
const isLogin = useRouterState({ select: (s) => s.location.pathname === '/login' })
|
|
return (
|
|
<html lang="en" className="dark">
|
|
<head>
|
|
<HeadContent />
|
|
</head>
|
|
<body className="min-h-screen">
|
|
<UnomProviders>
|
|
{isLogin ? (
|
|
<Outlet />
|
|
) : (
|
|
<AppShell>
|
|
<Outlet />
|
|
</AppShell>
|
|
)}
|
|
</UnomProviders>
|
|
<Scripts />
|
|
</body>
|
|
</html>
|
|
)
|
|
}
|