GTK's menuAttachToWidget makes popup menus CSS descendants of the tray widget, so .outer-pad.sni-tray * (specificity 0,2,0) was bleeding light tray text colors into menu items. Fix by using the same parent selectors with menu descendant types (.outer-pad.sni-tray menu menuitem *) for specificity 0,2,2+ that definitively overrides the tray color rule. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
82 lines
3.2 KiB
CSS
82 lines
3.2 KiB
CSS
/* Taffybar palette/theme variables.
|
|
*
|
|
* `palette.css` imports this file so host configs can keep referencing the
|
|
* historical filename while we iterate on a more structured theme.
|
|
*/
|
|
|
|
@define-color accent #f1b2b2;
|
|
|
|
/* Bar chrome — low alpha so the desktop wallpaper shows through. */
|
|
@define-color bar-background rgba(0, 0, 0, 0.35);
|
|
@define-color bar-gradient-start rgba(20, 26, 40, 0.68);
|
|
@define-color bar-gradient-end rgba(12, 18, 30, 0.68);
|
|
@define-color bar-border rgba(255, 255, 255, 0.06);
|
|
|
|
/* The subtle translucent "sheet" behind all widgets. */
|
|
@define-color bar-overlay rgba(0, 0, 0, .2);
|
|
|
|
/* Widgets (pill/squircle containers) */
|
|
@define-color pill-background rgba(48, 52, 69, 0.92);
|
|
@define-color pill-border rgba(92, 95, 120, 0.85);
|
|
@define-color pill-highlight rgba(255, 255, 255, 0.10);
|
|
@define-color pill-shadow rgba(0, 0, 0, 0.28);
|
|
|
|
/* Per-widget backgrounds — each widget gets a distinct tinted squircle so they
|
|
are visually distinguishable at a glance. Each group defines:
|
|
*-bg : pill background color (semi-transparent, dark-tinted)
|
|
*-fg : text/icon color (light, tinted to complement the background)
|
|
*-border : subtle border stroke color */
|
|
|
|
/* PulseAudio volume widget — purple */
|
|
@define-color widget-audio-bg rgba(110, 45, 160, 0.92);
|
|
@define-color widget-audio-fg #e8d5f8;
|
|
@define-color widget-audio-border rgba(155, 85, 210, 0.60);
|
|
|
|
/* NetworkManager wifi/ethernet widget — teal */
|
|
@define-color widget-network-bg rgba(20, 120, 140, 0.92);
|
|
@define-color widget-network-fg #d0f2f8;
|
|
@define-color widget-network-border rgba(50, 175, 200, 0.60);
|
|
|
|
/* MPRIS2 now-playing widget — rose/crimson */
|
|
@define-color widget-mpris-bg rgba(160, 40, 70, 0.92);
|
|
@define-color widget-mpris-fg #f8d5e0;
|
|
@define-color widget-mpris-border rgba(210, 80, 115, 0.60);
|
|
|
|
/* Clock widget — indigo/royal blue */
|
|
@define-color widget-clock-bg rgba(50, 60, 160, 0.92);
|
|
@define-color widget-clock-fg #d5d8f8;
|
|
@define-color widget-clock-border rgba(90, 100, 210, 0.60);
|
|
|
|
/* Disk-usage widget — emerald green */
|
|
@define-color widget-disk-bg rgba(25, 130, 75, 0.92);
|
|
@define-color widget-disk-fg #c8f5e0;
|
|
@define-color widget-disk-border rgba(55, 190, 115, 0.60);
|
|
|
|
/* StatusNotifierItem system tray — neutral dark slate */
|
|
@define-color widget-tray-bg rgba(65, 70, 100, 0.92);
|
|
@define-color widget-tray-fg #d8dae8;
|
|
@define-color widget-tray-border rgba(110, 115, 160, 0.60);
|
|
|
|
/* Battery (icon and text) — amber/gold */
|
|
@define-color widget-battery-bg rgba(160, 115, 20, 0.92);
|
|
@define-color widget-battery-fg #f8ecc5;
|
|
@define-color widget-battery-border rgba(210, 165, 50, 0.60);
|
|
|
|
/* Backlight/brightness widget — warm golden */
|
|
@define-color widget-backlight-bg rgba(170, 120, 15, 0.92);
|
|
@define-color widget-backlight-fg #f8efc5;
|
|
@define-color widget-backlight-border rgba(220, 170, 45, 0.60);
|
|
|
|
/* Text */
|
|
@define-color font-color #e7e4ee;
|
|
@define-color font-muted #b8b1c6;
|
|
|
|
/* Menus: keep high-contrast and readable while iterating. */
|
|
@define-color menu-background-color #ffffff;
|
|
@define-color menu-font-color #000000;
|
|
@define-color menu-highlight rgba(0, 0, 0, 0.10);
|
|
|
|
@define-color transparent rgba(0.0, 0.0, 0.0, 0.0);
|
|
@define-color white #ffffff;
|
|
@define-color black #000000;
|