diff --git a/src/uix/eidos/components/splitter/splitter.css b/src/uix/eidos/components/splitter/splitter.css index d3e7fa7b5..a4a1ec446 100644 --- a/src/uix/eidos/components/splitter/splitter.css +++ b/src/uix/eidos/components/splitter/splitter.css @@ -49,7 +49,10 @@ [data-splitter-resize-trigger] { position: relative; flex: 0 0 auto; - background: var(--splitter-handle-bg, var(--color-border-subtle)); + /* LONGHAND: `background:` resets `background-image`, and this rule (0,1,0) + * outweighs the `:where()` (0,0,0) of `archetypes.css` — the state-layer + * veil would never paint on the handle. */ + background-color: var(--splitter-handle-bg, var(--color-border-subtle)); transition: background var(--splitter-transition-duration, var(--duration-fast)) var(--splitter-transition-ease, var(--ease-default)); } @@ -64,10 +67,10 @@ cursor: row-resize; } -[data-splitter-resize-trigger]:hover, -[data-splitter-resize-trigger][data-state='hover'] { - background: var(--splitter-handle-bg-hover, var(--color-border-default)); -} +/* The neutral hover is the system's veil (§38): the handle carries + * `archetype: 'trigger'`, so `archetypes.css` paints it. The bespoke rule that + * used to live here declared its own colour and, being the shorthand, was also + * what kept the veil from ever painting. */ [data-splitter-resize-trigger]:focus-visible { outline: var(--focus-ring-width) solid var(--focus-ring-color);