feat(#221): add --c-tag-* CSS custom properties for 10 semantic tag color tokens

Light and dark variants for: sage, sienna, amber, slate, violet, rose,
cobalt, moss, sand, coral — used as decorative dot colors on tag chips.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-16 15:50:13 +02:00
parent c3e007d421
commit e4f21bd896

View File

@@ -115,6 +115,18 @@
--c-danger: #c0392b;
--c-danger-fg: #ffffff;
/* Tag color tokens — decorative dot colors on tag chips */
--c-tag-sage: #5a8a6a;
--c-tag-sienna: #a0522d;
--c-tag-amber: #c17a00;
--c-tag-slate: #607080;
--c-tag-violet: #7a4f9a;
--c-tag-rose: #c0446e;
--c-tag-cobalt: #3060b0;
--c-tag-moss: #4a7a3a;
--c-tag-sand: #9a8040;
--c-tag-coral: #c05540;
/* PersonType badge — institution (navy-tinted blue) */
--c-badge-institution-bg: #e8eff7;
--c-badge-institution-text: #1a4971;
@@ -183,6 +195,18 @@
/* Danger — destructive actions (4.7:1 on #011526 — WCAG AA ✓) */
--c-danger: #e55347;
--c-danger-fg: #ffffff;
/* Tag color tokens — lighter for visibility on dark backgrounds */
--c-tag-sage: #7abf8a;
--c-tag-sienna: #cc7050;
--c-tag-amber: #f0aa30;
--c-tag-slate: #8a9db0;
--c-tag-violet: #b07ad0;
--c-tag-rose: #f07090;
--c-tag-cobalt: #6090e0;
--c-tag-moss: #70b060;
--c-tag-sand: #c0a060;
--c-tag-coral: #f07060;
}
}
@@ -235,6 +259,18 @@
/* Danger — destructive actions (4.7:1 on #011526 — WCAG AA ✓) */
--c-danger: #e55347;
--c-danger-fg: #ffffff;
/* Tag color tokens — lighter for visibility on dark backgrounds */
--c-tag-sage: #7abf8a;
--c-tag-sienna: #cc7050;
--c-tag-amber: #f0aa30;
--c-tag-slate: #8a9db0;
--c-tag-violet: #b07ad0;
--c-tag-rose: #f07090;
--c-tag-cobalt: #6090e0;
--c-tag-moss: #70b060;
--c-tag-sand: #c0a060;
--c-tag-coral: #f07060;
}
/* ─── 6. Icon inversion — De Gruyter icons are black SVGs loaded as <img> ──── */