* { /* `otf-font-awesome` is required to be installed for icons */ font-family: JetBrainsMono Nerd Font, monospace; font-size: 13px; } window#waybar { background-color: rgba(13, 17, 23, 1.0); /* border-bottom: 1px solid rgba(100, 114, 125, 0.5); */ color: #ffffff; transition-property: background-color; transition-duration: .5s; } window#waybar.hidden { opacity: 0.2; } /* window#waybar.empty { background-color: transparent; } window#waybar.solo { background-color: #FFFFFF; } */ window#waybar.termite { background-color: #3F3F3F; } window#waybar.chromium { background-color: #000000; border: none; } button { /* Use box-shadow instead of border so the text isn't offset */ box-shadow: inset 0 -3px transparent; /* Avoid rounded borders under each button name */ border: none; border-radius: 0; } /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */ button:hover { box-shadow: inherit; text-shadow: inherit; } #workspaces button { padding: 0 1px; background: rgba(13, 17, 23, 1.0); /* border: 1px solid rgba(92, 92, 92, 1); */ color: #ffffff; } #workspaces button:hover { background: rgba(13, 17, 23, 1.0); /* border: 1px solid rgba(0, 0, 0, 0) */ } #workspaces button.focused { background-color: rgba(69, 89, 121, 1); /* border: 1px solid rgba(69, 113, 146, 1); */ } #workspaces button.urgent { background-color: rgba(144, 0, 0, 1); /* border: 1px solid rgba(144, 0, 0, 1); */ } #mode { background-color: #64727D; /* border-bottom: 3px solid #ffffff; */ } #clock, #battery, #cpu, #memory, #disk, #temperature, #backlight, #network, #pulseaudio, #wireplumber, #custom-media, #tray, #mode, #idle_inhibitor, #scratchpad, #mpd { padding: 0 10px; } #window, #workspaces { margin: 0 4px; } /* 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; } @keyframes blink { to { } } #battery.critical:not(.charging) { animation-name: blink; animation-duration: 0.5s; animation-timing-function: linear; animation-iteration-count: infinite; animation-direction: alternate; } #custom-media { min-width: 100px; } #tray > .passive { -gtk-icon-effect: dim; } #tray > .needs-attention { -gtk-icon-effect: highlight; }