trentuna/asw
8
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity Actions

fix: remap gray-13/14/15 to Open Props range (0-12)

Browse source 
ASW tokens referenced --gray-13, --gray-14, --gray-15 which don't
exist in Open Props (stops at --gray-12). All text and surface
colors resolved to nothing — invisible text in light mode.

Remap: 13→10, 14→11, 15→12.
This commit is contained in:
Vigilio Desto 2026-04-10 17:57:09 +02:00
parent 20f2974cfd
commit 5a8c39c3a0
Signed by: vigilio
GPG key ID: 159D6AD58C8E55E9
2 changed files with 12 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

22
assets/css/layers/01-tokens.css
View file

@ -41,9 +41,9 @@
/* ── Surfaces ──────────────────────────────────────────────────── */
--surface: var(--gray-15); /* deepest background (oklch 10%) */
--surface-1: var(--gray-14); /* cards, sidebars (oklch 18%) */
--surface-2: var(--gray-13); /* hover, raised elements (oklch 25%) */
--surface: var(--gray-12); /* deepest background (oklch 10%) */
--surface-1: var(--gray-11); /* cards, sidebars (oklch 18%) */
--surface-2: var(--gray-10); /* hover, raised elements (oklch 25%) */
--surface-card: var(--surface-1);
--surface-hover: var(--surface-2);
@ -58,7 +58,7 @@
--accent: var(--green-5);
--accent-hover: var(--green-4);
--on-accent: var(--gray-15);
--on-accent: var(--gray-12);
--accent-focus: color-mix(in oklch, var(--green-5) 35%, transparent);
--accent-subtle: color-mix(in oklch, var(--green-5) 10%, transparent);
--accent-underline: color-mix(in oklch, var(--green-5) 45%, transparent);
@ -213,7 +213,7 @@
--kbd-bg: var(--text);
--kbd-color: var(--surface);
--code-color: var(--text-2);
--table-stripe: color-mix(in oklch, var(--gray-14) 50%, transparent);
--table-stripe: color-mix(in oklch, var(--gray-11) 50%, transparent);
/* ── Form tokens ─────────────────────────────────────────────────── */
@ -239,7 +239,7 @@
/* ── Component tokens ─────────────────────────────────────────────── */
--track-bg: var(--surface-2); /* progress / meter background */
--modal-overlay: color-mix(in oklch, var(--gray-15) 80%, transparent);
--modal-overlay: color-mix(in oklch, var(--gray-12) 80%, transparent);
--modal-backdrop: blur(0.375rem);
--accordion-active: var(--accent-hover);
@ -283,7 +283,7 @@
--surface-card: var(--gray-0);
--surface-hover: var(--gray-1);
--text: var(--gray-14); /* 18% — dark but not pure black */
--text: var(--gray-11); /* 18% — dark but not pure black */
--text-2: var(--gray-11); /* 37% */
--text-3: var(--gray-8); /* 53% */
--text-dim: var(--gray-6); /* 63% */
@ -303,15 +303,15 @@
--link-hover-underline: color-mix(in oklch, var(--blue-8) 55%, transparent);
--link-focus: color-mix(in oklch, var(--blue-8) 35%, transparent);
--h1-color: var(--gray-15);
--h2-color: var(--gray-14);
--h3-color: var(--gray-13);
--h1-color: var(--gray-12);
--h2-color: var(--gray-11);
--h3-color: var(--gray-10);
--h4-color: var(--gray-12);
--h5-color: var(--gray-11);
--h6-color: var(--gray-10);
--mark-bg: color-mix(in oklch, var(--yellow-6) 15%, var(--surface));
--mark-color: var(--gray-15);
--mark-color: var(--gray-12);
--selection: color-mix(in oklch, var(--blue-8) 20%, transparent);
--code-color: var(--text-3);