Mike 2.1 design token system replaces the upstream Tailwind theme

hosman20 defines a bespoke "warm paper + ink" token family in `globals.css` and rebuilds four shadcn primitives against it. This is the foundation everything else in Phase 1 sits on.

brandingchat-ui

Commit 3da5dd9 adds two reference docs before touching any code: docs/mike-2.1-design-tokens.md and docs/mike-2.0-frontend-inventory.md, ~700 lines total. The token spec defines three families: an unprefixed Mike 2.1 production set, B:* (a nitro reference), and F:* (shadcn reference). The prefixed families are kept for traceability - they're not used directly in components.

Commit 7b4dcce applies it. frontend/src/app/globals.css is rewritten at the @theme inline block, ~335 lines changed. Four shadcn primitives - Button, Input, Badge, Dropdown - are rebuilt against the new tokens. The primary Button variant becomes an ink-pill shape using --color-ink. Input borders switch from gray-200 to border-border.

Two things are deliberately preserved from the upstream. The font-eb-garamond next/font binding stays because the USC/CFR legal-document viewer CSS references it. The --color-blue/--color-azure tokens also remain.

The commit also adds the Vitest setup: vitest.config.ts, vitest.setup.ts, and the testing-library stack (@testing-library/react v16, jsdom@^29.1.1, @vitejs/plugin-react). Three smoke tests ship alongside the primitives.

So what Worth importing only if you're adopting the whole token system. The value is the foundation, not the four primitives in isolation. The migration is a wholesale `@theme` replacement - picking it up partially means re-mapping every consumer of the legacy theme variables. The Vitest config is small and reusable on its own without the rest.

Spotted something wrong? Or know the PR text has fresher detail than the writeup above?

Commits in this thread

2 commits from hosman20/mike-2.0, oldest first. Source extracted verbatim from the harvested git log.

SHA	Subject	Author	Date
`3da5dd95`	docs(mike-2.1): add design tokens and frontend inventory specs	z	2026-05-13	↗ GitHub
commit body Batch 0a + 0b - pre-implementation reference docs. - docs/mike-2.1-design-tokens.md: bespoke unprefixed token family (B:* nitro and F:* shadcn .pen kits are reference only, the unprefixed tokens are production). - docs/mike-2.0-frontend-inventory.md: catalog of existing primitives + auth pages + chrome shell that Phase 1 migrates. Agent IDs: a431cf5ab43329570 (tokens), ad8271abf2f042093 (inventory).
`7b4dccea`	feat(design): apply Mike 2.1 tokens and redesign 4 shadcn primitives	z	2026-05-13	↗ GitHub
commit body Batch 1 - replace globals.css @theme with bespoke Mike 2.1 token family, rebuild Button/Input/Badge/Dropdown against the new tokens, add vitest + 3 smoke tests. - frontend/src/app/globals.css: bespoke unprefixed tokens (production family). --color-blue/--color-azure preserved as faded blue for legacy .usc-section / .cfr-section CSS in legal-doc viewer. --font-eb-garamond next/font wiring kept for legacy .font-eb-garamond utility. - frontend/src/components/ui/{button,input,badge,dropdown-menu}.tsx: rebuilt against Mike 2.1 tokens. - frontend/vitest.config.ts + vitest.setup.ts: test runner config. - frontend/src/components/ui/__tests__/primitives.smoke.test.tsx: 3 smoke tests. All pass. Agent ID: a4c766b6e2d6a274e (general-purpose).

SHA

Subject

Author

Date

3da5dd95

docs(mike-2.1): add design tokens and frontend inventory specs

2026-05-13

↗ GitHub

commit body

Batch 0a + 0b - pre-implementation reference docs.

- docs/mike-2.1-design-tokens.md: bespoke unprefixed token family
  (B:* nitro and F:* shadcn .pen kits are reference only, the
  unprefixed tokens are production).
- docs/mike-2.0-frontend-inventory.md: catalog of existing primitives
  + auth pages + chrome shell that Phase 1 migrates.

Agent IDs: a431cf5ab43329570 (tokens), ad8271abf2f042093 (inventory).

7b4dccea

feat(design): apply Mike 2.1 tokens and redesign 4 shadcn primitives

2026-05-13

↗ GitHub

commit body

Batch 1 - replace globals.css @theme with bespoke Mike 2.1 token
family, rebuild Button/Input/Badge/Dropdown against the new tokens,
add vitest + 3 smoke tests.

- frontend/src/app/globals.css: bespoke unprefixed tokens (production
  family). --color-blue/--color-azure preserved as faded blue for
  legacy .usc-section / .cfr-section CSS in legal-doc viewer.
  --font-eb-garamond next/font wiring kept for legacy .font-eb-garamond
  utility.
- frontend/src/components/ui/{button,input,badge,dropdown-menu}.tsx:
  rebuilt against Mike 2.1 tokens.
- frontend/vitest.config.ts + vitest.setup.ts: test runner config.
- frontend/src/components/ui/__tests__/primitives.smoke.test.tsx:
  3 smoke tests. All pass.

Agent ID: a4c766b6e2d6a274e (general-purpose).

Capture this thread into my fork

Download a single Markdown prompt that tells Claude how to port every commit above into your working tree — adapting paths and structure to match your repo. Run it via claude -p < capture-thread-403.md from inside the repo you want the changes in.