codify UI spacing constants (T-86)
Adds lib/widgets/src/spacing.dart with three categories of named constants — insets (clideInsetHairline / Tight / Icon / Standard / Text), gaps (clideGapTight / Standard / Section / SectionLarge / Major / Column), and sizes (clideIconMicro / Caption / Standard / HitTarget / Emphatic, clideControlHeight). Migrates MultitabPane to consume the constants and updates the ui-design geometry reference to point at them. Inline pixel literals in widget code were drifting (12 here, 6 there, 28 elsewhere) — pulling them through named symbols makes the "uniform inner spacing" rule enforceable instead of eyeballed. Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -4,11 +4,22 @@ Principles for placing icons, buttons, and text inside controls.
|
||||
Apply when building tab strips, list items, buttons with affordances,
|
||||
or anything where actions sit next to content.
|
||||
|
||||
> Numeric values in this doc will move to `ClideSpacing` constants
|
||||
> (`lib/widgets/src/spacing.dart`) — see T-86. Until then, the
|
||||
> constants used in the codebase: `12` (text inset), `6` (icon
|
||||
> breathing), `8` (standard gap), `4` (tight gap), `16` (icon hit
|
||||
> area), `28` (button / row height).
|
||||
> Constants live in `lib/widgets/src/spacing.dart` — pull from there
|
||||
> instead of inlining literals:
|
||||
>
|
||||
> | Concept | Constant |
|
||||
> |-------------------------|-------------------------|
|
||||
> | Hairline (2px) | `clideInsetHairline` |
|
||||
> | Tight inset (4px) | `clideInsetTight` |
|
||||
> | Uniform icon margin (6) | `clideInsetIcon` |
|
||||
> | Standard inset (8px) | `clideInsetStandard` |
|
||||
> | Text-content inset (12) | `clideInsetText` |
|
||||
> | Tight / standard gap | `clideGapTight` / `clideGapStandard` |
|
||||
> | Section / major gap | `clideGapSection` / `clideGapMajor` |
|
||||
> | Micro icon (10) | `clideIconMicro` |
|
||||
> | Standard icon (14) | `clideIconStandard` |
|
||||
> | Hit-target (16) | `clideIconHitTarget` |
|
||||
> | Control height (28) | `clideControlHeight` |
|
||||
|
||||
## Uniform inner spacing rule
|
||||
|
||||
|
||||
Reference in New Issue
Block a user