fix(header): keep open Tiles and Split pressed in the boxed header styles

#538's Compact and Tiles header styles give every header icon button a box
through `html[data-header-stats] .header-right > .btn-icon-header` (0,3,1,
hover 0,4,1), which sets background, border and colour. That outranks the
open-state accent of #561's Tiles button (`.tiles-open`, 0,3,0) and of the
Split button (`.split-open`), hover included, so under the default Tiles
style an open grid or split looked exactly like a closed one and nothing
said the next click would close it.

The boxed styles now restate the pressed look for both buttons, hover
included (accent fill, accent border, accent ink), as comma-grouped
selectors built on the box rule's own selector so they always outrank it.
Classic is untouched and keeps the buttons' own rules.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Codeman maintainer
2026-10-08 21:36:04 +02:00
parent 42147d30c0
commit bd3c368512
2 changed files with 51 additions and 0 deletions
+16
View File
@@ -21354,6 +21354,22 @@ html[data-header-stats='compact'] .header-right > .btn-icon-header:hover {
transform: none;
}
/* An open grid or split keeps its pressed look in the box: the rules above
outrank the buttons' own accent (.tiles-open, .split-open), and that accent
is the only thing saying the next click closes the grid or the split. */
html[data-header-stats='tiles'] .header-right > .btn-icon-header.btn-tile-grid.tiles-open,
html[data-header-stats='tiles'] .header-right > .btn-icon-header.btn-tile-grid.tiles-open:hover,
html[data-header-stats='tiles'] .header-right > .btn-icon-header.btn-split.split-open,
html[data-header-stats='tiles'] .header-right > .btn-icon-header.btn-split.split-open:hover,
html[data-header-stats='compact'] .header-right > .btn-icon-header.btn-tile-grid.tiles-open,
html[data-header-stats='compact'] .header-right > .btn-icon-header.btn-tile-grid.tiles-open:hover,
html[data-header-stats='compact'] .header-right > .btn-icon-header.btn-split.split-open,
html[data-header-stats='compact'] .header-right > .btn-icon-header.btn-split.split-open:hover {
background: var(--accent);
border-color: var(--accent);
color: var(--accent-ink);
}
/* Before the first plan reading the chip holds a bare em dash; give it a tile
of its own so it does not read as a stray mark between the tiles. */
html[data-header-stats='tiles'] .header-plan-usage:not(:has(.pu-row)) {