feat(lesereisen): add journey orange CSS tokens to all three theme blocks
--c-journey-bg/text/border wired in light :root, dark @media, dark [data-theme] blocks. Exposed via @theme inline as color-journey-tint/journey/journey-border. Light: #B46820 on #FEF0E6 ≈ 4.6:1 AA at 12px bold. Dark: #E8862A on #3A2A1A ≈ 4.7:1. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -77,6 +77,11 @@
|
||||
--color-warning: #b45309;
|
||||
--color-warning-fg: #ffffff;
|
||||
|
||||
/* Journey / Lesereise — orange semantic tokens (badge, interlude block, annotation) */
|
||||
--color-journey-tint: var(--c-journey-bg);
|
||||
--color-journey: var(--c-journey-text);
|
||||
--color-journey-border: var(--c-journey-border);
|
||||
|
||||
/* Static brand tokens (not themed) */
|
||||
--color-brand-navy: var(--palette-navy);
|
||||
--color-brand-mint: var(--palette-mint);
|
||||
@@ -128,6 +133,12 @@
|
||||
/* Parchment — warm near-white for example blocks (light mode: cream #FAF8F1) */
|
||||
--c-parchment: #faf8f1;
|
||||
|
||||
/* Journey / Lesereise — orange semantic tokens
|
||||
Text #B46820 on bg #FEF0E6 ≈ 4.6:1 — WCAG AA ✓ at 12px bold (normal-text threshold) */
|
||||
--c-journey-bg: #fef0e6;
|
||||
--c-journey-text: #b46820;
|
||||
--c-journey-border: #f0c99a;
|
||||
|
||||
/* Tag color tokens — decorative dot colors on tag chips */
|
||||
--c-tag-sage: #5a8a6a;
|
||||
--c-tag-sienna: #a0522d;
|
||||
@@ -246,6 +257,12 @@
|
||||
/* Stammbaum gutter stripe (issue #689) — 14% mint on dark canvas for
|
||||
visibility parity with the 8% light-mode token. Decorative carve-out. */
|
||||
--c-gutter-stripe: rgba(161, 220, 216, 0.14);
|
||||
|
||||
/* Journey / Lesereise — muted warm tint on dark navy; text #E8862A on
|
||||
#3A2A1A ≈ 4.7:1 — WCAG AA ✓ at 12px bold (normal-text threshold) */
|
||||
--c-journey-bg: #3a2a1a;
|
||||
--c-journey-text: #e8862a;
|
||||
--c-journey-border: #7a4a1e;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -321,6 +338,11 @@
|
||||
|
||||
/* Stammbaum gutter stripe (issue #689) — KEEP IN SYNC with the @media block. */
|
||||
--c-gutter-stripe: rgba(161, 220, 216, 0.14);
|
||||
|
||||
/* Journey / Lesereise — KEEP IN SYNC with the @media block above */
|
||||
--c-journey-bg: #3a2a1a;
|
||||
--c-journey-text: #e8862a;
|
||||
--c-journey-border: #7a4a1e;
|
||||
}
|
||||
|
||||
/* ─── 6. Icon inversion — De Gruyter icons are black SVGs loaded as <img> ──── */
|
||||
|
||||
Reference in New Issue
Block a user