From dd9854bfd7bf6306ce90ef02d973f861a962d0d3 Mon Sep 17 00:00:00 2001 From: Tam Nhu Tran Date: Sat, 25 Apr 2026 18:55:47 -0400 Subject: [PATCH] docs(ui): sync design system docs with bespoke health redesign MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit After the v1.1 restructure, health was further redesigned per a separate brief and went bespoke -- new components (HealthStatusRibbon, HealthPriorityCard, HealthPriorityList, HealthAuditSection), no PageShell/PageHeader/MonitorLayout, custom severity-driven hierarchy. Bring the docs in line: - design-system.md: add §1d Bespoke as a fourth identity-strip pattern with health as canonical reference; remove health from PageHeader and Monitor canonical-reference slots (now TBD) - design-decisions.md: v1.2 revision row capturing the redesign and the resulting doc cleanup - screenshots-phase2/after-03-health.png: replace stale Monitor-archetype screenshot with the actual final redesigned page (Privacy mode ON) - design-system-phase2-preview.html: regenerate; describe the four patterns, embed the new screenshot, update the file change list --- ui/docs/design-decisions.md | 18 +++++ ui/docs/design-system-phase2-preview.html | 64 ++++++++++-------- ui/docs/design-system.md | 20 +++++- .../screenshots-phase2/after-03-health.png | Bin 106407 -> 137546 bytes 4 files changed, 71 insertions(+), 31 deletions(-) diff --git a/ui/docs/design-decisions.md b/ui/docs/design-decisions.md index 605568b0..639c2e65 100644 --- a/ui/docs/design-decisions.md +++ b/ui/docs/design-decisions.md @@ -34,6 +34,24 @@ Phase 2's home + cliproxy migrations are reverted. Health stays migrated (Monito --- +## v1.2 revision (2026-04-25) — health redesign and bespoke pattern + +After the v1.1 restructure, the `health` page received a separate, focused redesign per a dedicated handoff brief (`plans/reports/handoff-260425-1417-health-page-redesign.md`). The redesign went bespoke: + +- New domain components: `HealthStatusRibbon`, `HealthPriorityCard`, `HealthPriorityList`, `HealthAuditSection` +- Severity-driven layout: priority surfaces (errors/warnings) at the top with prominent fix affordances, audit accordion below +- Dynamic colored background tied to overall status, glassmorphic accents +- No `PageShell`, no `PageHeader`, no `MonitorLayout` — full custom shell + +**Resolution:** add a fourth identity-strip pattern — **§1d Bespoke** — for pages whose content shape doesn't fit the three primary patterns. The v1.1 row's claim that "health stays migrated (Monitor archetype + PageHeader works there)" no longer holds; corrected here. + +**Side effects:** +- `PageHeader` lost its canonical reference (was health). New reference TBD when another page adopts it. +- `MonitorLayout` lost its canonical reference. Primitives remain available for future Monitor pages. +- `Bespoke` is explicitly an escape hatch — not a default. Code review enforces "you tried the three patterns first." + +--- + ## How to revisit If a decision turns out wrong in practice, update this doc and bump the affected primitive — don't silently drift. Each row above should be appended with a "Revised: · " line if changed. diff --git a/ui/docs/design-system-phase2-preview.html b/ui/docs/design-system-phase2-preview.html index 76107c7a..3f70a0c9 100644 --- a/ui/docs/design-system-phase2-preview.html +++ b/ui/docs/design-system-phase2-preview.html @@ -1,6 +1,6 @@ -CCS Dashboard Design System — Phase 2 (revised) +CCS Dashboard Design System — Phase 2 (final)