Five dashboard pages (dead-letters, files, users, invitations, queues) reference CSS custom properties like var(--text-muted, #666), var(--bg-secondary, #f5f5f5), var(--border, #e0e0e0), var(--color-link) that the dashboard never defined — so users saw the light-theme fallbacks: #666 text on #f5f5f5 backgrounds, borders that disappeared, a white-on-red error banner. The dashboard otherwise renders with the slate-900 dark palette. Define a :root token set in routes/+layout.svelte using the slate shades already used inline elsewhere. Per-page styles stop hitting their fallbacks; the dark theme renders consistently everywhere. No per-page CSS touched — the tokens cover every fallback already in use (audited via grep across the five pages cited in the AUDIT.md). Adds a few extra tokens (danger/success/warning) so future pages have a single source of truth instead of inline hex. `npm run check` shows no new errors (the pre-existing 149 errors in tests/e2e/* from missing @playwright/test were documented out-of-scope in the AUDIT.md methodology notes). AUDIT.md anchor: F-U-004. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
PiCloud Dashboard
SvelteKit SPA for the PiCloud control plane.
Stack
- SvelteKit 2 with
adapter-static(SPA fallback) - Svelte 5 (runes)
- TypeScript
- Vite
Scripts
npm install
npm run dev # vite dev server on :5173, proxies /api → PICLOUD_API
npm run build # static SPA bundle into ./build/
npm run check # svelte-check
npm run lint
npm run format
By default npm run dev proxies /api/* and /healthz to
http://127.0.0.1:18080. Override with PICLOUD_API=http://host:port npm run dev.
How it fits in
In production Caddy serves the contents of ./build/ as static files and
falls back to index.html for client-side routing. The dashboard only
talks to the control plane (/api/admin/* on the manager); data-plane
invocations go through /api/execute/* on the orchestrator and are not
issued from the dashboard directly during MVP.