Move Eidos wrapper font sizes to recipes

active-uix
dev 5 months ago
parent c939de90c8
commit 9c01c12402

@ -36,9 +36,23 @@ Actualizacion Eidos components audit 2026-05-17:
- `npx vitest run src/uix/eidos` -> 7 archivos, 79 tests OK.
- `npm run check` -> 0 errores, 0 warnings.
- Pendiente deliberado:
- Revisar tokens/recipes antes de cambiar `font-size: 0.9rem/0.85rem` en
`dialog.css` y `popover.css`; no se toco ahora para no mezclarlo con el
problema visual de tipografia observado en `/routes/uix`.
- Ninguno del bloque auditado. Los `font-size: 0.9rem/0.85rem` restantes
quedaron migrados despues de esta nota a tokens de recipe canónicos.
Actualizacion Eidos recipe typography 2026-05-17:
- Cerrado el ultimo hallazgo P3 de la auditoria de componentes:
- `dialog.css` ya no usa `font-size: 0.9rem`; consume
`--dialog-trigger-font-size`.
- `popover.css` ya no usa `font-size: 0.9rem` ni `0.85rem`; consume
`--popover-trigger-font-size` y `--popover-close-font-size`.
- Los nuevos tokens viven en `THEME_BASE_RECIPE_TOKENS` y se regenero
`src/uix/eidos/generated/base.css` con `npm run generate:eidos-css`.
- Validado:
- `npx vitest run src/uix/eidos/recipe-css-contract.test.ts src/uix/eidos/generated-css.test.ts`
-> 2 archivos, 4 tests OK.
- `npx vitest run src/uix/eidos` -> 7 archivos, 79 tests OK.
- `npm run check` -> 0 errores, 0 warnings.
Actualizacion Eidos config audit 2026-05-17:

@ -30,7 +30,7 @@
background: var(--color-surface-raised);
color: var(--color-content-primary);
font: inherit;
font-size: 0.9rem;
font-size: var(--dialog-trigger-font-size);
cursor: pointer;
transition:
background var(--duration-fast) var(--ease-default),

@ -14,7 +14,7 @@
background: var(--color-surface-raised);
color: var(--color-content-primary);
font: inherit;
font-size: 0.9rem;
font-size: var(--popover-trigger-font-size);
cursor: pointer;
transition:
background var(--duration-fast) var(--ease-default),
@ -48,8 +48,8 @@
* z-index unless the content provides one via `getComputedStyle().zIndex`,
* which only works for positioned elements. When modal=true, the overlay
* (z=60) would otherwise paint over the wrapper, hiding the panel and
* making it unclickable. Soma exposes a public floating wrapper marker for
* cross-layer styling, so Eidos does not depend on Soma internals here. */
* making it unclickable. Soma exposes a public floating wrapper marker for
* cross-layer styling, so Eidos does not depend on Soma internals here. */
[data-floating-wrapper]:has(> [data-popover-content]) {
z-index: var(--popover-content-z);
}
@ -227,7 +227,7 @@
color: var(--popover-close-color);
box-shadow: none;
font: inherit;
font-size: 0.85rem;
font-size: var(--popover-close-font-size);
cursor: pointer;
transition:
background var(--popover-transition-duration) var(--popover-transition-ease),

@ -471,6 +471,7 @@
--collapsible-transition-duration: var(--duration-normal);
--collapsible-transition-ease: var(--ease-default);
--collapsible-disabled-opacity: 0.5;
--dialog-trigger-font-size: var(--font-size-sm);
--dialog-overlay-bg: var(--color-overlay);
--dialog-overlay-opacity: 62%;
--dialog-overlay-blur: 10px;
@ -591,6 +592,7 @@
--icon-stroke-width: var(--icon-stroke-width-md);
--popover-content-z: 75;
--popover-overlay-z: 60;
--popover-trigger-font-size: var(--font-size-sm);
--popover-gap: var(--space-3);
--popover-max-width: 32rem;
--popover-min-width-sm: 14rem;
@ -618,6 +620,7 @@
--popover-transition-duration: var(--duration-fast);
--popover-transition-ease: var(--ease-default);
--popover-close-size: var(--control-height-xs);
--popover-close-font-size: var(--font-size-sm);
--popover-close-radius: var(--radius-md);
--popover-close-border-width: var(--border-width);
--popover-close-bg: transparent;

@ -208,6 +208,7 @@ export const THEME_BASE_RECIPE_TOKENS = {
'disabled-opacity': '0.5'
},
dialog: {
'trigger-font-size': 'var(--font-size-sm)',
'overlay-bg': 'var(--color-overlay)',
'overlay-opacity': '62%',
'overlay-blur': '10px',
@ -335,6 +336,7 @@ export const THEME_BASE_RECIPE_TOKENS = {
popover: {
'content-z': '75',
'overlay-z': '60',
'trigger-font-size': 'var(--font-size-sm)',
gap: 'var(--space-3)',
'max-width': '32rem',
'min-width-sm': '14rem',
@ -362,6 +364,7 @@ export const THEME_BASE_RECIPE_TOKENS = {
'transition-duration': 'var(--duration-fast)',
'transition-ease': 'var(--ease-default)',
'close-size': 'var(--control-height-xs)',
'close-font-size': 'var(--font-size-sm)',
'close-radius': 'var(--radius-md)',
'close-border-width': 'var(--border-width)',
'close-bg': 'transparent',

Loading…
Cancel
Save

Powered by TurnKey Linux.