Fix Whisker menu theming: #whiskermenu-window is a widget name

Whisker sets the popup's GTK widget name via gtk_widget_set_name(),
which CSS matches as #id, not .class. All prior .whisker-menu /
.whiskermenu-window rules matched nothing. Switch to #whiskermenu-window
(also outranks the base window.background gray rule). Whole popup —
list/icon views, search entry, category buttons — now uses @menu_bg.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
jon
2026-05-18 16:54:27 -05:00
parent eba1db0ece
commit f431baf413
@@ -302,38 +302,76 @@ tooltip.background label {
Row height = cell padding + the icon-size set in Whisker's own
settings, so trim padding here and keep icons small in Whisker. */
.whisker-menu {
/* Whisker sets the popup's GTK *widget name* (gtk_widget_set_name),
which CSS matches as #id — NOT a .class. The #id selector also
outranks the base `window.background` rule (headerbars.css). */
#whiskermenu-window {
background-color: @menu_bg;
color: @text_primary;
padding: 2px;
}
.whisker-menu .view,
.whisker-menu treeview.view {
#whiskermenu-window .view,
#whiskermenu-window treeview,
#whiskermenu-window treeview.view,
#whiskermenu-window iconview,
#whiskermenu-window scrolledwindow,
#whiskermenu-window viewport,
#whiskermenu-window stack,
#whiskermenu-window box {
background-color: @menu_bg;
color: @text_primary;
}
#whiskermenu-window treeview.view,
#whiskermenu-window iconview {
padding: 1px 4px;
-GtkTreeView-vertical-separator: 0;
}
.whisker-menu treeview.view:hover {
#whiskermenu-window treeview.view:hover,
#whiskermenu-window iconview:hover {
background-color: @hover_bg;
color: @text_primary;
}
.whisker-menu treeview.view:selected {
#whiskermenu-window treeview.view:selected,
#whiskermenu-window iconview:selected {
background-color: @active_bg;
color: @active_fg;
}
/* Search entry and the bottom command buttons */
.whisker-menu entry {
#whiskermenu-window entry {
margin: 2px;
background-color: @menu_bg;
border-color: @menu_border;
color: @text_primary;
}
.whisker-menu button {
#whiskermenu-window entry:focus {
border-color: @brand_green;
box-shadow: inset 0 0 0 1px @brand_green;
}
#whiskermenu-window button {
padding: 2px 6px;
min-height: 0;
background-color: transparent;
color: @text_primary;
}
.whisker-menu separator {
#whiskermenu-window button:hover {
background-color: @hover_bg;
}
#whiskermenu-window button:checked,
#whiskermenu-window button:active {
background-color: @active_bg;
color: @active_fg;
}
#whiskermenu-window separator {
margin: 2px 0;
}