From 0438660003a5f3cbdb2dd8a42961e0c8629f80b9 Mon Sep 17 00:00:00 2001 From: Thomas Voss Date: Sun, 13 Aug 2023 01:09:49 +0200 Subject: waybar: Add waybar configuration --- .config/waybar/style.css | 89 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 89 insertions(+) create mode 100644 .config/waybar/style.css (limited to '.config/waybar/style.css') diff --git a/.config/waybar/style.css b/.config/waybar/style.css new file mode 100644 index 0000000..7468468 --- /dev/null +++ b/.config/waybar/style.css @@ -0,0 +1,89 @@ +@keyframes blink { + to { + color: #FFF; + box-shadow: inset 0 -3px #FFF; + } +} + +* { + font-family: "Iosevka Smooth"; + font-size: 16px; +} + +window#waybar { + background-color: rgba(43, 48, 59, 0.5); + border-bottom: 3px solid rgba(100, 114, 125, 0.5); + transition-property: background-color; + transition-duration: .5s; +} + +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; +} + +button:hover { + background: inherit; +} + +#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; +} + +#workspaces button { + color: #FFF; + padding: 0 5px; + background-color: transparent; +} + +#workspaces button:hover { + background: rgba(0, 0, 0, 0.2); +} + +#workspaces button.active { + background-color: rgba(0, 0, 0, 0.4); +} + +#workspaces button.urgent { + background-color: #eb4d4b; +} + +#backlight, +#battery, +#clock, +#custom-disk, +#custom-keyboard, +#network, +#wireplumber { + padding: 0 5px; + color: #FFF; +} + +button:hover, +#workspaces button.active { + color: #FFF; + box-shadow: inset 0 -3px #FAA14F; +} + +#battery.critical:not(.charging) { + color: #F53C3C; + box-shadow: inset 0 -3px #F53C3C; + animation-name: blink; + animation-duration: 0.65s; + animation-timing-function: linear; + animation-iteration-count: infinite; + animation-direction: alternate; +} -- cgit v1.2.3