fix(type-scale): tokenize mode-home hero sizes so check:type-scale --strict passes#512
Merged
Merged
Conversation
…strict passes The compact mode-home hero + action-card scale in mode-home-template.tsx used 8 arbitrary text-[…rem] font-size utilities, which fail scripts/check-type-scale.mjs --strict — the gate wired into verify:cheap. So verify:cheap was red on main at the check:type-scale step. Add size-only named @theme steps in globals.css (--text-xs-plus … --text-4xl-minus) at the exact rem values, and swap the arbitrary utilities for them. Pixel parity: the rendered hero is byte-for-byte unchanged. Also refresh the type-scale ratchet note in docs/process-hardening.md (now 0 hits / 0 files; strict gate already live in verify:cheap). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
|
This pull request has been ignored for the connected project Preview Branches by Supabase. |
Contributor
📝 WalkthroughWalkthroughUpdated the type-scale documentation and strict verification status, added named typography tokens in the theme, and applied the new responsive tokens to mode-home hero and action text. ChangesType-scale enforcement and mode-home typography
Estimated code review effort: 2 (Simple) | ~10 minutes Caution Pre-merge checks failedPlease resolve all errors before merging. Addressing warnings is optional.
❌ Failed checks (1 error)
✅ Passed checks (10 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
✨ Simplify code
Comment |
BigSimmo
enabled auto-merge (squash)
July 12, 2026 15:25
This was referenced Jul 12, 2026
BigSimmo
added a commit
that referenced
this pull request
Jul 12, 2026
* refactor(type-scale): drop dead mode-home tokens superseded by --text-hero PR #517's hybrid-fluid mode-home hero (fluid `--text-hero` clamp + `-minus` card tokens) replaced the only consumer of the stepped named-token set that #512 added for the same off-scale values. Those 7 tokens (--text-xs-plus, -sm-plus, -base-sub, -2xl-sub, -3xl-sub, -3xl-plus, -4xl-minus) are now unused everywhere in src, so remove them and their orphaned scale comment — reconciling the two parallel token sets left after the #517/#512 merge. Verify: prettier, check:type-scale --strict, check:icon-scale, lint, typecheck, and the globals.css merge-artifact guard test all green; the removed tokens have zero references in src (git grep). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> * docs: reconcile retired mode-home tokens --------- Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What & why
On
main,npm run verify:cheapis red at thecheck:type-scalestep (node scripts/check-type-scale.mjs --strict):src/components/mode-home-template.tsxcarries 8 arbitrarytext-[…rem]font-size utilities (the compact mode-home hero + action-card scale) that bypass the design type scale.This tokenizes them into size-only named
@themesteps insrc/app/globals.cssat the exact rem values and swaps the utilities to the named steps.text-[0.8rem]text-xs-plustext-[0.95rem]×2text-sm-plustext-[0.98rem]text-base-subtext-[1.45rem]text-2xl-subtext-[1.85rem]text-3xl-subtext-[1.9rem]text-3xl-plustext-[2.15rem]text-4xl-minusPixel parity: each named step equals the rem value it replaces and stays size-only (no baked line-height, matching the existing
--text-*-minusblock), so the rendered hero is byte-for-byte unchanged. This is a token-hygiene refactor, not a visual change.Naming follows the existing
-minus/-plusconvention (just below/above the nearest Tailwind anchor);-subdenotes a second "just under<anchor>" step where that anchor's-minusis already taken at a different size.Result
check:type-scale --strict→ 0 hits / 0 files (was 8 hits / 1 file);verify:cheapgreen at that step.docs/process-hardening.md(the recorded 20/9 baseline was stale).Verification
node scripts/check-type-scale.mjs --strict→ 0 hits, exit 0.prettier --checkclean on all three files.text-[<n>rem]remain insrc.@theme --text-*path as the existingtext-*-minussteps and is validated by CI's build/UI gates.Clinical governance preflight
N/A — no ingestion, answer generation, retrieval/ranking, source rendering, document access, privacy, production env, or clinical-output surface is touched. UI type-scale tokens only.
🤖 Generated with Claude Code