Abläufe, Strukturen, Zeiten und Zahlen — alle aus Text erzeugt und alle in der Farbpalette dieser Vorlage.
Die Seiten
- Flussdiagramme — Mermaid — Abläufe und Entscheidungen.
- Ablauf-Diagramme — Zustände, Nutzerreisen und Versionsstränge.
- Sequenzdiagramme — Wer sagt wem was, in welcher Reihenfolge.
- Struktur-Diagramme — Klassen, Entitäten und Mindmaps.
- Zahlen-Diagramme — Torten, Kurven, Flüsse und Vier-Felder-Tafeln.
- Zeit-Diagramme — Gantt-Pläne und Zeitleisten.
Welche Variablen hier greifen
Diese 22 Variablen liest der Abschnitt body-mermaid in content.scss. Ändern lassen sie sich in QuartzControl unter Stile → Variablen — ohne eine Zeile CSS.
| Variable | Wert | gilt außerdem für |
|---|---|---|
--bodyFont | "Noto Sans", system-ui, "Segoe UI", Robot… | 3 weitere Komponenten |
--dark | #17171A · dunkel #FCFCFA | 13 weitere Komponenten |
--darkgray | #333333 · dunkel #DDDDDD | 18 weitere Komponenten |
--gray | #5F5F5F · dunkel #A1A1A1 | 22 weitere Komponenten |
--headerFont | "Noto Sans", system-ui, "Segoe UI", Robot… | 15 weitere Komponenten |
--light | #FCFCFA · dunkel #16171A | 14 weitere Komponenten |
--mm-1 | im Stylesheet gesetzt (content.scss) | nur hier |
--mm-2 | im Stylesheet gesetzt (content.scss) | nur hier |
--mm-3 | im Stylesheet gesetzt (content.scss) | nur hier |
--mm-4 | im Stylesheet gesetzt (content.scss) | nur hier |
--mm-edge | im Stylesheet gesetzt (content.scss) | nur hier |
--secondary | #1463A3 · dunkel #699DC3 | 19 weitere Komponenten |
--tertiary | #196B6B · dunkel #2CAFAD | Fließtext, Die Instanzen |
--tpl-radius-md | 8px | 17 weitere Komponenten |
--tpl-radius-sm | 4px | 10 weitere Komponenten |
--tpl-rule | var(--lightgray) = #DDDDDD | 19 weitere Komponenten |
--tpl-rule-strong | var(--gray) = #5F5F5F | 8 weitere Komponenten |
--tpl-rule-width | 1px | 25 weitere Komponenten |
--tpl-space-lg | 1.5rem | 12 weitere Komponenten |
--tpl-space-md | 1rem | 18 weitere Komponenten |
--tpl-surface | var(--lightgray) = #DDDDDD | 6 weitere Komponenten |
--tpl-surface-tint | var(--highlight) = rgba(42, 78, 108, 0.10) | 14 weitere Komponenten |
Diese Tabelle ist erzeugt: Sie wird aus den Stylesheets gelesen, nicht von Hand gepflegt.