diff --git a/waybar/style.css b/waybar/style.css index 9719275..743481d 100644 --- a/waybar/style.css +++ b/waybar/style.css @@ -1,4 +1,220 @@ -@import "/usr/share/sway/templates/waybar/style.css"; +@import "mocha.css"; #custom-uair.resumed { color: #f87171; } +/* ============================================================================= + * + * Waybar configuration + * + * Configuration reference: https://github.com/Alexays/Waybar/wiki/Configuration + * + * =========================================================================== */ + +/* import css definitions for current theme */ + +/* ----------------------------------------------------------------------------- + * Keyframes + * -------------------------------------------------------------------------- */ + +@keyframes blink-warning { + 70% { + color: @wm_icon_bg; + } + + to { + color: @wm_icon_bg; + background-color: @warning_color; + } +} + +@keyframes blink-critical { + 70% { + color: @wm_icon_bg; + } + + to { + color: @wm_icon_bg; + background-color: @error_color; + } +} + +/* ----------------------------------------------------------------------------- + * Base styles + * -------------------------------------------------------------------------- */ + +/* Reset all styles */ +* { + border: none; + border-radius: 0; + min-height: 0; + margin: 0; + padding: 0; + font-family: "JetBrainsMono NF", "Roboto Mono", sans-serif; + color: @text; +} + +window#waybar { + /* you can also GTK3 CSS functions! */ + background-color: shade(@base, 0.9); + border: 2px solid alpha(@crust, 0.3); +} + + +/* Each module */ +#custom-pacman, +#custom-menu, +#custom-help, +#custom-scratchpad, +#custom-github, +#custom-clipboard, +#custom-zeit, +#custom-dnd, +#custom-valent, +#custom-idle_inhibitor, +#bluetooth, +#battery, +#clock, +#cpu, +#memory, +#mode, +#network, +#pulseaudio, +#temperature, +#backlight, +#language, +#custom-adaptive-light, +#custom-sunset, +#custom-playerctl, +#custom-weather, +#tray { + padding-left: 10px; + padding-right: 10px; +} + +/* ----------------------------------------------------------------------------- + * Module styles + * -------------------------------------------------------------------------- */ + +#custom-scratchpad, +#custom-menu, +#workspaces button.focused, +#clock { + color: @theme_bg_color; + background-color: @theme_selected_bg_color; +} + +#custom-zeit.tracking { + background-color: @warning_color; +} + +#battery { + animation-timing-function: linear; + animation-iteration-count: infinite; + animation-direction: alternate; +} + +#battery.warning { + color: @warning_color; +} + +#battery.critical { + color: @error_color; +} + +#battery.warning.discharging { + animation-name: blink-warning; + animation-duration: 3s; +} + +#battery.critical.discharging { + animation-name: blink-critical; + animation-duration: 2s; +} + +#clock { + font-weight: bold; +} + +#cpu.warning { + color: @warning_color; +} + +#cpu.critical { + color: @error_color; +} + +#custom-menu { + padding-left: 8px; + padding-right: 13px; +} + +#memory { + animation-timing-function: linear; + animation-iteration-count: infinite; + animation-direction: alternate; +} + +#memory.warning { + color: @warning_color; +} + +#memory.critical { + color: @error_color; + animation-name: blink-critical; + animation-duration: 2s; +} + +#mode { + background: @background_color; +} + +#network.disconnected { + color: @warning_color; +} + +#pulseaudio.muted { + color: @warning_color; +} + +#temperature.critical { + color: @error_color; +} + +#workspaces button { + border-top: 2px solid transparent; + /* To compensate for the top border and still have vertical centering */ + padding-bottom: 2px; + padding-left: 10px; + padding-right: 10px; + color: @theme_selected_bg_color; +} + +#workspaces button.focused { + border-color: @theme_selected_bg_color; +} + +#workspaces button.urgent { + border-color: @error_color; + color: @error_color; +} + +#workspaces button:hover { + color: @theme_bg_color; +} + +#custom-pacman { + color: @warning_color; +} + +#bluetooth.disabled { + color: @warning_color; +} + +#custom-wf-recorder { + color: @error_color; + padding-right: 10px; +} + +#custom-valent.dangerously-empty { + color: @warning_color; +} diff --git a/waybar/style_orig.css b/waybar/style_orig.css new file mode 100644 index 0000000..9719275 --- /dev/null +++ b/waybar/style_orig.css @@ -0,0 +1,4 @@ +@import "/usr/share/sway/templates/waybar/style.css"; +#custom-uair.resumed { + color: #f87171; +}