/* #region stylix overrides*/ .modules-left #workspaces button, .modules-left #workspaces button.focused, .modules-left #workspaces button.active, .modules-center #workspaces button, .modules-center #workspaces button.focused, .modules-center #workspaces button.active, .modules-right #workspaces button, .modules-right #workspaces button.focused, .modules-right #workspaces button.active { border-bottom: unset; } /* #endregion */ * { font-family: monospace; font-size: 13px; } window#waybar { transition-property: background-color; transition-duration: 0.5s; /* Gradient border spanning the entire waybar window */ border-bottom: 3px solid transparent; background-clip: padding-box, border-box; background-origin: padding-box, border-box; background-image: linear-gradient(135deg, @base00, @base01), linear-gradient(135deg, @base0C, @base09); } /* Common pill styling for all widgets */ #clock, #cpu, #memory, #disk, #temperature, #backlight, #network, #pulseaudio, #wireplumber, #custom-media, #mode, #scratchpad, #mpd, #custom-weather, #battery, #power-profiles-daemon, #idle_inhibitor, #custom-swaync, #bluetooth, #mpris, #upower, #workspaces, #window, #tray, #custom-wlogout, #privacy-item { margin: 0px 4px 6px; padding: 0px 8px; background: linear-gradient(135deg, @base02, @base01); border-radius: 15px; border: 2px solid; transition: all 0.3s ease; } /* special treatment for weird sized widgets */ #custom-wlogout, #power-profiles-daemon, #idle_inhibitor { padding: 0px 10px 0px 8px; } #workspaces { padding-left: 0; padding-right: 0; } /* Individual widget colors */ #workspaces, #window, #tray { border-color: @base0D; } #workspaces button { padding: 0 6px; background-color: transparent; color: @base05; border-radius: 15px; border: none; transition: all 0.3s ease; } #workspaces button:hover { background: @base03; } #workspaces button.focused, #workspaces button.active { background-color: @base03; color: @base07; } #workspaces button.urgent { background-color: @base08; color: @base00; } #clock { color: @base07; border-color: @base0D; } #cpu { color: @base09; border-color: @base09; } #memory { color: @base0E; border-color: @base0E; } #disk { color: @base0D; border-color: @base0D; } #temperature { color: @base08; border-color: @base08; } #backlight { color: @base0A; border-color: @base0A; } #network { color: @base0B; border-color: @base0B; } #pulseaudio, #wireplumber { color: @base0D; border-color: @base0D; } #custom-media { color: @base0E; border-color: @base0E; } #mode { color: @base05; border-color: @base03; box-shadow: inset 0 -3px @base05; } #mpd { color: @base0E; border-color: @base0E; } #custom-weather { color: @base0B; border-color: @base0B; } #battery, #power-profiles-daemon, #idle_inhibitor { color: @base05; border-color: @base03; } #custom-swaync { color: @base0E; border-color: @base0E; } #bluetooth { color: @base0D; border-color: @base0D; } #mpris { color: @base0E; border-color: @base0E; } #upower { color: @base0B; border-color: @base0B; } /* If workspaces is the leftmost module, omit left margin */ .modules-left > widget:first-child > #workspaces { margin-left: 0; } /* If workspaces is the rightmost module, omit right margin */ .modules-right > widget:last-child > #workspaces { margin-right: 0; } /* Battery states with colored glows */ #battery.charging { box-shadow: 0 0 6px rgba(168, 201, 255, 0.6); border-color: @base0B; color: @base0B; } #battery.warning:not(.charging) { box-shadow: 0 0 6px rgba(209, 98, 164, 0.6); border-color: @base0A; color: @base0A; } @keyframes blink { to { background-color: #ffffff; color: #000000; } } #battery.critical:not(.charging) { box-shadow: 0 0 6px rgba(243, 139, 168, 0.8); border-color: @base08; color: @base08; animation-name: blink; animation-duration: 0.5s; /* Using steps() instead of linear as a timing function to limit cpu usage */ animation-timing-function: steps(12); animation-iteration-count: infinite; animation-direction: alternate; } /* Bluetooth connected state */ #bluetooth.connected { box-shadow: 0 0 6px rgba(137, 180, 250, 0.5); } /* Power profiles with state-appropriate glows */ #power-profiles-daemon.performance { box-shadow: 0 0 6px rgba(243, 139, 168, 0.6); border-color: @base08; color: @base08; } #power-profiles-daemon.balanced { box-shadow: 0 0 6px rgba(137, 180, 250, 0.6); border-color: @base0D; color: @base0D; } #power-profiles-daemon.power-saver { box-shadow: 0 0 6px rgba(168, 201, 255, 0.6); border-color: @base0B; color: @base0B; } /* Idle inhibitor with state glow */ #idle_inhibitor.activated { box-shadow: 0 0 6px rgba(137, 180, 250, 0.6); border-color: @base0D; color: @base0D; } /* MPD states with glows */ #mpd.playing { box-shadow: 0 0 6px rgba(168, 201, 255, 0.5); border-color: @base0B; color: @base0B; } #mpd.paused { box-shadow: 0 0 6px rgba(203, 166, 247, 0.5); border-color: @base0E; color: @base0E; } #mpd.disconnected, #mpd.stopped { color: @base04; } #tray > .passive { -gtk-icon-effect: dim; } #tray > .needs-attention { -gtk-icon-effect: highlight; box-shadow: 0 0 6px rgba(243, 139, 168, 0.8); border-color: @base08; } #privacy { padding: 0; } #privacy-item.screenshare { box-shadow: 0 0 6px rgba(209, 98, 164, 0.6); border-color: @base0A; color: @base0A; } #privacy-item.audio-in { box-shadow: 0 0 6px rgba(168, 201, 255, 0.6); border-color: @base0B; color: @base0B; } #privacy-item.audio-out { box-shadow: 0 0 6px rgba(137, 180, 250, 0.6); border-color: @base0D; color: @base0D; } /* Custom wlogout button */ #custom-wlogout { color: @base08; border-color: @base08; } #custom-wlogout:hover { box-shadow: 0 0 6px rgba(243, 139, 168, 0.5); }