* { /* `otf-font-awesome` is required to be installed for icons */ /* font-family: FontAwesome, Roboto, Helvetica, Arial, sans-serif; */ font-family: JetBrainsMono Nerd Font, FontAwesome; font-size: 14px; } @define-color background_color rgba(20,45,76,1); @define-color module_container_color rgba(38,51,70,1); @define-color text_color rgba(159,211,199,1); window#waybar { background-color: @background_color; color: @text_color; transition-property: background-color; transition-duration: .5s; } label:focus { background-color: #000000; } /* WORKSPACES */ 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; } #workspaces button:hover { background: rgba(0, 0, 0, 0.2); } #workspaces button.focused { background-color: #64727D; box-shadow: inset 0 -3px #ffffff; } #workspaces button.urgent { background-color: #eb4d4b; } /* MODULES */ .modules-left, .modules-center, .modules-right { background: @module_container_color; margin: 4px 10px; padding: 0 10px; border-radius: 15px; } .modules-left { padding: 0; } .modules-center { padding: 0 10px; } #clock, #pulseaudio, #bluetooth, #cpu, #memory, #disk, #privacy, #cava, #mpris, #scratchpad, #workspaces, #tray, #power { margin: 0 5px; padding: 0 5px; } #clock { border-top-left-radius: 15px; border-bottom-left-radius: 15px; } #pulseaudio { } #pulseaudio.muted { background-color: rgba(255, 0, 55, 0.05); } #pulseaudio:not(.muted):hover { background-color: rgba(255, 255, 0, 0.1); } #bluetooth { } #bluetooth:hover { background-color: rgba(0, 149, 255, 0.1); } #hardware { } #privacy { padding: 0; margin-right: 0; } #privacy-item { padding: 0 5px; border-top-right-radius: 15px; border-bottom-right-radius: 15px; } #privacy-item.screenshare { background-color: #cf5700; } #privacy-item.audio-in { background-color: #1ca000; } #privacy-item.audio-out { background-color: #0069d4; } #music{ } #cava { color: @text_color; opacity: 0.3; } #mpris { } #scratchpad { } #scratchpad.empty { background-color: transparent; } #tray { background-color: #2980b9; } #tray > .passive { -gtk-icon-effect: dim; } #tray > .needs-attention { -gtk-icon-effect: highlight; background-color: #eb4d4b; }