fix(design): default badge tone becomes ink blue, readable in light mode

The previous default tone (bg-muted text-muted-foreground) reads as
beige-on-beige in light mode — the "3" count on Work was barely
legible against the parchment sidebar.

Route default counts through bg-primary + text-primary-foreground so
the pill adopts kami's sole accent color. The three tones now fall
into a clean priority scale:

  default -> ink blue        (you have items)
  warn    -> warm amber      (needs attention)
  danger  -> warm terra red  (critical)

Contrast holds in both modes: ink-on-parchment in light (~9:1),
ink-light-on-dark-parchment in dark (~5:1). Warm amber and terra red
retain their own semantic foregrounds from the prior commit.

Typecheck and build:verify clean.
This commit is contained in:
ZacharyZhang-NY committed 2026-04-21 14:12:49 -04:00
1 parent dc6744bf71
commit f9b505569c
1 file changed
+1 -1
+1 -1
View File
@@ -4,7 +4,7 @@ export function Badge({ count, tone = "default" }: { count: number; tone?: "defa
? "bg-destructive text-destructive-foreground"
: tone === "warn"
? "bg-warning text-warning-foreground"
: "bg-muted text-muted-foreground";
: "bg-primary text-primary-foreground";
return (
<span className={`ml-auto inline-flex h-[18px] min-w-[18px] items-center justify-center rounded-full px-1.5 text-[10px] font-bold ${toneClass}`}>
{count > 99 ? "99+" : count}