mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-09 21:10:59 +00:00
refactor(ui): mint the text-2xs token and the neutral TagChip
Three integration cards carried the same hand-copied chip literal in the card-header accessory slot, each free to drift on the next touch; the size itself was an arbitrary value repeated at three slightly different spellings across the tree. - Mint `--text-2xs` (0.6875rem with a matched line-height) as the one sanctioned step below `text-xs`. - Mint `TagChip` and adopt it on the Fitbit, Google Health, and Nightscout cards. It stays distinct from `Badge`, which carries status meaning. - Sweep the arbitrary micro sizes: the stepper label and the two dose-ledger outline badges move onto the token; the muted target caption and the muted ledger meta row move up to the `text-xs` muted floor. No visible change beyond the two muted rows gaining a fraction of a pixel.
This commit is contained in:
1 parent
405bebf1a0
commit
933dfcfdfb
9 files changed
+90
-16
No files matched your search
@@ -71,6 +71,14 @@
|
||||
--color-popover: var(--popover);
|
||||
--color-card-foreground: var(--card-foreground);
|
||||
--color-card: var(--card);
|
||||
/* The one sanctioned step below `text-xs` (12px). Minted so badges,
|
||||
tag chips, and tabular-nums micro-labels stop hand-rolling
|
||||
`text-[0.6875rem]` / `text-[0.65rem]` arbitrary values that drift by a
|
||||
third of a pixel per site. UI-STANDARDS §5 pins the usage: never for
|
||||
muted body or meta text (the muted floor stays `text-xs`) — only for
|
||||
chips, badges, and tabular micro-labels with verified contrast. */
|
||||
--text-2xs: 0.6875rem;
|
||||
--text-2xs--line-height: 1rem;
|
||||
--radius-sm: calc(var(--radius) - 4px);
|
||||
--radius-md: calc(var(--radius) - 2px);
|
||||
--radius-lg: var(--radius);
|
||||
|
||||
Reference in new issue
Block a user