Adopt remaining typography token classes (CR-24)

Map exact size/weight/line-height combos onto existing text-* utilities across cards, sections, navigation, modals, controls, and create-flow. Leave unmappable combos hardcoded for design review.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilallo
2026-08-17 11:40:10 -06:00
co-authored by Cursor
parent cb0adf2049
commit 2321a1e761
75 changed files with 229 additions and 252 deletions
@@ -6,7 +6,7 @@ import type { SelectionViewProps } from "./Selection.types";
function InfoIcon() {
return (
<span
className="flex h-[var(--spacing-scale-016)] w-[var(--spacing-scale-016)] shrink-0 items-center justify-center rounded-full border border-[var(--color-content-invert-brand-secondary)] bg-transparent font-inter text-[10px] font-medium leading-none text-[var(--color-content-invert-brand-secondary)]"
className="flex h-[var(--spacing-scale-016)] w-[var(--spacing-scale-016)] shrink-0 items-center justify-center rounded-full border border-[var(--color-content-invert-brand-secondary)] bg-transparent text-[10px] font-medium leading-none text-[var(--color-content-invert-brand-secondary)]"
aria-hidden
>
?
@@ -59,11 +59,11 @@ export function SelectionView({
onKeyDown={onKeyDown}
>
<SelectionTag recommended={recommended} selected={selected} />
<span className="w-full font-inter text-base font-medium leading-5 text-[var(--color-content-invert-secondary)]">
<span className="w-full text-medium-label text-[var(--color-content-invert-secondary)]">
{label}
</span>
{supportText ? (
<p className="w-full font-inter text-xs font-normal leading-4 text-[var(--color-content-invert-tertiary)]">
<p className="w-full text-x-small-paragraph text-[var(--color-content-invert-tertiary)]">
{supportText}
</p>
) : null}
@@ -85,13 +85,13 @@ export function SelectionView({
>
<div className="flex min-w-0 flex-1 flex-col gap-1">
<div className="flex items-center gap-1">
<span className="font-inter text-base font-medium leading-5 text-[var(--color-content-invert-secondary)]">
<span className="text-medium-label text-[var(--color-content-invert-secondary)]">
{label}
</span>
{showInfoIcon ? <InfoIcon /> : null}
</div>
{supportText ? (
<p className="font-inter text-xs font-normal leading-4 text-[var(--color-content-invert-tertiary)]">
<p className="text-x-small-paragraph text-[var(--color-content-invert-tertiary)]">
{supportText}
</p>
) : null}