From c70505d7c7b7b48600f273357694b56ccf5d2a15 Mon Sep 17 00:00:00 2001 From: Leonard Kugis Date: Fri, 23 May 2025 11:41:09 +0000 Subject: Initial commit --- .config/waybar/style.css | 301 +++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 301 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..84dbdf5 --- /dev/null +++ b/.config/waybar/style.css @@ -0,0 +1,301 @@ +/*Colorschemes, there are Gruvbox, Tokyo Night, and Everforest by default. The way it works is whichever colorscheme section is defined last will be used. Here everforest is last, but put any one you want to use as the last one.*/ + + + +/* Tokyo Night */ +@define-color background #1a1b26; +@define-color background-light #24283b; +@define-color foreground #c0caf5; +@define-color black #15161e; +@define-color red #f7768e; +@define-color green #9ece6a; +@define-color yellow #e0af68; +@define-color blue #7aa2f7; +@define-color magenta #bb9af7; +@define-color cyan #7dcfff; +@define-color white #a9b1d6; +@define-color orange #ff9e64; + + +/* Everforest Dark Colors */ +@define-color background #2b3339; +@define-color background-light #323c41; +@define-color foreground #d3c6aa; +@define-color black #3c474d; +@define-color red #e67e80; +@define-color green #a7c080; +@define-color yellow #dbbc7f; +@define-color blue #7fbbb3; +@define-color magenta #d699b6; +@define-color cyan #83c092; +@define-color white #d3c6aa; +@define-color orange #e69875; + +/* Pastel TTY Colors */ +@define-color background #212121; +@define-color background-light #3a3a3a; +@define-color foreground #e0e0e0; +@define-color black #5a5a5a; +@define-color red #ff9a9e; +@define-color green #b5e8a9; +@define-color yellow #ffe6a7; +@define-color blue #63a4ff; +@define-color magenta #dda0dd; +@define-color cyan #a3e8e8; +@define-color white #ffffff; +@define-color orange #ff8952; + + + +/* Gruvbox Dark Colors */ +@define-color background #282828; +@define-color background-light #3c3836; +@define-color foreground #ebdbb2; +@define-color black #32302f; +@define-color red #cc241d; +@define-color green #98971a; +@define-color yellow #d79921; +@define-color blue #458588; +@define-color magenta #b16286; +@define-color cyan #689d6a; +@define-color white #ebdbb2; +@define-color orange #d65d0e; + + + +/* Module-specific colors */ +@define-color workspaces-color @foreground; +@define-color workspaces-focused-bg @green; +@define-color workspaces-focused-fg @cyan; +@define-color workspaces-urgent-bg @red; +@define-color workspaces-urgent-fg @black; + +/* Text and border colors for modules */ +@define-color mode-color @orange; +@define-color mpd-color @magenta; +@define-color weather-color @magenta; +@define-color playerctl-color @magenta; +@define-color clock-color @blue; +@define-color cpu-color @green; +@define-color memory-color @magenta; +@define-color temperature-color @yellow; +@define-color temperature-critical-color @red; +@define-color battery-color @cyan; +@define-color battery-charging-color @green; +@define-color battery-warning-color @yellow; +@define-color battery-critical-color @red; +@define-color network-color @blue; +@define-color network-disconnected-color @red; +@define-color pulseaudio-color @orange; +@define-color pulseaudio-muted-color @red; +@define-color backlight-color @yellow; +@define-color disk-color @cyan; +@define-color uptime-color @green; +@define-color updates-color @orange; +@define-color quote-color @green; +@define-color idle-inhibitor-color @foreground; +@define-color idle-inhibitor-active-color @red; + +* { + /* Base styling for all modules */ + border: none; + border-radius: 0; + font-family: "FontAwesome", "Terminus", "Roboto", "sans-serif"; + font-size: 14px; + min-height: 0; +} + +window#waybar { + background-color: @background; + color: @foreground; +} + + + +/* Common module styling with border-bottom */ +#mode, #mpd, #custom-weather, #custom-playerctl, #clock, #cpu, +#memory, #temperature, #battery, #network, #pulseaudio, +#backlight, #disk, #custom-uptime, #custom-updates, #custom-quote, +#idle_inhibitor, #tray { + padding: 0 10px; + margin: 0 2px; + border-bottom: 2px solid transparent; + background-color: transparent; +} + +/* Workspaces styling */ +#workspaces button { + padding: 0 10px; + background-color: transparent; + color: @workspaces-color; + margin: 0; +} + +#workspaces button:hover { + background: @background-light; + box-shadow: inherit; +} + +#workspaces button.focused { + box-shadow: inset 0 -2px @workspaces-focused-fg; + color: @workspaces-focused-fg; + font-weight: 900; +} + +#workspaces button.urgent { + background-color: @workspaces-urgent-bg; + color: @workspaces-urgent-fg; +} + +/* Module-specific styling */ +#mode { + color: @mode-color; + border-bottom-color: @mode-color; +} + +#mpd { + color: @mpd-color; + border-bottom-color: @mpd-color; +} + +#mpd.disconnected, +#mpd.stopped { + color: @foreground; + border-bottom-color: transparent; +} + +#custom-weather { + color: @weather-color; + border-bottom-color: @weather-color; +} + +#custom-playerctl { + color: @playerctl-color; + border-bottom-color: @playerctl-color; +} + +#custom-playerctl.Playing { + color: @cyan; + border-bottom-color: @cyan; +} + +#custom-playerctl.Paused { + color: @orange; + border-bottom-color: @orange; +} + +#clock { + color: @clock-color; + border-bottom-color: @clock-color; +} + +#cpu { + color: @cpu-color; + border-bottom-color: @cpu-color; +} + +#memory { + color: @memory-color; + border-bottom-color: @memory-color; +} + +#temperature { + color: @temperature-color; + border-bottom-color: @temperature-color; +} + +#temperature.critical { + color: @temperature-critical-color; + border-bottom-color: @temperature-critical-color; +} + +#battery { + color: @battery-color; + border-bottom-color: @battery-color; +} + +#battery.charging, #battery.plugged { + color: @battery-charging-color; + border-bottom-color: @battery-charging-color; +} + +#battery.warning:not(.charging) { + color: @battery-warning-color; + border-bottom-color: @battery-warning-color; +} + +#battery.critical:not(.charging) { + color: @battery-critical-color; + border-bottom-color: @battery-critical-color; +} + +#network { + color: @network-color; + border-bottom-color: @network-color; +} + +#network.disconnected { + color: @network-disconnected-color; + border-bottom-color: @network-disconnected-color; +} + +#pulseaudio { + color: @pulseaudio-color; + border-bottom-color: @pulseaudio-color; +} + +#pulseaudio.muted { + color: @pulseaudio-muted-color; + border-bottom-color: @pulseaudio-muted-color; +} + +#backlight { + color: @backlight-color; + border-bottom-color: @backlight-color; +} + +#disk { + color: @disk-color; + border-bottom-color: @disk-color; +} + +#custom-uptime { + color: @uptime-color; + border-bottom-color: @uptime-color; +} + +#custom-updates { + color: @updates-color; + border-bottom-color: @updates-color; +} + +#custom-quote { + color: @quote-color; + border-bottom-color: @quote-color; +} + +#idle_inhibitor { + color: @idle-inhibitor-color; + border-bottom-color: transparent; +} + +#idle_inhibitor.activated { + color: @idle-inhibitor-active-color; + border-bottom-color: @idle-inhibitor-active-color; +} + +#tray { + background-color: transparent; + padding: 0 10px; + margin: 0 2px; +} + +#tray > .passive { + -gtk-icon-effect: dim; +} + +#tray > .needs-attention { + -gtk-icon-effect: highlight; + color: @red; + border-bottom-color: @red; +} -- cgit v1.2.3