Repository navigation
refactor(ui): unify type scale and shell density - #201
Merged
Merged
Conversation
- Add a token-driven type scale in index.css (--font-size-caption/dense/ body/form/title/page-title = 11/12/13/14/16/20px) and map the two missing sizes as text-caption / text-body in uno.config.ts - Replace every bare px/rem font-size in components with scale tokens (136 declarations across 52 files) and collapse text-[8/9/10/11px] into text-caption, removing sub-11px state text - Fix base components: CardTitle 24px -> 16px, dialog/alert titles 18px -> 16px, button size variants now xs=24px / sm=28px / default 32px / lg=36px with matching icon-sm / icon-xs - Compact the shell: navigation rail 64 -> 56px with 36x36 entries, object tree text 14 -> 12px on uniform 24px rows, connection selector rows at 13px, status dots unified (8px inline / 10px standalone), vendor logos fixed to 14/16/20px - Unify workspace chrome: grid toolbar fixed at 36px like the result toolbar, dropdown menu icons on the shared 16px size, JSON row action raised to a 24px target - AI / transfer surfaces mapped onto the scale with an ordered markdown heading hierarchy (20/16/14/13/12/11px) - Document the scale, icon scale, and density rules in DESIGN.md
Sidebar trees and query tabs are reading-distance surfaces, not data-density surfaces: mainstream desktop clients put sidebar trees at 13-14px text on ~28px rows and tab labels at 13px+. Object tree rows, the tree search input, and query tab labels move from text-xs (12px) to text-body (13px), which puts tree rows at 28px (20px line + 8px padding). Empty-state hints and grid/toolbars stay on the 12px dense tier; DESIGN.md scale-usage and layout tables updated.
Blankll
force-pushed
the
refactor/ui-density-tokens
branch
from
November 2, 2026 13:51
485fdbb to
1f92b3d
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Full implementation of the UI density / typography consistency review: a single token-driven type scale replaces the 20+ ad-hoc font sizes, and the shell is re-densified so navigation and lists stop competing with data surfaces.
Type scale (token-driven)
index.cssdefines--font-size-caption / dense / body / form / title / page-title= 11 / 12 / 13 / 14 / 16 / 20px;uno.config.tsmaps the two sizes missing from the default scale (text-caption,text-body); the rest reusetext-xs / sm / base / xl.font-sizein components is replaced by scale tokens (136 declarations across 52 files, incl. the whole AI panel with its 8.5–13.5px fractional sizes);text-[8/9/10/11px]collapses intotext-caption, removing sub-11px state text.Base components
CardTitle24px → 16px; dialog / alert titles 18px → 16px.xs24px,sm28px (was identical to default),icon-sm/icon-xsvariants — removes the need for per-componenth-6/h-7overrides.Shell density
Docs
Test plan
npm run lint:checkcleannpm run buildpasses (text-caption / text-body verified in emitted CSS)npm test— 855 tests pass (61 suites)