Files
Lumotia/docs/architecture-map/01-frontend/design-system.md
Jake 26c7307607
Some checks failed
check / cargo check (macos-latest) (push) Has been cancelled
check / cargo check (ubuntu-22.04) (push) Has been cancelled
check / cargo check (windows-latest) (push) Has been cancelled
check / svelte build + lint (push) Has been cancelled
agent: lumotia-rebrand — docs, scripts, root config, residuals
Phase 9 of the rebrand cascade. Sweep covers everything the Phase 8
frontend pass deliberately skipped: docs/, root markdown, scripts,
Cargo.toml descriptions, code comments that survived earlier
word-boundary sed, plus a handful of identifiers caught on the final
verify pass.

transcription-app changes:
- README.md, HANDOVER.md, KNOWN-ISSUES.md, run.sh — magnotia/Magnotia
  -> lumotia/Lumotia.
- docs/ — sweep across all subdirs except docs/handovers/ (preserved
  as immutable audit trail). Includes architecture-map references
  to magnotia_core::*, magnotia_storage::*, etc. now pointing at
  lumotia_*; dev-setup.md tracing output examples (lumotia_startup
  target); brief/ + superpowers/ + issues/ + whisper-ecosystem/ +
  audit/.
- Cargo.toml descriptions on 9 crates (core, audio, cloud-providers,
  hotkey, llm, mcp, plus referenced others).
- crates/core/src/{error,hardware,recommendation,paths}.rs +
  crates/audio/src/wav.rs + crates/llm/src/model_manager.rs +
  crates/cloud-providers/src/keystore.rs + crates/mcp/src/lib.rs —
  doc comments and a model-manager user-agent string.
- Caught on final pass: BroadcastChannel("magnotia_task_sync") -> ...
  ("lumotia_task_sync"); magnotia_locale i18n localStorage key
  renamed + migration shim added; CSS keyframe names
  magnotiaPulse / magnotiaBar / magnotiaFade renamed in the design-
  system kit; magnotia_viewer_item / magnotia_viewer_mode handoff
  keys renamed in HistoryPage + viewer/+page.svelte; src/assets/
  wordmark.svg text.
- src-tauri/src/lib.rs comment cleanup ("magnotia era" was sed'd
  to "lumotia era" earlier — restored).

Preserved (intentional):
- crates/core/src/paths.rs — keeps "magnotia" / "Magnotia" / ".magnotia"
  legacy detection strings in legacy_and_target_paths() so the
  migration shim can still find user data from the magnotia era.
- src/lib/stores/{page,focusTimer}.svelte.ts + src/lib/i18n/index.ts
  — migration call sites reference the legacy magnotia keys
  deliberately.
- docs/handovers/ — historical audit trail.

cargo build --workspace passes. npm run check: 0 errors / 0 warnings
(3958 files). cargo test --workspace: 339 pass / 0 fail.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-13 12:38:03 +01:00

4.0 KiB

name, type, slice, last_verified
name type slice last_verified
Design system (reference, not live) architecture-map-page 01-frontend 2026/05/09

Design system

Where you are: Architecture mapFrontend → Design system

Plain English summary. Reference material. The runtime styles live in src/app.css. Everything under src/design-system/ is brand documentation, preview pages, JSX UI kits, and ground truth source for the lumotia-design Claude skill. None of it is imported by the runtime SvelteKit app.

At a glance

  • Path: src/design-system/
  • Files:
    • README.md. Brand and content rules. (Lumotia by CORBEL.)
    • SKILL.md. lumotia-design skill manifest (user-invocable: true). The skill copies assets out and writes throwaway HTML or production code on demand.
    • colors_and_type.css. Mirror of the runtime @theme tokens for buildless preview pages. Intentional duplication, kept in sync by hand.
    • preview/. 20 buildless HTML spec cards.
    • ui_kits/. JSX recreations (DictationPage.jsx, OtherPages.jsx, Sidebar.jsx) plus an index.html and a README.

What's in here

colors_and_type.css

Mirrors src/app.css @font-face declarations and (typically) the @theme token block, with relative fonts/... URLs so preview HTML can render without going through Tailwind/Vite. The file's banner comment is explicit:

When app.css @theme changes, mirror the change here. There is no automated sync; intentional duplication keeps the preview pages buildless.

preview/ (20 HTML files)

Each renders one slice of the system:

  • Brand: brand-icons.html, brand-wordmark.html.
  • Colour: colors-accent.html, colors-semantic.html, colors-surfaces.html, colors-text.html, colors-zones.html.
  • Components: components-buttons.html, components-cards.html, components-empty-states.html, components-inputs.html, components-nav.html, components-toasts.html.
  • Spacing and motion: spacing-motion.html, spacing-radii.html, spacing-scale.html, spacing-shadows.html.
  • Type: type-body.html, type-headings.html, type-transcript-mono.html.

These are static. Open in any browser.

ui_kits/ (JSX, reference only)

Three .jsx files plus index.html and a README. Reproduce the desktop pages in JSX so prototypes can be built outside the Tauri shell. The README inside ui_kits explains how to use them. They are not imported anywhere from the SvelteKit app.

Brand language (from README.md)

  • Built for the noise allergic. Solarpunk-as-posture, AI-minimisation, ground truth + warmth.
  • Iconography: Lucide, 2 px stroke. 16 px nav, 20 px features, 24 px primary actions. Always paired with a label except OS titlebar controls.
  • Transparency + blur used sparingly: collapsed-sidebar tooltips, float window backdrop, accent-subtle 6% tint. No glassmorphism.

Why it lives in src/

The design system files sit under src/ so the lumotia-design skill (which runs from this repo) can read ground-truth Svelte source from lumotia-source/ (a sibling import). The runtime build does not include this folder; it is a reference root.

Watch outs

  • Tokens in colors_and_type.css and app.css @theme can drift. There is no CI check. When you change a token in one, change it in both.
  • ui_kits/ JSX is not used by the app. Treat it as documentation, not as a future framework migration plan. There is no plan to switch from Svelte to React.
  • Vite (with sveltekit() plugin) ignores .html files outside static/ and .jsx files outside imports. If anyone adds an import './design-system/...' somewhere, the build will start picking up reference material. Do not.
  • The skill is user invocable (SKILL.md). External agents may write into src/design-system/ based on user invocation. Treat the contents as agent-shaped, not human-only.

See also