P0-1 fix: ledger/u grade badges are token-derived — kill blue-B / amber-C / non-A glow
Phone audit found LEDGER READ CARDS rendering B badges with BLUE borders + C with AMBER right now in prod — GradePill (components/GradeCard.tsx) hardcoded the OLD palette (rgba(74,158,255) blue-B, rgba(255,179,71) amber-C) for bg/border while the text used the migrated token. Migrated bg/border to color-mix on the grade token, so B renders neutral-white and C grey (matching the board). - globals.css .grade-*-bg → token-derived color-mix (was raw blue/amber rgba). - DELETED glow from .grade-glow-b/c/d (glow is A-tier ONLY, by law) — B/C/D keep their token color, no text-shadow. - Purged the last dead grade-blue #4A9EFF fallbacks (SoccerGradeResult, the intelligence INFO dot). - REGRESSION LOCK: vyndrParityQA fails if #4a9eff / rgba(74,158,255) reappears anywhere in web/src, if GradePill hardcodes blue/amber rgba, or if grade-glow B/C/D grow a text-shadow again. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
+10
-7
@@ -374,10 +374,11 @@ h1, h2, h3, h4, h5, h6 {
|
||||
.grade-c-tier { color: var(--grade-c); }
|
||||
.grade-d-tier { color: var(--grade-d); }
|
||||
|
||||
.grade-a-bg { background: rgba(0, 200, 150, 0.10); border-color: rgba(0, 200, 150, 0.30); }
|
||||
.grade-b-bg { background: rgba(74, 158, 255, 0.10); border-color: rgba(74, 158, 255, 0.30); }
|
||||
.grade-c-bg { background: rgba(255, 179, 71, 0.10); border-color: rgba(255, 179, 71, 0.30); }
|
||||
.grade-d-bg { background: rgba(255, 107, 107, 0.10); border-color: rgba(255, 107, 107, 0.30); }
|
||||
/* P0-1 — token-derived (was hardcoded blue-B / amber-C old palette). */
|
||||
.grade-a-bg { background: color-mix(in srgb, var(--grade-a) 10%, transparent); border-color: color-mix(in srgb, var(--grade-a) 30%, transparent); }
|
||||
.grade-b-bg { background: color-mix(in srgb, var(--grade-b) 10%, transparent); border-color: color-mix(in srgb, var(--grade-b) 30%, transparent); }
|
||||
.grade-c-bg { background: color-mix(in srgb, var(--grade-c) 10%, transparent); border-color: color-mix(in srgb, var(--grade-c) 30%, transparent); }
|
||||
.grade-d-bg { background: color-mix(in srgb, var(--grade-d) 10%, transparent); border-color: color-mix(in srgb, var(--grade-d) 30%, transparent); }
|
||||
|
||||
/* ─────────────────────────────────────────────────────────
|
||||
Animations
|
||||
@@ -817,11 +818,13 @@ body.tex-grain::before {
|
||||
}
|
||||
|
||||
/* CRT phosphor glow utility for grade letters */
|
||||
/* GLOW = A-TIER ONLY (law). B/C/D glow classes DELETED (P0-1) — a glowing B/C/D
|
||||
devalues the cue. B/C/D letters take their token color with no text-shadow. */
|
||||
.grade-glow-aplus { color: var(--grade-aplus); text-shadow: 0 0 18px var(--grade-aplus), 0 0 36px rgba(0, 255, 184, 0.40); }
|
||||
.grade-glow-a { color: var(--grade-a); text-shadow: 0 0 14px rgba(0, 212, 160, 0.70), 0 0 30px rgba(0, 212, 160, 0.30); }
|
||||
.grade-glow-b { color: var(--grade-b); text-shadow: 0 0 12px rgba(74, 158, 255, 0.60), 0 0 24px rgba(74, 158, 255, 0.20); }
|
||||
.grade-glow-c { color: var(--grade-c); text-shadow: 0 0 12px rgba(255, 179, 71, 0.55); }
|
||||
.grade-glow-d { color: var(--grade-d); text-shadow: 0 0 12px rgba(255, 82, 82, 0.55); }
|
||||
.grade-glow-b { color: var(--grade-b); }
|
||||
.grade-glow-c { color: var(--grade-c); }
|
||||
.grade-glow-d { color: var(--grade-d); }
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after {
|
||||
|
||||
@@ -18,7 +18,7 @@ type Signal = {
|
||||
const SEVERITY: Record<Signal['severity'], { dot: string; label: string }> = {
|
||||
critical: { dot: '#FF4757', label: 'CRITICAL' },
|
||||
notable: { dot: '#FFB347', label: 'NOTABLE' },
|
||||
info: { dot: '#4A9EFF', label: 'INFO' },
|
||||
info: { dot: '#6C8CFF', label: 'INFO' },
|
||||
};
|
||||
|
||||
const SPORT_COLOR: Record<Signal['sport'], string> = {
|
||||
|
||||
Reference in New Issue
Block a user