Skip to content

web: v2 typography - token scale, 6 sizes - #23

Merged
dlgrv merged 9 commits into
mainfrom
web/v2-typo-tokens
Sep 21, 2026
Merged

dlgrv merged 9 commits into
mainfrom
web/v2-typo-tokens

Conversation

@dlgrv

@dlgrv dlgrv commented Sep 20, 2026

Copy link
Copy Markdown
Owner
  • :root tokens --fs-0..5 (12/13/17.5/21/26/38px); all 38 font decls
    now reference tokens, zero naked px sizes in v2.css
  • was 18 ad-hoc sizes (10..36px), incl 11 steps inside a card
  • content unified: values/quotes/sources/marginalia all --fs-2 17.5px
    (readable vs 14.5-16px mix), h3 19->21, h2 24->26, h1 36->38
  • button/input/kbd/summary get --fs-1 (was browser default 13.33px)
  • includes rows-label fix from web: row labels on one line (СТОИМОСТЬ fix) #22 (96px + nowrap) - this branch
    predates that merge
  • verified: exactly 6 sizes on ru/en/zh @1440/1024, 5 on mobile
    (h1 fold), 0 wrapped labels, Georgia only

- :root tokens --fs-0..5 (12/13/17.5/21/26/38px); all 38 font decls
  now reference tokens, zero naked px sizes in v2.css
- was 18 ad-hoc sizes (10..36px), incl 11 steps inside a card
- content unified: values/quotes/sources/marginalia all --fs-2 17.5px
  (readable vs 14.5-16px mix), h3 19->21, h2 24->26, h1 36->38
- button/input/kbd/summary get --fs-1 (was browser default 13.33px)
- includes rows-label fix from #22 (96px + nowrap) - this branch
  predates that merge
- verified: exactly 6 sizes on ru/en/zh @1440/1024, 5 on mobile
  (h1 fold), 0 wrapped labels, Georgia only
- sec-block/status/empty/foot/doc: margin auto -> 0
- column now starts 80px after sidebar on any width (was centered,
  up to ~450px dead air per side at 1920); all whitespace moves to
  the right margin where marginalia live
- nav search stays centered (user decision), mobile behavior unchanged
- verified @1440+@1920: secLeft=footLeft=344, 6 font sizes intact
- .rows/.badges/.src margin-left 40px -> 0: labels Стоимость/Эффект
  now align with the card's left edge (in the number margin, Tufte-style)
- values keep their column; user request
- .rows: one column; label (Стоимость/Эффект) renders as micro-caption
  with hairline rule, value below - user request
- .human/.src .body: padding-left 16/14px -> 0, border kept - all text
  blocks share one left axis (verified: h3=40 [number margin], rest=0)
- .src .body ul padding-left 16px for list markers
… label

- all 12 text-decoration rules removed; links distinguish by --hover
  color, active chips/section links by weight, abbr gets explicit none
  (browser default underlines was leaking)
- .human/.src .body: border-left removed (text was glued to the bar
  after padding removal - user caught it)
- label hairline moved ::after -> ::before: rule now OPENS the section
  (line, then label, then value) instead of cutting between label and
  value
- verified ru/en/zh: 0 underlined elements, 6 sizes intact
- card border-top removed (x528): cards breathe by padding 26->34px
- label section hairline (::before) removed - caption alone marks section
- hint/foot border-top removed
- kept: nav bottom + sidebar right (fixed chrome vs scrolling content),
  button borders (affordance)
- verified: 0 divider lines in .content, 6 sizes intact
- text-transform:uppercase removed from .gt (sidebar captions),
  .rows .k (Стоимость/Эффект), .marg .k - per user request and
  research (HBS identity: sentence case; Harvard DAS accessibility:
  all-caps hard to read; Web Style Guide: caps break word-shape
  scanning); labels differentiated by size/weight/color only
- letter-spacing tracking removed with the caps
- verified ru/en/zh: 0 uppercase-transformed elements, one family,
  6 sizes
…over)

Audit found 3 majors, all fixed:
- --faint light #8e8e8e -> #6f6f6f: 3.28:1 -> 5.02:1 (WCAG AA pass;
  5553 nodes of 12px gray labels/badges failed before)
- --hover light #2481cc -> #1a6aa8: 4.13:1 -> 5.72:1 (1623 link nodes
  failed AA); new --hover-2 #135a8c 7.32:1 as hover state - accent
  links previously had NO hover feedback at all
- line measure: .sec-block/.doc max-width 760/750px -> 64ch
  (median CPL 75, max 86 -> measured 59; ultrawide .doc 900px/95CPL
  expansion removed)

Also:
- zh: CJK serif fallbacks (Noto Serif SC / Source Han Serif SC) in
  --serif/--sans - CJK glyphs previously fell back to system sans
  while latin/cyrillic stayed serif
- verified after rebuild: 6 sizes, one family (ru/en/zh), hover works
- hanging card numbers declared canon: comment in v2.css documents
  one content axis + hanging idx margin (Tufte), not a defect
- search '/' hint now uses --mono (single mono glyph for a key hint,
  standard pattern) - --mono no longer a dead token
- mobile 390px: sidebar filter tap targets 29.5 -> 40px (sec-link,
  chip padding 5 -> 10px); at <=560 logo mark returns to header
  (text title stays hidden), README icon hidden, icon buttons 32px:
  search field 84 -> 132px wide
- verified: taps 40px, logo visible, no h-scroll at 390, kbd=mono,
  6 sizes intact on desktop
@dlgrv
dlgrv merged commit d7a1263 into main Sep 21, 2026
@dlgrv
dlgrv deleted the web/v2-typo-tokens branch September 21, 2026 09:33
dlgrv added a commit that referenced this pull request Sep 21, 2026
Co-authored-by: dlgrv <dlgrv@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant