sorokin.oleg.edu/learnharness
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 6 Wiki Activity

Typography round 4 (owner): the snap to the ladder — prose 16.5→16, xxs rung merged into xs

Browse Source 
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:
amosblomqvist
2026-09-17 13:43:26 +03:00
parent d01759ec32
commit 2a8554af27
9 changed files with 40 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/model-picker.tsx
+4 -4
View File
@@ -190,7 +190,7 @@ export function ModelControl({
className="flex items-center gap-1.5 rounded-full border border-border/60 bg-card/70 px-2.5 py-1 transition-colors hover:border-border hover:bg-muted"
>
<span className="text-card-foreground">{effectiveId ? prettyModel(effectiveId) : "—"}</span>
<span aria-hidden className="text-xxs text-muted-foreground">▾</span>
<span aria-hidden className="text-xs text-muted-foreground">▾</span>
</button>
<button
type="button"
@@ -208,7 +208,7 @@ export function ModelControl({
<span className="text-card-foreground">
{effectiveLevel === undefined ? "—" : (LEVEL_LABEL[effectiveLevel] ?? effectiveLevel)}
</span>
<span aria-hidden className="text-xxs text-muted-foreground">▾</span>
<span aria-hidden className="text-xs text-muted-foreground">▾</span>
</button>
{open === "model" && (
@@ -267,7 +267,7 @@ export function ModelControl({
</li>
))}
</ul>
<div className="mt-1 border-t px-2 pt-1.5 text-xxs text-muted-foreground">
<div className="mt-1 border-t px-2 pt-1.5 text-xs text-muted-foreground">
Applies to the next turn · background agents stay config-pinned
</div>
</div>
@@ -299,7 +299,7 @@ export function ModelControl({
</button>
))}
{error && <div className="mt-1 text-destructive">{error}</div>}
<div className="mt-1 border-t px-2 pt-1.5 text-xxs text-muted-foreground">
<div className="mt-1 border-t px-2 pt-1.5 text-xs text-muted-foreground">
Levels this model actually supports
</div>
</div>