frontend: unify pill/chip/badge shape into shared CSS
Per mara's steer on #3053 ("chip/pill/badge is the same if you squint ... theme unification is part of the goal ... make it common css instead of component, thats fine. but make them look unified"): shared CSS, not a JS component. New @hive/shared/pill.css defines the shape (border/border-radius/ padding/font-size/letter-spacing — color stays per-site, that's the meaningful semantic part) in two tiers matching what was already organically in use: `.hive-pill` (primary state chips) and `.hive-pill-sm` (secondary meta chips). Every pre-existing classname that drew its own copy of this shape (dashboard's `.badge` family, agent's `.status-badge`/`.state-badge`/`.header-pill`/`.ctx-badge`/ `.model-chip`/`.effort-chip`) is folded straight into the same selector groups, so no markup or JS changes were needed anywhere — every render call site keeps constructing the exact same classnames it always did. Most visible consequence: dashboard's `.badge` family moves from its own shape (2px square corners, uppercase, tighter padding) onto the shared rounded-pill shape + agent's "sm" tier sizing, matching the "look unified" ask directly. `npm run build` clean across all three packages.
This commit is contained in:
parent
ae05289e8b
commit
92b9e67327
4 changed files with 73 additions and 32 deletions
|
|
@ -16,6 +16,7 @@
|
|||
"./base.css": "./src/base.css",
|
||||
"./terminal.css": "./src/terminal/terminal.css",
|
||||
"./chrome.css": "./src/chrome.css",
|
||||
"./pill.css": "./src/pill.css",
|
||||
"./forms.js": "./src/forms.js",
|
||||
"./prefs.js": "./src/prefs.js",
|
||||
"./dom.js": "./src/dom.js",
|
||||
|
|
|
|||
Loading…
Reference in a new issue