Implement the approved UX review across Fleet, Betas, Library, deployments, and Settings. Add reviewed promotion and reconciliation plans, atomic queued-removal cancellation, recoverable beta drafts and launch inputs, accessible controls, and mobile improvements.
Validated with 473 tests, a clean typecheck, production build, and isolated desktop/mobile browser walkthroughs. Include the review and implementation coverage notes.
Restraint-first design language: neutral gray surfaces + one blue accent
(cyan/amber/red reserved for state), 8pt spacing, softer radii, one
ambient + one raised shadow, standardized motion tokens. Alfa Slab One
demoted to BrandMark only; Inter carries all page copy.
New primitives (Button, Card, Badge, Stat, SectionHeader, Skeleton,
EmptyState, Tabs, Breadcrumbs, StatusPip, Field, Input, Select, Textarea)
plus motion utilities (tweenNumber, viewTransition) and a global toast
system. All eight route surfaces rewritten on top: Fleet gains an
overview hero, Server detail restructures into tabs, Deployments gets a
collapsible drift summary + per-server pipeline visual, and the
scripts/configs/plugins/betas flows adopt the new form primitives.
Sticky translucent nav with backdrop blur, view-transition cross-fades
between routes, staggered card entrance on Fleet, breathing status pip
halo, tabular-numeric player counts. Gmail-style g-key nav shortcuts.
Mobile stacks below 720px; prefers-reduced-motion neutralizes durations.
Legacy tokens preserved as aliases so any un-migrated code still renders.
Swap the cherry-red primary for the logo's blue, bump body 13→15px
and h1 32→40px, and add semantic tokens (--bg-*, --accent-*, --text-*)
so future palette shifts are a single-file edit. Cherry-red survives
only for danger states and the brand cherry mark.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Firefox's console was spammed with "downloadable font: download failed
status=2147746065" for every @fontsource family — Inter, Alfa Slab One,
JetBrains Mono. Root cause: the built CSS referenced
./files/inter-latin-400-normal.woff2 but no font files were ever emitted
to build/client/_app/immutable/assets/.
Vite's CSS `@import` inlines the imported file's *text* but doesn't
crawl the resulting url() references to emit their assets. Since
tokens.css was doing `@import '@fontsource/inter/400.css'` and being
pulled into +layout.svelte via a Svelte <style> @import, the fonts
lived entirely in CSS space where Vite's asset emission never saw them.
Moved the @fontsource imports into src/lib/ui/styles/fonts.ts and
side-effect-import that module from +layout.svelte's <script>. JS
imports go through the module graph, so Vite walks the CSS, sees the
url() references, and emits the woff/woff2 binaries.
Verified: build now emits 80 font files (14 subsets × 5-6 weights)
into build/client/_app/immutable/assets/ and the CSS url()s resolve
to the correct hashed filenames in the same directory.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Themes the fleet manager around the Electric Cherry perk-a-cola from Mob of
the Dead — cherry-red art-deco label with electric cyan discharge. New
design tokens (Alfa Slab One + Inter + JetBrains Mono, self-hosted), full
redesign of layout/dashboard/cards/detail page, tokens pass on
deployments/betas/pipeline/beta/diff, cherry+lightning favicon.
Lights up server data that RCON was already fetching but the UI dropped.
parsePlayerRoster() extracts num/score/ping/guid/name from both status
dialects. Worker persists last_map/last_gametype/last_roster/last_seen_at/
last_error (new columns with idempotent boot-time ALTERs) and emits them
over SSE. Fleet cards now show health dot, map · gametype, top-3 roster
preview, and last-seen. Detail page adds a sortable full roster with
distinct empty-lobby vs offline states. New health classifier
(online/stale/offline) drives the visual state.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
josh
