Typography round 4 (owner): the snap to the ladder — prose 16.5→16, xxs rung merged into xs
The system: the ladder is the truth, everything snaps to it. - Prose snaps to the ladder's 16px rung (--lh-prose-size 16.5→16; the half-pixel was a reskin-era hand-tune with no visible payoff and a system cost). lh-prose, lh-input, and the session titles all read the one variable — one reading size, now a ladder citizen. @theme inline inlines literals without emitting runtime vars, so the variable can't var()-link to --text-lg: documented as the one deliberate duplication (change one, change both). - The 10px rung merges into 11px: one pixel apart was a distinction with no visible difference, and 10px sits at the mono legibility floor — quiet labels (Sessions, Background agents, dock hints, model-picker footers) get their quiet from color + tracking, not a notch of size. All 13 text-xxs uses → text-xs; --text-xxs token removed. - Derived constant follows: TEXT_CAP_SCALE 16.5/12.5 → 16/12.5 (1.32 → 1.28; test pin 232.32px → 225.28px) — the plan-graph text cap now tracks the snapped prose size. Live: title 16px, Sessions/Background-agents labels 11px, composer 16px with the 20px lh-input line box. Gates: typecheck, lint, 469/469. Lane note: components/graph-context-marker.tsx (graph-stream file) had a mechanical text-xxs → text-xs swap — required: the token removal otherwise leaves a dead class in their file.
This commit is contained in:
@@ -307,7 +307,7 @@ function QuestionDockForm({
|
||||
)}
|
||||
>
|
||||
{isSel && (
|
||||
<span className={cn(qd.mode === "multi-select" ? "text-xxs" : "size-1.5 rounded-full bg-current")}>
|
||||
<span className={cn(qd.mode === "multi-select" ? "text-xs" : "size-1.5 rounded-full bg-current")}>
|
||||
{qd.mode === "multi-select" ? "✓" : ""}
|
||||
</span>
|
||||
)}
|
||||
@@ -373,7 +373,7 @@ function QuestionDockForm({
|
||||
)}
|
||||
>
|
||||
{sel.otherSelected && (
|
||||
<span className={cn(qd.mode === "multi-select" ? "text-xxs" : "size-1.5 rounded-full bg-current")}>
|
||||
<span className={cn(qd.mode === "multi-select" ? "text-xs" : "size-1.5 rounded-full bg-current")}>
|
||||
{qd.mode === "multi-select" ? "✓" : ""}
|
||||
</span>
|
||||
)}
|
||||
@@ -412,7 +412,7 @@ function QuestionDockForm({
|
||||
data-testid={qd.mode === "text" ? "answer-field" : "thinking-field"}
|
||||
className="rounded-xl border border-border/70 bg-background/60 transition-colors focus-within:border-primary/50"
|
||||
>
|
||||
<div className="px-2.5 pt-2 text-xxs font-medium uppercase tracking-wide text-muted-foreground">
|
||||
<div className="px-2.5 pt-2 text-xs font-medium uppercase tracking-wide text-muted-foreground">
|
||||
{qd.mode === "text" ? "Your answer" : "Your thinking"}
|
||||
</div>
|
||||
{qd.mode === "text" ? (
|
||||
@@ -455,7 +455,7 @@ function QuestionDockForm({
|
||||
)}
|
||||
<div className="flex items-center justify-between gap-2 p-1">
|
||||
{qd.mode !== "text" && (
|
||||
<span aria-hidden className="pl-1.5 text-xxs text-muted-foreground">
|
||||
<span aria-hidden className="pl-1.5 text-xs text-muted-foreground">
|
||||
⌘/Ctrl + ↵ submits
|
||||
</span>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user