From a0883bc269246f4ada1f276df3bf7a6402d72026 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= Date: Fri, 5 Jun 2026 12:33:00 +0200 Subject: [PATCH] insights: render the wellness score number in the foreground colour The centred score number painted off the band token (success/warning/ destructive), which cleared only ~1.5:1 against the dark wellness card and read as illegible. Switch the number to the foreground colour so it is legible on both the dark and the light card. The band semantic stays carried by the ring arc fill, the data-band attribute, and the aria-label, so the colour change costs no information. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/components/insights/derived/score-ring.tsx | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/src/components/insights/derived/score-ring.tsx b/src/components/insights/derived/score-ring.tsx index 0f75c40e7..ccd2e647c 100644 --- a/src/components/insights/derived/score-ring.tsx +++ b/src/components/insights/derived/score-ring.tsx @@ -12,7 +12,6 @@ import { cn } from "@/lib/utils"; import { useCountUp } from "@/hooks/use-count-up"; import { bandForScore, - BAND_NUMBER_CLASS, BAND_VAR, clampScore, type ScoreBand, @@ -156,12 +155,16 @@ export function ScoreRing({ className={cn( "font-semibold tabular-nums", dims.numberClass, - hasScore - ? BAND_NUMBER_CLASS[resolvedBand].replace( - "text-", - "fill-", - ) - : "fill-muted-foreground", + // v1.12.6 — the centred number reads in the + // foreground colour (white on the dark wellness + // card, near-black on the light card), never the + // band tint. The band-coloured number cleared only + // ~1.5:1 on `--card` and read as illegible. The + // band semantic is carried by the ring arc + // (`fill` = BAND_VAR) + the `data-band` attribute + + // the aria-label, so dropping it from the number + // costs no information while clearing AA. + hasScore ? "fill-foreground" : "fill-muted-foreground", )} > {hasScore ? displayedRounded : "—"}