From bcfda983efdd527f75de54c35f5366f23e774233 Mon Sep 17 00:00:00 2001 From: garhve Date: Mon, 16 Sep 2024 11:47:28 +0800 Subject: initialize --- .config/waybar/style.css | 357 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 357 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..a1eb509 --- /dev/null +++ b/.config/waybar/style.css @@ -0,0 +1,357 @@ +@import "mocha.css"; + +* { + /* `otf-font-awesome` is required to be installed for icons */ + font-family: SF Pro Display, sans-serif; + font-size: 13px; + + color: @text; +} + +window#waybar { + /* you can also GTK3 CSS functions! */ + background-color: shade(@base, 1.0); + background: rgba(28,28,28,0); + /* border: 2px solid alpha(@crust, 0.3); */ +} + +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 { + background: inherit; + box-shadow: inset 0 -3px #ffffff; +} + +/* you can set a style on hover for any module like this */ +#pulseaudio:hover { + background: #a2a8d3; +} + +#workspaces button { + padding: 0 5px; + background-color: transparent; + color: #ff4040; +} + +#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; +} + +#mode { + background-color: #64727D; + box-shadow: inset 0 -3px #ffffff; +} + +#clock, +#battery, +#cpu, +#memory, +#disk, +#temperature, +#backlight, +#network, +#pulseaudio, +#wireplumber, +#custom-media, +#tray, +#mode, +#idle_inhibitor, +#scratchpad, +#power-profiles-daemon, +#mpd { + padding: 0 10px; + color: #ffffff; +} + +#window, +#workspaces { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; + color: #ff4040; +} + +/* 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; +} + +#clock { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 10px; +} + +#battery { + background-color: #ffffff; + color: #000000; +} + +#battery.charging, #battery.plugged { + color: #ffffff; + background-color: #26A65B; +} + +@keyframes blink { + to { + background-color: #ffffff; + color: #000000; + } +} + +/* Using steps() instead of linear as a timing function to limit cpu usage */ +#battery.critical:not(.charging) { + background-color: #f53c3c; + color: #ffffff; + animation-name: blink; + animation-duration: 0.5s; + animation-timing-function: steps(12); + animation-iteration-count: infinite; + animation-direction: alternate; +} + +#power-profiles-daemon { + padding-right: 15px; +} + +#power-profiles-daemon.performance { + background-color: #f53c3c; + color: #ffffff; +} + +#power-profiles-daemon.balanced { + background-color: #2980b9; + color: #ffffff; +} + +#power-profiles-daemon.power-saver { + background-color: #2ecc71; + color: #000000; +} + +label:focus { + background-color: #000000; +} + +#cpu { + background-color: #2ecc71; + color: #000000; +} + +#memory { + background-color: #9b59b6; +} + +#disk { + background-color: #964B00; +} + +#backlight { + background-color: #90b1b1; +} + +#network { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; +} + +#network.disconnected { +} + +#pulseaudio { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; +} + +#pulseaudio.muted { + color: #2a5c45; + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; +} + +#wireplumber { + background-color: #fff0f5; + color: #000000; +} + +#wireplumber.muted { + background-color: #f53c3c; +} + +#custom-media { + background-color: #66cc99; + color: #2a5c45; + min-width: 100px; +} + +#custom-media.custom-spotify { + background-color: #66cc99; +} + +#custom-media.custom-vlc { + background-color: #ffa000; +} + +#temperature { + background-color: #f0932b; +} + +#temperature.critical { + background-color: #eb4d4b; +} + +#tray { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; +} + +#tray > .passive { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; + -gtk-icon-effect: dim; +} + +#tray > .needs-attention { + -gtk-icon-effect: highlight; + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 5px; +} + +#idle_inhibitor { + background-color: #2d3436; +} + +#idle_inhibitor.activated { + background-color: #ecf0f1; + color: #2d3436; +} + +#mpd { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 10px; + color: #39aecf; +} + +#mpd.disconnected { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 10px; + color: #ff4040; +} + +#mpd.stopped { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 10px; + color: #ffffff; +} + +#mpd.paused { + background: rgba(52,73,94, 0.6); + border-radius: 30px; + padding: 0 10px; + color: #ffd600; +} + +#language { + background: #00b093; + color: #740864; + padding: 0 5px; + margin: 0 5px; + min-width: 16px; +} + +#keyboard-state { + background: #97e1ad; + color: #000000; + padding: 0 0px; + margin: 0 5px; + min-width: 16px; +} + +#keyboard-state > label { + padding: 0 5px; +} + +#keyboard-state > label.locked { + background: rgba(0, 0, 0, 0.2); +} + +#scratchpad { + background: rgba(0, 0, 0, 0.2); +} + +#scratchpad.empty { + background-color: transparent; +} + +#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; +} -- cgit v1.2.3-70-g09d2