prototype(#53): palette candidates as runtime token swaps
Throwaway. Tokenises the theme's literal colours so candidate palettes can be swapped in the browser, adds three candidates (Plum Noir one-metal, two-metal pewter, two-metal plus a champagne inset), a WCAG checker, a seeder and the screenshots they are judged on. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
@@ -92,23 +92,37 @@
|
||||
--wg-plum-soft: #3a1830;
|
||||
--wg-gold: #c2a35a;
|
||||
--wg-gold-soft: #a8893f;
|
||||
--wg-gold-lit: #e0c878;
|
||||
--wg-gold-hi: #fff4dd;
|
||||
--wg-gold-plate: #5a4a1a;
|
||||
--wg-gold-plate-hover: #6a5720;
|
||||
--wg-gold-plate-mid: #53431a;
|
||||
--wg-gold-plate-deep: #473914;
|
||||
--wg-red: #8e3438;
|
||||
/* prototype (#53): rgb triples so alpha uses swap with the palette candidate */
|
||||
--wg-gold-rgb: 194, 163, 90;
|
||||
--wg-ledger-ink-rgb: 216, 194, 138;
|
||||
--wg-bg-deep-rgb: 9, 8, 11;
|
||||
--wg-bg-deepest-rgb: 8, 7, 10;
|
||||
--wg-plum-rgb: 42, 18, 34;
|
||||
--wg-red-rgb: 142, 52, 56;
|
||||
--wg-stamp-rgb: 168, 74, 78;
|
||||
--wg-status-online: #7fb86a;
|
||||
--wg-status-away: #d9b44a;
|
||||
--wg-status-dnd: #c55a5f;
|
||||
--wg-status-offline: #b7b0a6;
|
||||
--wg-status-ring: rgba(9, 8, 11, 0.9);
|
||||
--wg-status-ring: rgba(var(--wg-bg-deep-rgb), 0.9);
|
||||
--wg-text: #e6e0d6;
|
||||
--wg-text-soft: #b9b2a6;
|
||||
--wg-text-muted: #9a9086;
|
||||
--wg-border: rgba(194, 163, 90, 0.14);
|
||||
--wg-border-soft: rgba(194, 163, 90, 0.08);
|
||||
--wg-focus: rgba(194, 163, 90, 0.28);
|
||||
--wg-border: rgba(var(--wg-gold-rgb), 0.14);
|
||||
--wg-border-soft: rgba(var(--wg-gold-rgb), 0.08);
|
||||
--wg-focus: rgba(var(--wg-gold-rgb), 0.28);
|
||||
--wg-focus-ring: #c2a35a;
|
||||
--wg-ledger-panel: rgba(21, 17, 26, 0.97);
|
||||
--wg-ledger-ruling: rgba(194, 163, 90, 0.055);
|
||||
--wg-ledger-rule-strong: rgba(194, 163, 90, 0.16);
|
||||
--wg-ledger-border: rgba(194, 163, 90, 0.18);
|
||||
--wg-ledger-ruling: rgba(var(--wg-gold-rgb), 0.055);
|
||||
--wg-ledger-rule-strong: rgba(var(--wg-gold-rgb), 0.16);
|
||||
--wg-ledger-border: rgba(var(--wg-gold-rgb), 0.18);
|
||||
--wg-ledger-ink: #d8c28a;
|
||||
--wg-ledger-ink-muted: #a99d8f;
|
||||
--wg-ledger-stamp: #a84a4e;
|
||||
@@ -118,11 +132,11 @@
|
||||
--wg-velvet-panel: rgba(24, 20, 29, 0.97);
|
||||
--wg-velvet-panel-hover: rgba(31, 26, 38, 0.98);
|
||||
--wg-velvet-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025), inset 0 0 34px rgba(96, 32, 68, 0.11), 0 10px 26px rgba(0, 0, 0, 0.24);
|
||||
--wg-control-bg: linear-gradient(to bottom, rgba(194, 163, 90, 0.15), rgba(194, 163, 90, 0.05));
|
||||
--wg-control-bg: linear-gradient(to bottom, rgba(var(--wg-gold-rgb), 0.15), rgba(var(--wg-gold-rgb), 0.05));
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: rgba(194, 163, 90, 0.32);
|
||||
background: rgba(var(--wg-gold-rgb), 0.32);
|
||||
color: #fff4dd;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user