mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-09 21:10:59 +00:00
Pure presentational <HealthScoreCard> for the right-side hero panel. Surfaces the composite 0..100 score with a band-coloured number, a band-tinted progress bar, four sub-component rows (BP / Weight / Mood / Compliance) with their individual scores, a "vs last week" delta line with arrow + chip, the "Indicative — not a clinical assessment" disclaimer, and an "Ask the Coach" button that pre-fills the drawer with "Why is my health score X out of 100?". Layout: 220 px wide on desktop, full-width on mobile so it stacks below the hero title block on `<lg`. Dracula band tokens (`--dracula-green/orange/red`) carry WCAG AA contrast against `bg-card/65`. Tests: 17 SSR cases covering each band, delta-arrow shapes, the null-component em-dash fallback, the German locale, the score-aware prefill argument format, the progressbar role + ARIA values, and the score-clamp at 0..100 % bar width. i18n keys land under `insights.healthScore.*` in en.json + de.json. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>