From 0c80a8efb84328740bfd2fbfc6556b380ae70bbd Mon Sep 17 00:00:00 2001 From: dev Date: Thu, 20 Aug 2026 20:45:48 +0200 Subject: [PATCH] =?UTF-8?q?fix(date-range-picker):=20el=20overview=20hered?= =?UTF-8?q?a=20el=20velo,=20y=20su=20demo=20no=20lo=20ense=C3=B1a?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Firma 3, cuarto componente. Los cuatro nav del overview llevan `archetype: 'trigger'` y sus celdas `archetype: 'item'`: los dos reciben velo de `archetypes.css`. Y los dos lo tenían cancelado por la misma causa que el resto — `background: transparent` es el ATAJO y también fija `background-image: none`, con (0,1,0) contra el `:where()` (0,0,0). reglas base `background: transparent` → `background-color: transparent` reglas hover fuera las dos; el velo las sustituye contrato `hover-overview-nav-bg` y `hover-overview-cell-bg`, retiradas **La verificación aquí es más floja que en los tres anteriores, y conviene decirlo**: la demo monta UN picker sin `kind`, así que el overview de mes/año no se renderiza nunca y la sonda no puede medir el pintado (2 nodos vistos). El artefacto es la forma del CSS y el arquetipo leído del morfo, no un computed antes/después. El mecanismo sí está medido tres veces (checkbox, splitter, switch). Queda anotado un hueco de demo: `kind='month'` y `kind='year'` son la mitad de la API del picker (norma N-6) y la superficie de demo no los expone, así que esas partes no se pueden ver ni medir. La demo es el producto. audit PASS · censo 40 % · suite 434 (1 rojo conocido) · rtl 0 · docs 0 Nota aparte: las celdas conservan `background:` (atajo) en `[data-in-range]` y `[data-range-start/end]`. Son estado de rango con valencia, no hover neutro — fuera del alcance de esta firma, pero cancelan el velo igual. Co-Authored-By: Claude Opus 5 --- .../date-range-picker/date-range-picker.css | 22 +++++++++---------- src/uix/eidos/generated/base.css | 2 -- src/uix/eidos/lib/recipes/base.ts | 2 -- 3 files changed, 10 insertions(+), 16 deletions(-) diff --git a/src/uix/eidos/components/date-range-picker/date-range-picker.css b/src/uix/eidos/components/date-range-picker/date-range-picker.css index a4a6269be..eea5a975e 100644 --- a/src/uix/eidos/components/date-range-picker/date-range-picker.css +++ b/src/uix/eidos/components/date-range-picker/date-range-picker.css @@ -405,19 +405,18 @@ min-inline-size: var(--date-range-picker-overview-nav-size); border-radius: var(--date-range-picker-overview-nav-radius); border: var(--border-width) solid transparent; - background: transparent; + /* LONGHAND: even `background: transparent` resets `background-image`, and + * this rule (0,1,0) beats the `:where()` (0,0,0) of `archetypes.css` — the + * state-layer veil would never paint on these triggers. */ + background-color: transparent; color: var(--date-range-picker-overview-nav-fg); cursor: pointer; font: inherit; font-size: var(--date-range-picker-overview-nav-font-size); } -[data-date-range-picker-year-view-prev]:hover, -[data-date-range-picker-year-view-next]:hover, -[data-date-range-picker-month-view-prev]:hover, -[data-date-range-picker-month-view-next]:hover { - background: var(--date-range-picker-hover-overview-nav-bg); -} +/* The nav's neutral hover is the system's veil (§38): these parts carry + * `archetype: 'trigger'`. */ [data-date-range-picker-year-view-grid], [data-date-range-picker-month-view-grid] { @@ -431,7 +430,9 @@ min-block-size: var(--date-range-picker-overview-cell-height); border-radius: var(--date-range-picker-overview-cell-radius); border: var(--border-width) solid transparent; - background: transparent; + /* LONGHAND — same reason as the nav above: the shorthand would cancel the + * state-layer veil these `item` cells get for free. */ + background-color: transparent; color: var(--date-range-picker-overview-cell-fg); cursor: pointer; font: inherit; @@ -441,10 +442,7 @@ color var(--duration-fast) var(--ease-default); } -[data-date-range-picker-year-view-cell]:hover, -[data-date-range-picker-month-view-cell]:hover { - background: var(--date-range-picker-hover-overview-cell-bg); -} +/* The cells' neutral hover is the system's veil (§38): `archetype: 'item'`. */ /* Range stripe: in-range cells get a tinted background matching the * day-grid pattern (track scale, scale-3). Start and end cells overlay diff --git a/src/uix/eidos/generated/base.css b/src/uix/eidos/generated/base.css index 1a717ff02..0eb592df6 100644 --- a/src/uix/eidos/generated/base.css +++ b/src/uix/eidos/generated/base.css @@ -1668,13 +1668,11 @@ --date-range-picker-overview-nav-radius: var(--radius-md); --date-range-picker-overview-nav-fg: var(--color-content-primary); --date-range-picker-overview-nav-font-size: var(--size-md-font-size); - --date-range-picker-hover-overview-nav-bg: var(--color-surface-overlay); --date-range-picker-overview-grid-gap: var(--space-2); --date-range-picker-overview-cell-height: var(--size-md-control-height); --date-range-picker-overview-cell-radius: var(--radius-md); --date-range-picker-overview-cell-fg: var(--color-content-primary); --date-range-picker-overview-cell-font-size: var(--size-sm-font-size); - --date-range-picker-hover-overview-cell-bg: var(--color-surface-overlay); --date-range-picker-in-range-overview-cell-bg: var(--color-primary-track); --date-range-picker-in-range-overview-cell-fg: var(--color-primary-text); --date-range-picker-endpoint-overview-cell-bg: var(--color-primary-solid); diff --git a/src/uix/eidos/lib/recipes/base.ts b/src/uix/eidos/lib/recipes/base.ts index 7c9e3602c..4e55a8290 100644 --- a/src/uix/eidos/lib/recipes/base.ts +++ b/src/uix/eidos/lib/recipes/base.ts @@ -2004,13 +2004,11 @@ export const THEME_BASE_RECIPE_TOKENS = defineRecipes({ 'overview-nav-radius': 'var(--radius-md)', 'overview-nav-fg': 'var(--color-content-primary)', 'overview-nav-font-size': 'var(--size-md-font-size)', - 'hover-overview-nav-bg': 'var(--color-surface-overlay)', 'overview-grid-gap': 'var(--space-2)', 'overview-cell-height': 'var(--size-md-control-height)', 'overview-cell-radius': 'var(--radius-md)', 'overview-cell-fg': 'var(--color-content-primary)', 'overview-cell-font-size': 'var(--size-sm-font-size)', - 'hover-overview-cell-bg': 'var(--color-surface-overlay)', 'in-range-overview-cell-bg': 'var(--color-primary-track)', 'in-range-overview-cell-fg': 'var(--color-primary-text)', 'endpoint-overview-cell-bg': 'var(--color-primary-solid)',