Add type scale tokens, replace arbitrary font sizes
An h3 was 17px against a 15px body — 1.13× — so it carried a whole level of hierarchy on weight alone and read as a bold paragraph. Below about 1.15 the eye takes the weight change as the entire signal and stops looking for a size change, and the extra pixels buy nothing. The document range is now 15 / 18 / 22 / 28, and a test holds the ratio. Rail text drops to 13px, under the document's 15. A rail set at the document's size competes with it. Eighteen call sites named a size the theme had never heard of, in four spellings across three actual sizes — `text-[10px]` and `text-[0.625rem]` being the same size written two ways. All of them are one named step now, and a test fails on the next arbitrary size to appear. Nothing shrank: the 8px badges went up. Line heights are declared beside each size, because Tailwind computes its own against its own sizes and would otherwise have paired new type with the old rhythm. `--text-*: initial` first, so a rung we do not declare stops resolving to Tailwind's — ours stopped at `2xl`/28px and its untouched `3xl` is 30px, two pixels apart, in a change about steps being far enough apart to read as steps. The document reads `--plan-body` rather than `--text-base` directly. MDXEditor declares `--text-base: 1rem` on its own root, which sits between `:root` and the prose, so reading the theme token inside the editor returns its value and not ours — the body would have gone to 16px while the scale said 15. `.plan` is outside that root, so it catches the theme's value on the way past and passes it down under a name nothing else claims. Measured in a browser: 16px before, 15px after. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Parent9ec68f2
9 files changed+63-29
StackedSplit