taffybar CSS: remove inline menu/popover styling

The narrowed :not(menu):not(menuitem):not(popover):not(window) selectors
now prevent bar styles from bleeding into popup menus, making the
explicit menu overrides unnecessary. Menus inherit clean styling from
the GTK theme instead.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-09 16:42:01 -08:00
committed by Kat Huang
parent ba952b4b57
commit 86fd99c588

View File

@@ -277,196 +277,6 @@
background-color: rgba(255, 255, 255, 0.06);
}
/* ── Menu styling ───────────────────────────────────────────────────────
Force a clean white-background / black-text look on all popup menus
(GtkMenu, DBusMenu, popovers) regardless of the active GTK theme.
The CSS provider runs at priority 900 (above USER = 800).
The .outer-pad background rule uses :not(menu):not(menuitem) to avoid
forcing transparency on popup menu containers. For color, we need
high-specificity overrides since labels inside menus still match :not(menu). */
/* --- Popup menu containers ---
.taffy-window menu (0,1,1) beats .taffy-window * (0,1,0) for background.
.outer-pad.sni-tray menu (0,2,1) beats .outer-pad.sni-tray * (0,2,0). */
menu,
.taffy-window menu,
.outer-pad menu {
background-color: #ffffff;
background-image: none;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 6px;
padding: 4px 0;
}
/* --- Menu items ---
High specificity to beat .outer-pad.sni-tray * color bleed (0,2,0). */
.outer-pad.sni-tray menu menuitem,
.outer-pad menu menuitem,
.taffy-window menu menuitem,
menu menuitem {
background-color: #ffffff;
background-image: none;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
padding: 4px 12px;
min-height: 20px;
}
/* Children: transparent bg so hover shows through; override color bleed.
Use :not(menu) to avoid forcing transparency on nested submenu containers. */
.outer-pad.sni-tray menu menuitem :not(menu),
.outer-pad menu menuitem :not(menu),
.taffy-window menu menuitem :not(menu),
menu menuitem :not(menu) {
background-color: transparent;
background-image: none;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
}
/* --- Hover --- */
.outer-pad.sni-tray menu menuitem:hover,
.outer-pad menu menuitem:hover,
menu menuitem:hover {
background-color: #4a90d9;
}
.outer-pad.sni-tray menu menuitem:hover :not(menu),
.outer-pad menu menuitem:hover :not(menu),
menu menuitem:hover :not(menu),
menu menuitem:hover {
color: #ffffff;
}
/* --- Separators --- */
menuitem separator {
background-color: transparent;
min-height: 1px;
margin: 4px 8px;
border-top: 1px solid rgba(0, 0, 0, 0.12);
}
/* --- Arrows & toggle indicators --- */
menuitem arrow {
background-color: transparent;
color: rgba(0, 0, 0, 0.4);
}
menuitem check, menuitem radio {
background-color: transparent;
color: #000000;
}
/* --- Background/decoration nodes in popup windows ---
Submenus are separate popup windows that may NOT be CSS descendants of
.taffy-window or .outer-pad. Cover every popup window layer. */
window.popup, window.popup.background,
window.menu, window.menu.background {
background-color: #ffffff;
background-image: none;
}
window.popup decoration, window.menu decoration {
background-color: #ffffff;
background-image: none;
}
/* Catch submenus that aren't CSS descendants of .taffy-window/.outer-pad.
Use .dbusmenu-submenu class (added by DBusMenu.hs) plus type selectors. */
/* Submenu rules need specificity > 0,2,0 to beat .outer-pad.sni-tray *
which bleeds tray colors into submenus via the CSS parent chain. */
.outer-pad .dbusmenu-submenu,
.dbusmenu-submenu {
background-color: #ffffff;
background-image: none;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 6px;
padding: 4px 0;
}
.outer-pad.sni-tray .dbusmenu-submenu menuitem,
.outer-pad .dbusmenu-submenu menuitem,
.dbusmenu-submenu menuitem {
background-color: #ffffff;
background-image: none;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
padding: 4px 12px;
min-height: 20px;
}
.outer-pad.sni-tray .dbusmenu-submenu menuitem *,
.outer-pad .dbusmenu-submenu menuitem *,
.dbusmenu-submenu menuitem * {
background-color: transparent;
background-image: none;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
}
.outer-pad.sni-tray .dbusmenu-submenu menuitem:hover,
.outer-pad .dbusmenu-submenu menuitem:hover,
.dbusmenu-submenu menuitem:hover {
background-color: #4a90d9;
}
.outer-pad.sni-tray .dbusmenu-submenu menuitem:hover *,
.outer-pad .dbusmenu-submenu menuitem:hover *,
.dbusmenu-submenu menuitem:hover *,
.outer-pad.sni-tray .dbusmenu-submenu menuitem:hover,
.dbusmenu-submenu menuitem:hover {
color: #ffffff;
}
/* --- Popovers (some SNI apps use these instead of GtkMenu) --- */
popover, popover.background, popover > contents {
background-color: #ffffff;
background-image: none;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 6px;
}
popover *, popover modelbutton, popover modelbutton * {
background-color: transparent;
color: #000000;
font-family: "Noto Sans", sans-serif;
font-size: 10pt;
font-weight: 400;
text-shadow: none;
}
popover modelbutton {
background-color: #ffffff;
padding: 4px 12px;
}
popover modelbutton:hover {
background-color: #4a90d9;
color: #ffffff;
}
.clock label,
.mpris label,
.battery label {