Mercurial
comparison design_system/src/styles/density.css @ 258:60a876c4587a
[ui] Add semantic primitive ownership
Build a layered Zenbu token and sizing system, make authored controls use native-underneath primitives, migrate mrjunejune without imposing visual surfaces, and document/enforce HTML ownership in the catalog and wiki.
Co-authored-by: Copilot <[email protected]>
| author | MrJuneJune <me@mrjunejune.com> |
|---|---|
| date | Wed, 05 Aug 2026 05:25:40 -0700 |
| parents | |
| children |
comparison
equal
deleted
inserted
replaced
| 257:609d3c6aff4e | 258:60a876c4587a |
|---|---|
| 1 :root, | |
| 2 :root[data-zen-density="comfortable"] { | |
| 3 --zenbu-sys-control-height-xs: var(--zenbu-ref-size-control-xs); | |
| 4 --zenbu-sys-control-height-sm: var(--zenbu-ref-size-control-sm); | |
| 5 --zenbu-sys-control-height-md: var(--zenbu-ref-size-control-md); | |
| 6 --zenbu-sys-control-height-lg: var(--zenbu-ref-size-control-lg); | |
| 7 --zenbu-sys-control-height-xl: var(--zenbu-ref-size-control-xl); | |
| 8 } | |
| 9 | |
| 10 :root[data-zen-density="compact"] { | |
| 11 --zenbu-sys-control-height-xs: 1.75rem; | |
| 12 --zenbu-sys-control-height-sm: 2rem; | |
| 13 --zenbu-sys-control-height-md: 2.25rem; | |
| 14 --zenbu-sys-control-height-lg: 2.75rem; | |
| 15 --zenbu-sys-control-height-xl: 3.25rem; | |
| 16 --zenbu-sys-control-padding-block-xs: var(--zenbu-ref-space-0-5); | |
| 17 --zenbu-sys-control-padding-block-sm: var(--zenbu-ref-space-1); | |
| 18 --zenbu-sys-control-padding-block-md: var(--zenbu-ref-space-1-5); | |
| 19 --zenbu-sys-control-padding-block-lg: var(--zenbu-ref-space-2); | |
| 20 --zenbu-sys-control-padding-block-xl: var(--zenbu-ref-space-3); | |
| 21 --zenbu-sys-control-padding-inline-xs: var(--zenbu-ref-space-2); | |
| 22 --zenbu-sys-control-padding-inline-sm: var(--zenbu-ref-space-2-5); | |
| 23 --zenbu-sys-control-padding-inline-md: var(--zenbu-ref-space-3); | |
| 24 --zenbu-sys-control-padding-inline-lg: var(--zenbu-ref-space-4); | |
| 25 --zenbu-sys-control-padding-inline-xl: var(--zenbu-ref-space-5); | |
| 26 --zenbu-sys-control-gap-xs: var(--zenbu-ref-space-0-5); | |
| 27 --zenbu-sys-control-gap-sm: var(--zenbu-ref-space-1); | |
| 28 --zenbu-sys-control-gap-md: var(--zenbu-ref-space-1-5); | |
| 29 --zenbu-sys-control-gap-lg: var(--zenbu-ref-space-2); | |
| 30 --zenbu-sys-control-gap-xl: var(--zenbu-ref-space-3); | |
| 31 } |