Files
Nomarchy/themes/executive-slate/waybar.css
Bernardo Magri e8658fea5f
Some checks failed
Check / eval (push) Failing after 1m26s
fix(gtk): tray-menu arrows via USER-priority counter-rule; show menu icons
Two corrections to ac7e6bd, which broke the bar it meant to spare:

1. Scoping the waybar '*' reset to 'window#waybar *' gave every reset
   property id-level specificity, so it started BEATING the later
   class rules (Boreal's pill border-radius/borders, workspace pills)
   that plain '*' correctly lost to — visibly wrecking the bar.
   Reverted all three stylesheets to the plain '*' block (bar restored
   byte-identical to pre-ac7e6bd) and instead restored the arrow where
   priority genuinely outranks waybar's stylesheet: stylix's gtk.css
   loads at USER priority (800) vs waybar's APPLICATION (600), so a
   'menu menuitem arrow { min-width/height: 16px }' there survives the
   reset in Waybar-hosted menus — the exact mechanism the neighbouring
   check/radio rule already uses for the same collapse. NB comments at
   each '*' block warn against re-scoping.

2. The 'missing icons' were never just arrows: GTK3 ships
   gtk-menu-images=false since 3.10, so image menu items (nm-applet's
   Wi-Fi list, udiskie) render iconless everywhere. Set
   gtk.gtk3.extraConfig.gtk-menu-images = 1 (merges into the
   settings.ini Stylix already writes).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-12 08:01:01 +01:00

190 lines
5.2 KiB
CSS

/*
* Executive Slate — Waybar whole-swap (themes/<slug>/waybar.css).
*
* A theme waybar.css replaces the ENTIRE generated stylesheet and is read
* raw (no palette is prepended), so this file MUST define its own colors.
* Identity: a solid, non-transparent, edge-to-edge status strip — no
* floating island, sharp corners, tight modules, and a single accent
* underline marking the active workspace. Companion: waybar.jsonc.
*/
@define-color base #191C24;
@define-color mantle #111319;
@define-color surface #2A3040;
@define-color overlay #3E4759;
@define-color text #D7DDEA;
@define-color subtext #9AA5BB;
@define-color muted #5C6578;
@define-color accent #5A8AE6;
@define-color accentAlt #86A9F2;
@define-color good #6FAE72;
@define-color warn #DBA85A;
@define-color bad #D06B71;
/* NB: this `*` reset reaches the SNI tray menus Waybar hosts too — the
menu-side damage (collapsed arrows) is undone by USER-priority rules in
stylix.nix. Do NOT scope it to window#waybar: the id's specificity would
beat the class rules below and wreck the bar. */
* {
/* Mono Nerd face first for status glyphs: proportional "Symbols Nerd
Font" has tight right bearings that make icon+percentage collide. */
font-family: "Symbols Nerd Font Mono", "Inter", "JetBrainsMono Nerd Font", sans-serif;
font-size: 13px;
font-weight: 500;
border: none;
border-radius: 0;
min-height: 0;
}
/* Solid bar, crisp edge against the content below. */
window#waybar {
background: @base;
border-bottom: 1px solid @overlay;
color: @text;
}
.modules-left,
.modules-center,
.modules-right {
margin: 0;
padding: 0;
}
/* Uniform module rhythm; groups get a wider breath below. */
#custom-nomarchy,
#clock,
#custom-recording,
#idle_inhibitor,
#custom-nightlight,
#language,
#custom-updates,
#pulseaudio,
#custom-powerprofile,
#battery,
#custom-vpn,
#custom-doctor,
#custom-notification,
#tray,
#custom-powermenu {
color: @text;
padding: 0 11px;
margin: 0;
}
/* Group heads — a wider gap before each functional cluster of the
right side (media/toggles · stats · status). Self-hiding heads
(e.g. no battery on a desktop) degrade to the uniform spacing. */
#pulseaudio,
#battery,
#custom-vpn { margin-left: 6px; }
/* ── Menu launcher — the branded Nomarchy mark ───────────────────────
The mark lives at U+F000 in the dedicated "Nomarchy" font; pin the
family or the Nerd Font's glass glyph at the same codepoint wins. */
#custom-nomarchy {
color: @accent;
font-family: Nomarchy;
font-size: 16px;
padding: 0 14px;
}
#custom-nomarchy:hover {
background: @surface;
color: @accentAlt;
}
/* ── Workspaces — flat cells, active carries an accent underline ──── */
#workspaces { padding: 0; margin: 0; }
#workspaces button {
color: @subtext;
padding: 0 11px;
margin: 0;
border-bottom: 2px solid transparent;
transition: color 0.15s ease-in-out, background 0.15s ease-in-out;
}
#workspaces button:hover {
background: @surface;
color: @text;
border-bottom: 2px solid @overlay;
}
#workspaces button.active {
color: @text;
background: @surface;
border-bottom: 2px solid @accent;
}
#workspaces button.urgent {
color: @bad;
border-bottom: 2px solid @bad;
}
/* ── Clock — unified time · date in one module ───────────────────── */
#clock {
color: @text;
font-weight: 600;
font-family: "Inter", "Symbols Nerd Font Mono", sans-serif;
}
/* ── Status cluster: neutral by default, semantic on state ───────── */
#custom-recording.recording { color: @bad; }
#idle_inhibitor.activated { color: @warn; }
#custom-nightlight.on { color: @warn; }
#custom-updates.available { color: @accent; }
/* Icon-only status modules carry no text, so they don't get the 13pt
Pango icon span the icon+text modules (volume/battery/language) use —
bump their font-size to match, or these glyphs read smaller than their
neighbours. */
#custom-recording,
#custom-nightlight,
#custom-updates,
#custom-vpn,
#custom-doctor,
#custom-notification { font-size: 17px; }
/* Speedometer + caffeine cup render small in their em box — a touch more. */
#custom-powerprofile,
#idle_inhibitor { font-size: 18px; }
#pulseaudio.muted { color: @muted; }
#battery.charging { color: @good; }
#battery.warning:not(.charging) { color: @warn; }
#battery.critical:not(.charging) {
color: @bad;
border-bottom: 2px solid @bad;
}
#custom-vpn.on { color: @good; }
/* Doctor is only rendered when something is ✖, so always the alert. */
#custom-doctor { color: @bad; }
#custom-notification.notification { color: @accent; }
#custom-notification.dnd-none,
#custom-notification.dnd-notification,
#custom-notification.inhibited-none,
#custom-notification.inhibited-notification { color: @muted; }
#tray { color: @text; }
#custom-powermenu { color: @subtext; }
#custom-powermenu:hover {
background: @surface;
color: @bad;
}
/* ── Tooltips ─────────────────────────────────────────────────────── */
tooltip {
background: @surface;
border: 1px solid @overlay;
border-radius: 4px;
}
tooltip label {
color: @text;
}