Die App hat nie eine Tailwind-Utility benutzt - saemtliche Klassen im Code sind eigene (btn, files-bar, empty-state, ...), und den Reset liefert base.css selbst. Damit standen package.json, node_modules und ein Build-Schritt fuer eine Stylesheet-Datei, die nichts beigetragen hat. Aufgefallen ist es, weil der letzte Commit ungefragt zwoelf Zeilen in assets/tailwind.css mitbrachte: Der Generator scannt auch docs/ und erzeugte Utilities fuer Woerter, die er in Prosa fand. Die npm-Abhaengigkeit war ohnehin wirkungslos - Dioxus 0.7 bringt Tailwind selbst mit (erzeugt wurde 4.1.5, nicht die in package.json deklarierte 4.3.3). Ohne die Eingabedatei tailwind.css im Projektwurzelverzeichnis erzeugt dx nichts mehr; verifiziert durch einen vollstaendigen Build. Das --dn-Praefix der Tokens bleibt: Es war urspruenglich Schutz vor Tailwinds eigenen :root-Variablen, taugt aber weiterhin als Namensraum. README auf den tatsaechlichen Projektstand gebracht - er beschrieb noch die Dioxus-Vorlage mit einer einzelnen main.rs.
98 lines
4.1 KiB
CSS
98 lines
4.1 KiB
CSS
/* ==========================================================================
|
|
Design tokens — the only place raw values live.
|
|
|
|
Palette: Catppuccin Mocha, matching the editor's Theme::CATPPUCCIN_MOCHA
|
|
so the editor pane and the app chrome are the same surface.
|
|
|
|
All tokens are prefixed --dn- to keep them in one namespace. The prefix was
|
|
originally defence against Tailwind v4, which publishes its own --font-*,
|
|
--text-* and --radius-* on :root; Tailwind is gone, the convention stays.
|
|
========================================================================== */
|
|
|
|
:root {
|
|
/* --- Raw palette ------------------------------------------------------ */
|
|
--ctp-crust: #11111b;
|
|
--ctp-mantle: #181825;
|
|
--ctp-base: #1e1e2e;
|
|
--ctp-surface-0: #313244;
|
|
--ctp-surface-1: #45475a;
|
|
--ctp-surface-2: #585b70;
|
|
--ctp-overlay-0: #6c7086;
|
|
--ctp-subtext-0: #a6adc8;
|
|
--ctp-text: #cdd6f4;
|
|
|
|
--ctp-mauve: #cba6f7;
|
|
--ctp-green: #a6e3a1;
|
|
--ctp-peach: #fab387;
|
|
--ctp-red: #f38ba8;
|
|
|
|
/* --- Semantic surfaces ------------------------------------------------ */
|
|
--dn-bg-app: var(--ctp-base); /* editor pane, page background */
|
|
--dn-bg-sunken: var(--ctp-mantle); /* sidebar, chrome */
|
|
--dn-bg-well: var(--ctp-crust); /* deepest: inputs, scrollbar track */
|
|
--dn-bg-raised: var(--ctp-surface-0); /* hover, selected */
|
|
--dn-bg-overlay: var(--ctp-surface-1); /* popovers, tooltips */
|
|
|
|
/* --- Semantic text ---------------------------------------------------- */
|
|
--dn-fg: var(--ctp-text);
|
|
--dn-fg-muted: var(--ctp-subtext-0);
|
|
--dn-fg-faint: var(--ctp-overlay-0);
|
|
--dn-fg-on-accent: var(--ctp-crust);
|
|
|
|
/* --- Lines ------------------------------------------------------------ */
|
|
--dn-border: var(--ctp-surface-0);
|
|
--dn-border-strong: var(--ctp-surface-1);
|
|
|
|
/* --- Accent & status -------------------------------------------------- */
|
|
--dn-accent: var(--ctp-mauve);
|
|
--dn-accent-hover: color-mix(in oklab, var(--ctp-mauve) 88%, white);
|
|
--dn-accent-muted: color-mix(in oklab, var(--ctp-mauve) 22%, transparent);
|
|
--dn-success: var(--ctp-green);
|
|
--dn-warning: var(--ctp-peach);
|
|
--dn-danger: var(--ctp-red);
|
|
|
|
/* --- Type ------------------------------------------------------------- */
|
|
--dn-font-ui: system-ui, -apple-system, "Segoe UI Variable Text", "Segoe UI",
|
|
Roboto, sans-serif;
|
|
--dn-font-code: "JetBrains Mono", "Cascadia Code", "Fira Code", ui-monospace,
|
|
"SF Mono", Consolas, "Liberation Mono", monospace;
|
|
|
|
--dn-text-xs: 0.75rem; /* 12 — captions, counts */
|
|
--dn-text-sm: 0.8125rem; /* 13 — sidebar, dense chrome */
|
|
--dn-text-base: 0.875rem; /* 14 — UI default */
|
|
--dn-text-md: 1rem; /* 16 — prose */
|
|
--dn-text-lg: 1.25rem; /* 20 — section headings */
|
|
--dn-text-xl: 1.5rem; /* 24 — page title */
|
|
|
|
--dn-leading-tight: 1.25;
|
|
--dn-leading-normal: 1.55;
|
|
|
|
--dn-tracking-caps: 0.08em; /* eyebrows / all-caps labels */
|
|
|
|
/* --- Space (4px base) -------------------------------------------------- */
|
|
--dn-space-1: 0.25rem;
|
|
--dn-space-2: 0.5rem;
|
|
--dn-space-3: 0.75rem;
|
|
--dn-space-4: 1rem;
|
|
--dn-space-5: 1.5rem;
|
|
--dn-space-6: 2rem;
|
|
--dn-space-7: 3rem;
|
|
|
|
/* --- Shape ------------------------------------------------------------- */
|
|
--dn-radius-sm: 3px;
|
|
--dn-radius: 5px;
|
|
--dn-radius-lg: 8px;
|
|
|
|
/* --- Motion ------------------------------------------------------------ */
|
|
--dn-ease: cubic-bezier(0.2, 0, 0, 1);
|
|
--dn-dur-fast: 90ms;
|
|
--dn-dur: 160ms;
|
|
|
|
/* --- Elevation ---------------------------------------------------------- */
|
|
--dn-shadow: 0 4px 16px rgb(0 0 0 / 0.35);
|
|
|
|
/* --- Layout ------------------------------------------------------------- */
|
|
--dn-sidebar-width: 240px;
|
|
--dn-measure: 72ch; /* max line length for prose */
|
|
}
|