diff --git a/henrovnix_ok/assets/conf/desktop/waybar/style.css b/henrovnix_ok/assets/conf/desktop/waybar/style.css index 0e16a3a67..3031135bf 100644 --- a/henrovnix_ok/assets/conf/desktop/waybar/style.css +++ b/henrovnix_ok/assets/conf/desktop/waybar/style.css @@ -30,25 +30,35 @@ window#waybar { /* --- Workspaces --- */ #workspaces button { padding: 0px 6px; - min-width: 80px; - max-width: 80px; + min-width: 80px; /* fixed-ish width without max-width */ background-color: transparent; color: @text; border: 1px solid @inactive; border-radius: 10px; + box-shadow: none; } +/* Subtle hover glow (GTK-safe): slight tint + soft shadow */ #workspaces button:hover { - background-color: @surface1; + background-color: rgba(255, 255, 255, 0.1); + box-shadow: 0 0 10px rgba(51, 204, 255, 0.18); } -/* Active workspace with GTK-safe gradient */ +/* Active workspace with GTK-safe gradient border */ #workspaces button.active { font-weight: bold; border-radius: 10px; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.15); border-image: linear-gradient(45deg, @blue, @green) 1; + box-shadow: 0 0 12px rgba(0, 255, 153, 0.18); +} + +/* Optional: make active+hover pop a hair more */ +#workspaces button.active:hover { + box-shadow: + 0 0 12px rgba(51, 204, 255, 0.22), + 0 0 12px rgba(0, 255, 153, 0.18); } /* --- Notifications icon --- */ @@ -104,14 +114,31 @@ window#waybar { } /* --- Hyprscroll overflow indicator --- */ +#custom-hyprscroll_overflow { + border-radius: 10px; + box-shadow: none; +} + +/* Subtle hover glow when not overflow (if it still renders as a widget) */ +#custom-hyprscroll_overflow:hover { + background-color: rgba(255, 255, 255, 0.06); + box-shadow: 0 0 10px rgba(0, 255, 153, 0.16); +} + #custom-hyprscroll_overflow.overflow { padding: 0px 6px; - min-width: 80px; - max-width: 80px; + min-width: 80px; /* match workspace button width */ color: @text; border-radius: 10px; font-weight: bold; border: 2px solid transparent; background-color: rgba(255, 255, 255, 0.05); border-image: linear-gradient(45deg, @blue, @green) 1; + box-shadow: 0 0 12px rgba(51, 204, 255, 0.18); +} + +#custom-hyprscroll_overflow.overflow:hover { + box-shadow: + 0 0 12px rgba(51, 204, 255, 0.22), + 0 0 12px rgba(0, 255, 153, 0.18); }