Stu Mason
Stu Mason

Activity

Pull Request Merged

PR #122 merged: feat(ux): phase 9 — shared chrome + landing on tokens

Scope

After 7 phases of reports-only token work, the dashboard at / and the duplicated inline headers on every /reports* page still used raw text-zinc-100 / text-emerald-400 / hardcoded mono treatments. Stu (rightly) flagged that as a glaring scope miss: "UX overhaul" implied site-wide. Phase 9 extends the system to the shared chrome and the landing hero.

What's in

New

  • components/layout/site-header.tsx — single sticky top nav. Wordmark + <SmartLink variant="nav"> items. Active page rendered as plain accent-brand span (with aria-current="page") instead of a link, so users see where they are.
  • components/layout/site-footer.tsx — matching bottom chrome with summary + meta slots.

Migrated to tokens

  • pages/dashboard.tsx — inline 22-line header + 15-line footer replaced with <SiteHeader> / <SiteFooter>. Wrapper class swapped to bg-page text-default.
  • pages/reports/index.tsx + pages/reports/show.tsx — same inline-header swap. The current-page indicator (previously hand-rolled span) is now SiteHeader's active prop.
  • components/dashboard/landing-hero.tsx — eyebrow, headline, lede, CTAs and the 4-cell stat rail rebuilt against tokens. Headline now uses text-display, CTAs use text-overline + bg-success-bg / border-default, stat values use text-mono text-strong / text-warning-fg for the amber accent.
  • components/dashboard/landing-showcase.tsx — section header swapped to text-overline / text-h1 / italic text-accent-brand.

Out of scope (deliberately)

  • briefing-strip and the 6 dashboard-tabs files in the "Live ops" section below the showcase. They still use the multi-colour emerald/cyan/violet/amber stat treatment + shadcn-flavoured tabs. Touching all of that would be Phase 10 — too much for one PR.

Verified locally with Playwright

  • / — hero in Instrument Serif display, accent-brand emerald italic, mono stat rail with amber warning fg on pipeline-health
  • /reports — same SiteHeader chrome, REPORTS now correctly highlighted as active page
  • Tests: 188 pass + 2 pre-existing LinkedIn failures (unrelated)
  • Build clean

Screenshots: docs/ux-overhaul/screenshots/phase9-*.png

+183
additions
-118
deletions
11
files changed