anti/DECNET
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(decnet_web/css): promote hardcoded matrix/warn/crit colours to tokens

Browse Source 
37 bare rgba(0, 255, 65, ...) literals across 10 component CSS
files were forcing matrix-green to bleed into light mode no matter
what data-theme=light overrode in :root. They're now mapped onto
existing tokens by alpha bucket (0.025-0.05 -> --matrix-tint-5,
0.08-0.10 -> --matrix-tint-10, 0.18-0.30 -> --matrix-tint-30,
0.4 -> --fg-4, 0.5-0.6 -> --fg-3, 0.7-0.8 -> --fg-2).

Adds --warn (#e0a040), --amber (alias of --warn), --crit
(#e74c3c), and their tint-10 variants to :root, with
ink-friendly light-mode overrides. Sweeps bare #ffaa00 / #e0a040
/ #f59e0b / #ff4d4d / #e74c3c usages in the same files onto the
new tokens.

Files with var(--token, #fallback) patterns left alone — those
were already token-driven and the fallbacks just provide safety.
Login.css and inline TSX hex left for the per-page sweep.
This commit is contained in:
anti
2026-05-09 03:36:04 -04:00
parent df0c8e12e7
commit 34c778277a
13 changed files with 56 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
decnet_web/src/components/MazeNET/MazeNET.css
View File

@@ -180,11 +180,11 @@ body.maze-fullscreen .maze-shell {
.maze-net-box.deployed {
border-style: solid;
border-color: var(--matrix);
background: rgba(0, 255, 65, 0.05);
box-shadow: 0 0 0 1px rgba(0, 255, 65, 0.25) inset, var(--matrix-glow);
background: var(--matrix-tint-5);
box-shadow: 0 0 0 1px var(--matrix-tint-30) inset, var(--matrix-glow);
}
.maze-net-box.deployed .maze-net-box-head {
color: var(--matrix); border-bottom-color: rgba(0, 255, 65, 0.45);
color: var(--matrix); border-bottom-color: var(--fg-3);
}
.maze-net-box.deployed.dmz {
border-color: var(--alert);
@@ -266,7 +266,7 @@ body.maze-fullscreen .maze-shell {
.maze-node.deployed {
border-color: var(--matrix);
box-shadow: var(--matrix-glow);
background: rgba(0, 255, 65, 0.04);
background: var(--matrix-tint-5);
}
.maze-node.deployed .mn-head { color: var(--matrix); }
.maze-node.deployed.dmz-gateway {
@@ -543,7 +543,7 @@ body.maze-fullscreen .maze-shell {
.chip.violet { border-color: var(--violet); color: var(--violet); background: var(--violet-tint-10); }
.chip.matrix { border-color: var(--matrix); color: var(--matrix); background: var(--matrix-tint-10); }
.chip.alert { border-color: var(--alert); color: var(--alert); background: var(--alert-tint-10); }
.chip.dim-chip { border-color: var(--border); color: rgba(0, 255, 65, 0.6); background: transparent; }
.chip.dim-chip { border-color: var(--border); color: var(--fg-3); background: transparent; }
.chip-mini {
font-size: 0.55rem;