* { /* `otf-font-awesome` is required to be installed for icons */ font-family: FontAwesome, Roboto, Helvetica, Arial, sans-serif; font-size: 13px; } window#waybar { background-color: rgba(34, 34, 34, 0.8); color: #AAAAAA; transition-property: background-color; transition-duration: .5s; } window#waybar.hidden { opacity: 0.2; } #workspaces { color: #4c94af; 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; } 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 { background: inherit; box-shadow: inset 0 -3px #ffffff; } #workspaces button { padding: 0 5px; background-color: transparent; color: #AAAAAA; } #workspaces button:hover { background: rgba(0, 0, 0, 0.2); } #workspaces button.active { color: #4E9A06; box-shadow: inset 0 -3px #4c94af; } #workspaces button.urgent { box-shadow: inset 0 -3px #DD1111; } #window { color: #AAAAAA; } #clock, #cpu, #memory, #backlight, #pulseaudio, #tray { padding: 0 5px; color: #4c94af; } #temperature, #network { padding: 0 5px; color: #4E9A06; } #temperature.critical { background-color: #E07C00; } #pulseaudio:hover { background-color: rgba(17, 17, 17, 0.2); } #pulseaudio { color: #4E9A06; } #pulseaudio.sound { margin-right: 0; } #pulseaudio.mic { margin-left: 0; } #pulseaudio.sound.muted { color: #E07C00; } #pulseaudio.mic.source-muted { color: #E07C00; } #battery { padding: 0 4px; color: #4c94af; } #battery.charging, #battery.plugged { color: #4c94af; } #battery.full:not(.charging) { color: #4E9A06; } #battery.warning:not(.charging) { color: #E07C00; } #battery.critical:not(.charging) { color: #DD1111; } label:focus { background-color: #000000; } #tray > .passive { -gtk-icon-effect: dim; } #tray > .needs-attention { -gtk-icon-effect: highlight; } #privacy { padding: 0; } #privacy-item { padding: 0 5px; color: white; } #privacy-item.screenshare { background-color: #cf5700; } #privacy-item.audio-in { background-color: #1ca000; } #privacy-item.audio-out { background-color: #0069d4; }