The last of the audit list: the type scale wins, the card headings get names, and the reveals reach the keyboard - #9
Merged
Conversation
… reach the reveals by keyboard **Ninety-four elements were arguing with the type scale.** Eighty-seven of them put `leading-relaxed` on `text-sm`, which is the site's body copy rung — so almost every 14px paragraph overrode the 1.55 the curve suggested. The overrides were right and the scale was wrong: 14px prose wants more air than a 14px table cell. `--text-sm--line-height` is 1.625 now and the ninety-four are gone. A scale every paragraph has to argue with is not a scale. The seven on `text-base` and non-mono `text-xs` go too — 1.6 against 1.625 says nothing. Two survive, both on mono code blocks, where the extra leading is a real choice about reading code rather than a leftover. **The card heading forked three-to-twenty-three with no rule.** There genuinely are two roles: a heading that titles a cell which *is* the point of that cell — the download panel, a pricing tier — and one that titles a single entry in a list of like things, where a larger size would make every item shout. Both are now named, `PANEL_TITLE` and `ITEM_TITLE`, next to `CELL_DENSITY` where the other cell decisions live. The inconsistency was never that two sizes existed; it was that nothing recorded which was which. **Eight hover reveals had no keyboard equivalent.** Every one sits inside a `group` that is a link, so a keyboard user tabbing to it saw nothing change: the database tile's arrow, three sponsor marks, the engine monogram, and both blog list headings. They pair with `group-focus-within` now. Two of those additions landed outside their `className` on first attempt — a regex that matched across quote boundaries — which typecheck caught in one file and a per-line check caught in the other. Verified after repair that all three sponsor marks kept the parity they were given.
**The copy control existed twice**, down to the same 1200ms timeout, the same two toast strings and the same cleanup effect — but with forked chrome, one having a visible boundary and one not. It is one component now, and the timeout cleanup lives with it rather than being re-remembered per host. **The closing CTA existed twice**, differing in one sentence and in whether its button row could hold a second control. The sentence was the OS requirement line — which is the one thing a reader actually checks before downloading, and the two pages disagreed about it. It now says the same thing on both, and says what every credible Mac app puts under its download button: the OS floor and the architectures. **The benchmarks grid left a border hanging.** Below sm its three cells stack and each draws `border-b`, so the third drew one immediately above the section's own rule — two lines at one height inside the container width. `last:border-b-0` closes it. The other four hand-rolled grids were checked and are correct: they put the border on the first of two cells, not on every cell, so there is nothing for a `last:` to undo. Also verified and deliberately left alone: `Container width="md"` on the four legal and download pages. That narrows the *text* to a readable measure, which is the right call for long prose, and it does not affect the rules — those bleed past the container by design.
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.
Everything left from the seven-lens consistency audit that was still real when
re-checked against the current tree.
Ninety-four elements were arguing with the type scale
Eighty-seven of them put
leading-relaxedontext-sm— the site's body copyrung — so almost every 14px paragraph overrode the 1.55 the metrics curve
suggested.
The overrides were right and the scale was wrong. 14px prose wants more air
than a 14px table cell.
--text-sm--line-heightis 1.625 now and allninety-four are gone. A scale that every paragraph has to argue with is not a
scale.
Measured before deciding: 103 of the
text-smsites are prose, 43 aresingle-line UI, where the difference between 1.55 and 1.625 does not render at
all. The seven on
text-baseand non-monotext-xsalso go, because 1.6against 1.625 says nothing. Two survive on mono code blocks, where the extra
leading is a real choice about reading code.
The card heading forked three-to-twenty-three with no rule
There genuinely are two roles: a heading that titles a cell which is the point
of that cell — the download panel, a pricing tier — and one that titles a single
entry in a list of like things, where a larger size would make every item shout.
Both are named now,
PANEL_TITLEandITEM_TITLE, sitting besideCELL_DENSITYwhere the other cell decisions live. The inconsistency was never that two sizes
existed; it was that nothing recorded which was which.
Eight hover reveals had no keyboard equivalent
Every one sits inside a
groupthat is a link, so a keyboard user tabbing to itsaw nothing change: the database tile's arrow, three sponsor marks, the engine
monogram, both blog list headings. They pair with
group-focus-withinnow.Two of those additions landed outside their
classNameon the first attempt —a regex matching across quote boundaries. Typecheck caught one, a per-line check
caught the other, and all three sponsor marks were re-verified to have kept the
parity after repair.
Duplication
The copy control existed twice, down to the same 1200ms timeout, the same
two toast strings and the same cleanup effect — with forked chrome, one having a
visible boundary and one not.
The closing CTA existed twice, differing in one sentence: the OS requirement
line, which is the one thing a reader checks before downloading, and the two
pages disagreed about it.
The benchmarks grid left a border hanging. Below sm its three cells stack and
each draws
border-b, so the third drew one immediately above the section's ownrule. The other four hand-rolled grids were checked and are correct — they put
the border on the first of two cells, not on every cell.
Checked and deliberately left
Container width="md"on four pages. It narrows the text to a readablemeasure, which is right for long prose, and does not affect the rules — those
bleed past the container by design.
CELL_DENSITYwritten as a literal at 25 sites. All twenty-five agree onthe same value, so this is a maintainability wart, not an inconsistency, and
converting twenty-five
className="…"strings to template literals is exactlythe mechanical churn that just put two class names outside their attribute.
Not worth the risk for zero visible change.
leading-relaxedon two mono code blocks. Deliberate.Verification
typecheck, build and pint clean. 107 tests / 1853 assertions with
REQUIRE_SSR=1. All nine page types re-rendered: one<main>, one<h1>andzero coincident rules on every one.