From a71602d883784b8078984d41388b6f24cb04e524 Mon Sep 17 00:00:00 2001 From: Andre Ramnitz Date: Fri, 5 Sep 2025 02:15:16 +0200 Subject: [PATCH] waybar: flavours -> matugen --- dot-config/waybar/config.jsonc | 93 ++--- dot-config/waybar/matugen_waybar.css | 177 ++++++++ dot-config/waybar/scripts/sound-source.sh | 2 +- dot-config/waybar/style.css | 353 ++++++---------- dot-config/waybar/style.css.20250818 | 473 ++++++++++++++++++++++ 5 files changed, 824 insertions(+), 274 deletions(-) create mode 100644 dot-config/waybar/matugen_waybar.css create mode 100644 dot-config/waybar/style.css.20250818 diff --git a/dot-config/waybar/config.jsonc b/dot-config/waybar/config.jsonc index 96a1fdb4..6e42bb8f 100644 --- a/dot-config/waybar/config.jsonc +++ b/dot-config/waybar/config.jsonc @@ -8,7 +8,7 @@ "custom/launcher", "hyprland/workspaces", "custom/voidspacer", - "custom/mpris" + "mpris" ], "modules-center": [ "hyprland/submap", @@ -69,19 +69,25 @@ "class": "󰻞", "class": "", "class": "", + "class": "󱎏", + "class": "󱎒", + "class": "󱎐", + "class": " ", + "class": "", + "class": "", }, "format-icons": { "1": "", "2": "", "3": "", - "4": "", + "4": "󰽰", "5": "", "6": "󰸾", - "7": "󰸷", - "8": "", + "7": "󰦑", + "8": "", "9": "󰖟", - "0": "", - "11": "" + "10": "󰸷", + "11": "" }, "persistent-workspaces": { "*": 6 @@ -134,10 +140,11 @@ "format": "{player}: {player_icon} {dynamic}", "format-paused": "{status_icon} {dynamic}", "format-stopped": "{status_icon}", + "dynamic-len": 70, "dynamic-importance-order": [ - "artist", - "album", "title", + "album", + "artist", "position", "length" ], @@ -165,7 +172,7 @@ "interval": 1 }, "custom/gpuusage": { - "exec": "cat /sys/class/hwmon/hwmon0/device/gpu_busy_percent", + "exec": "cat /dev/sensors/gpudedicated/device/gpu_busy_percent", "format": " {}%", "return-type": "", "interval": 1, @@ -179,30 +186,28 @@ }, "temperature#water": { "hwmon-path": "/dev/sensors/d5next/temp1_input", - "critical-threshold": 42, - //"format": "{temperatureC}°C ", - "format": " {temperatureC}°C", - "on-click-right": "foot -a popup /usr/local/bin/fan2go-tui", + "critical-threshold": 40, + "format": "󰏈 {temperatureC}°C", + "format-critical": "󰏈 {temperatureC}°C", "tooltip-format": "Water Temp" }, "temperature#cpu": { "hwmon-path": "/dev/sensors/k10temp/temp1_input", "critical-threshold": 95, - //"format": "{temperatureC}°C " "format": " {temperatureC}°C", "tooltip-format": "CPU Temp" }, "temperature#board": { "hwmon-path": "/dev/sensors/nct6799/temp1_input", "critical-threshold": 85, - //"format": "{temperatureC}°C 󰇅" + //"format": "{temperatureC}°C 󰇅", "format": "󰇅 {temperatureC}°C", "tooltip-format": "Mainboard Temp" }, "temperature#gpu": { "hwmon-path": "/dev/sensors/gpudedicated/temp1_input", "critical-threshold": 110, - //"format": "{temperatureC}°C 󰍹" + //"format": "{temperatureC}°C 󰍹", "format": "󰍹 {temperatureC}°C", "tooltip-format": "GPU Junction Temp" }, @@ -247,7 +252,7 @@ "clock": { "timezone": "Europe/Berlin", "tooltip-format": "{calendar}", - "format-alt": "{:%Y-%m-%d}", + "format-alt": "{:%Y-%m-%d %X}", "smooth-scrolling-threshold": "single", "calendar": { "mode": "month", @@ -282,7 +287,7 @@ "deactivated": " off" } }, - "custom/hyprsunset-temp": { + "custom/hyprsunset-brightness": { "format": "󰽥 {}K", "on-click": "~/.config/hypr/scripts/hyprsunset.sh temperature 4500 toggle", "on-click-right": "hyprctl hyprsunset identity", @@ -309,63 +314,43 @@ "signal": 3, }, "group/trayclock": { - "orientation": "horizontal", + "orientation": "inherit", "modules": [ "tray", "clock" ] }, "group/sndpwr": { - "orientation": "horizontal", + "orientation": "inherit", "modules": [ - "wireplumber", - "gamemode", - "power-profiles-daemon" + "wireplumber", + "gamemode", + "power-profiles-daemon" ] }, "group/display": { - "orientation": "horizontal", + "orientation": "inherit", "modules": [ "idle_inhibitor", - "group/hyprsunset", + "custom/hyprsunset-gamma", + "custom/hyprsunset-brightness", "hyprland/language" ] }, - "cava": { - "cava_config": "$HOME/.config/cava/waybarconfig", - "input_delay": "1", - "format-icons": ["▁", "▂", "▃", "▄", "▅", "▆", "▇", "█" ], - "actions": { - "on-click-right": "mode" - } - }, "group/sysmon": { - "orientation": "horizontal", + "orientation": "inherit", "modules": [ "cpu", "group/temps", "memory" ] }, - "group/hyprsunset": { - "orientation": "inherit", - "drawer": { - "click-to-reveal": false, - "transition-duration": 500, - "children-class": "not-gammarelay", - "transition-left-to-right": false - }, - "modules": [ - "custom/hyprsunset-temp", - "custom/hyprsunset-gamma" - ] - }, "group/temps": { "orientation": "inherit", "drawer": { - "click-to-reveal": false, + "click-to-reveal": true, "transition-duration": 500, - "children-class": "not-temps", + "children-class": "not-temperature#water", "transition-left-to-right": false }, "modules": [ @@ -375,6 +360,14 @@ "temperature#gpu" ] }, + "cava": { + "cava_config": "$HOME/.config/cava/waybarconfig", + "input_delay": "1", + "format-icons": ["▁", "▂", "▃", "▄", "▅", "▆", "▇", "█" ], + "actions": { + "on-click-right": "mode" + } + }, "gamemode": { "format": "{glyph}", "format-alt": "{glyph} {count}", @@ -391,6 +384,8 @@ "format": "{icon}", "tooltip-format": "Power profile: {profile}\nDriver: {driver}", "tooltip": true, + "on-scroll-up": "", + "on-scroll-down": "", "format-icons": { "default": "", "performance": "", diff --git a/dot-config/waybar/matugen_waybar.css b/dot-config/waybar/matugen_waybar.css new file mode 100644 index 00000000..836485e9 --- /dev/null +++ b/dot-config/waybar/matugen_waybar.css @@ -0,0 +1,177 @@ +/* +* Css Colors +* Generated with Matugen +*/ + + @define-color background #0e1514; + + @define-color blue #a2c9fe; + + @define-color blue_container #1d4875; + + @define-color blue_source #0c8aeb; + + @define-color blue_value #0c8aeb; + + @define-color cyan #81d5cc; + + @define-color cyan_container #00504a; + + @define-color cyan_source #0cebdc; + + @define-color cyan_value #0cebdc; + + @define-color error #ffb4ab; + + @define-color error_container #93000a; + + @define-color green #afd18b; + + @define-color green_container #334e17; + + @define-color green_source #8aeb0c; + + @define-color green_value #8aeb0c; + + @define-color inverse_on_surface #2b3231; + + @define-color inverse_primary #006a66; + + @define-color inverse_surface #dde4e2; + + @define-color magenta #eeb4e9; + + @define-color magenta_container #643663; + + @define-color magenta_source #dc0ceb; + + @define-color magenta_value #dc0ceb; + + @define-color on_background #dde4e2; + + @define-color on_blue #00325a; + + @define-color on_blue_container #d2e4ff; + + @define-color on_cyan #003733; + + @define-color on_cyan_container #9df2e8; + + @define-color on_error #690005; + + @define-color on_error_container #ffdad6; + + @define-color on_green #1d3702; + + @define-color on_green_container #cbeea5; + + @define-color on_magenta #4a204b; + + @define-color on_magenta_container #ffd6f9; + + @define-color on_primary #003735; + + @define-color on_primary_container #9cf1ec; + + @define-color on_primary_fixed #00201e; + + @define-color on_primary_fixed_variant #00504d; + + @define-color on_red #541d35; + + @define-color on_red_container #ffd9e4; + + @define-color on_secondary #1b3533; + + @define-color on_secondary_container #cce8e5; + + @define-color on_secondary_fixed #051f1e; + + @define-color on_secondary_fixed_variant #324b49; + + @define-color on_surface #dde4e2; + + @define-color on_surface_variant #bec9c7; + + @define-color on_tertiary #19324a; + + @define-color on_tertiary_container #d0e4ff; + + @define-color on_tertiary_fixed #011d34; + + @define-color on_tertiary_fixed_variant #314862; + + @define-color on_yellow #353100; + + @define-color on_yellow_container #efe58b; + + @define-color outline #889391; + + @define-color outline_variant #3f4948; + + @define-color primary #80d5d0; + + @define-color primary_container #00504d; + + @define-color primary_fixed #9cf1ec; + + @define-color primary_fixed_dim #80d5d0; + + @define-color red #ffb0cb; + + @define-color red_container #6f334b; + + @define-color red_source #eb0c8a; + + @define-color red_value #eb0c8a; + + @define-color scrim #000000; + + @define-color secondary #b0ccc9; + + @define-color secondary_container #324b49; + + @define-color secondary_fixed #cce8e5; + + @define-color secondary_fixed_dim #b0ccc9; + + @define-color shadow #000000; + + @define-color source_color #00312f; + + @define-color surface #0e1514; + + @define-color surface_bright #343a3a; + + @define-color surface_container #1a2120; + + @define-color surface_container_high #252b2b; + + @define-color surface_container_highest #2f3635; + + @define-color surface_container_low #161d1c; + + @define-color surface_container_lowest #090f0f; + + @define-color surface_dim #0e1514; + + @define-color surface_tint #80d5d0; + + @define-color surface_variant #3f4948; + + @define-color tertiary #b0c9e7; + + @define-color tertiary_container #314862; + + @define-color tertiary_fixed #d0e4ff; + + @define-color tertiary_fixed_dim #b0c9e7; + + @define-color yellow #d2c972; + + @define-color yellow_container #4e4800; + + @define-color yellow_source #ebdc0c; + + @define-color yellow_value #ebdc0c; + diff --git a/dot-config/waybar/scripts/sound-source.sh b/dot-config/waybar/scripts/sound-source.sh index a02f1536..fe080c7c 100755 --- a/dot-config/waybar/scripts/sound-source.sh +++ b/dot-config/waybar/scripts/sound-source.sh @@ -1,6 +1,6 @@ #!/bin/bash -sinks=$(pactl list short sinks | awk 'BEGIN {FS="\t"}; {print $2}' | fuzzel -d --config="$HOME"/.config/fuzzel/fuzzel-centered.ini ) +sinks=$(pactl list short sinks | awk 'BEGIN {FS="\t"}; {print $2}' | fuzzel -d --config="$HOME/.config/fuzzel/fuzzel-centered.ini" ) pactl set-default-sink "$sinks" diff --git a/dot-config/waybar/style.css b/dot-config/waybar/style.css index a83e8b45..70f2129c 100644 --- a/dot-config/waybar/style.css +++ b/dot-config/waybar/style.css @@ -1,12 +1,12 @@ /* kak: css:noai:ts=4:sw=4 */ /* ----------------------------------- import ----------------------------------- */ -@import "base16-colors.css"; +@import "matugen_waybar.css"; /* ----------------------------------- window ----------------------------------- */ * { font-family: "ZedMono NFP"; font-size: 12pt; - min-height: 7px; + min-height: 8px; font-weight: bold; padding: 0px; margin: 0px; @@ -15,7 +15,7 @@ /* ----------------------------------- waybar ----------------------------------- */ #waybar { border: none; - color: @base05; + color: @outline_variant; background-color: transparent; } @@ -28,20 +28,20 @@ margin-right: 10px; margin-top: 5px; margin-bottom: 0px; - border: 2px solid alpha(@base03, 0.95); - background: alpha(@base00, 0.50); - border-radius: 5px; + border: 1px solid alpha(@scrim, 1.00); + background: alpha(@surface, 0.666); + border-radius: 10px; } tooltip { - background: @base00; - border: 1px solid @base02; - border-radius: 4px; + background: alpha(@background, 0.85); + border: 1px solid @outline; + border-radius: 5px; } tooltip label { padding: 8px; - color: @base05; + color: @on_background; } /* ------------------------------------ workspaces begin ------------------------------ */ @@ -49,8 +49,8 @@ tooltip label { padding-left: 5px; padding-right: 5px; border-radius: 0px 0px 4px 4px; - background: alpha(@base01, 1.00); - border: 1px solid @base02; + background: alpha(@surface_container, 1.00); + border: 1px solid @scrim; border-radius: 5px 5px 5px 5px; margin-top: 2px; margin-left: 2px; @@ -60,9 +60,9 @@ tooltip label { #workspaces button { border-radius: 8px; - background: @base03; - color: @base05; - border: 1px solid @base03; + background: @surface; + color: @on_surface; + border: 1px solid @outline; padding: 0 8px; margin-top: 2px; margin-left: 1px; @@ -71,102 +71,45 @@ tooltip label { transition: all 0.3s ease; } +/* #workspaces button:hover { - background: alpha(@base07, 1.0); - color: @base00; + background: alpha(@container, 0.70); + color: @on_tertiary; } #workspaces button.focused:hover { - background: alpha(@base07, 0.7); } #workspaces button.active:hover { } - +*/ #workspaces button.focused, #workspaces button.active { border-radius: 8px; - background: @base0C; - border: 1px solid @base0C; + background: @tertiary; + border: 1px solid @outline; padding: 0 8px; - color: @base00; + color: @on_tertiary; transition: all 0.3s ease; } #workspaces button.urgent { border-radius: 8px; - background: @base0A; - border: 1px solid @base02; - color: @base00; + background: @error_container; + border: 0px solid @outline_variant; + color: @on_error_container; transition: all 0.3s ease; } - -#taskbar { - padding-left: 5px; - padding-right: 5px; - border-radius: 0px 0px 4px 4px; - background: alpha(@base01, 0.80); - border: 1px solid @base02; - border-radius: 5px 5px 5px 5px; - margin-top: 2px; - margin-left: 2px; - margin-right: 1px; - margin-bottom: 2px; -} - -#taskbar button { - border-radius: 16px; - background: @base03; - color: @base00; - border: 1px solid @base03; - padding: 0 8px; - margin-top: 2px; - margin-left: 1px; - margin-right: 1px; - margin-bottom: 2px; - transition: all 0.3s ease; -} - -#taskbar button:hover { - background: alpha(@base07, 1.0); -} - -#taskbar button.focused:hover, -#taskbar button.active:hover { - background: alpha(@base07, 0.7); - border-color: alpha(@base07, 0.9); -} - -#taskbar button.focused, -#taskbar button.active { - border-radius: 16px; - background: @base0C; - border: 1px solid @base0C; - padding: 0 8px; - color: @base00; - transition: all 0.3s ease; - -} - -#taskbar button.urgent { - border-radius: 16px; - background: @base0A; - border: 1px solid @base02; - color: @base00; - transition: all 0.3s ease; -} - - #window { padding-left: 10px; padding-right: 10px; - color: @base05; - background-color: alpha(@base01, 1.0); + color: @primary; + background-color: alpha(@surface_container, 1.0); margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base02; + border: none; border-radius: 5px 5px 5px 5px; margin-top: 2px; margin-left: 2px; @@ -187,64 +130,95 @@ window#waybar { /* ------------------------------------ workspaces end ------------------------------ */ -/* ------------------------------------ modules individual config ------------------------------- */ +/* ------------------------------------ launcher & powermenu config ------------------------------- */ #custom-launcher { + transition: all 0.3s ease; padding-left: 10px; padding-right: 10px; margin-top: 2px; margin-left: 2px; margin-right: 1px; margin-bottom: 2px; - color: @base00; - background: @base09; - border: 1px solid @base01; + color: @on_primary; + background: @primary; + border: none; border-radius: 8px 8px 8px 8px; } #custom-launcher:hover { - background-color: alpha(@base0A, 1.0); + background: alpha(@on_primary_container, 1.00); + color: @inverse_primary; } #custom-notification { + transition: all 0.3s ease; padding-left: 10px; padding-right: 10px; margin-top: 2px; margin-left: 1px; margin-right: 2px; margin-bottom: 2px; - color: @base00; - background: @base09; - border: 1px solid @base01; + color: @on_primary; + background: @primary; + border: none; border-radius: 8px 8px 8px 8px; } #custom-notification:hover { - background-color: alpha(@base0A, 1.0); + background: alpha(@on_primary_container, 1.00); + color: @inverse_primary; +} + +/* ------------------------------------ trayclock group begin ------------------------------ */ +#tray { + padding-left: 6px; + padding-right: 6px; + color: @surface; + background-color: alpha(@surface, 1.0); + margin-top: 2px; + margin-bottom: 2px; + border: none; + border-radius: 8px 0px 0px 8px; +} + +#clock { + font-weight: 500; + padding-left: 6px; + padding-right: 6px; + color: @on_surface; + background-color: alpha(@surface, 1.0); + margin-top: 2px; + margin-bottom: 2px; + border: none; + border-radius: 0px 8px 8px 0px; } -#mpd { +/* ------------------------------------ trayclock group end ------------------------------ */ + +/* ------------------------------------ other modules config ------------------------------- */ +#mpris { padding-left: 4px; padding-right: 4px; - color: @base0D; - background-color: alpha(@base0D, 0.1); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 4px 4px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; + border: 1px solid @scrim; border-radius: 8px 8px 8px 8px; } -#mpris { +#custom-mpris { padding-left: 4px; padding-right: 4px; - color: @base0D; - background-color: alpha(@base0D, 0.1); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 4px 4px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; + border: 1px solid @scrim; border-radius: 8px 8px 8px 8px; } @@ -252,12 +226,12 @@ window#waybar { font-weight: 500; padding-left: 6px; padding-right: 6px; - color: @base00; - background-color: alpha(@base0A, 0.9); + color: @surface; + background-color: alpha(@surface, 0.9); border-radius: 0px 0px 4px 4px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; + border: 1px solid @scrim; border-radius: 8px 8px 8px 8px; } @@ -265,26 +239,24 @@ window#waybar { #cpu { padding-left: 6px; padding-right: 6px; - color: @base0B; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 0px 4px; margin-top: 2px; margin-bottom: 2px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 8px 0px 0px 8px; } #custom-gpuusage { padding-left: 6px; padding-right: 6px; - color: @base0B; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 0px 0px 0px 0px; } @@ -295,12 +267,12 @@ window#waybar { #temperature#gpu { padding-left: 6px; padding-right: 6px; - color: @base0B; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 0px 0px 0px 0px; + border: none; } #temperature.critical, @@ -308,111 +280,65 @@ window#waybar { #temperature#chipset.critical, #temperature#vrm.critical, #temperature#gpu.critical { - padding-left: 6px; - padding-right: 6px; - color: @base08; - background-color: alpha(@base01, 1.0); - border-radius: 0px 0px 0px 0px; - margin-top: 2px; - margin-bottom: 2px; - border-top: none; - border-left: none; - border-right: none; - border-bottom: 1px solid; - border-color: alpha(@base08, 0.4); + color: @on_error; + background-color: alpha(@error, 1.0); } #memory { padding-left: 6px; padding-right: 6px; - color: @base0B; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 0px 8px 8px 0px; } /* ------------------------------------ sysmon group end ------------------------------ */ -/* ------------------------------------ trayclock group begin ------------------------------ */ -#tray { - padding-left: 6px; - padding-right: 6px; - color: @base00; - background-color: alpha(@base01, 1.0); - border-radius: 0px 0px 0px 4px; - margin-top: 2px; - margin-bottom: 2px; - margin-top: 2px; - margin-bottom: 2px; - border: 1px solid @base01; - border-radius: 8px 0px 0px 8px; -} - -#clock { - font-weight: 500; - padding-left: 6px; - padding-right: 6px; - color: @base05; - background-color: alpha(@base01, 1.0); - border-radius: 4px 4px 4px 0px; - margin-top: 2px; - margin-bottom: 2px; - margin-top: 2px; - margin-bottom: 2px; - border: 1px solid @base01; - border-radius: 0px 8px 8px 0px; -} - -/* ------------------------------------ trayclock group end ------------------------------ */ - /* ------------------------------------ display group begin ------------------------------ */ #idle_inhibitor { padding-left: 6px; padding-right: 2px; - color: @base0A; - background-color: alpha(@base01, 1.0); - border-radius: 0px 0px 0px 4px; + color: @on_surface; + background-color: alpha(@surface, 1.0); margin-top: 2px; margin-bottom: 2px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 8px 0px 0px 8px; + border: none; } -#custom-hyprsunset-temp, +#custom-hyprsunset-brightness, #custom-hyprsunset-gamma, #custom-gammarelay-temperature, #custom-gammarelay-gamma, #custom-gammarelay-brightness { padding-left: 4px; padding-right: 4px; - color: @base0A; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border-radius: 0px 0px 0px 0px; + border: none; margin-top: 2px; margin-bottom: 2px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; - border-radius: 0px 0px 0px 0px; } #language { padding-left: 2px; padding-right: 2px; - color: @base0A; - background-color: alpha(@base01, 1.0); - border-radius: 0px 0px 4px 0px; + color: @on_surface; + background-color: alpha(@surface, 1.0); margin-top: 2px; margin-bottom: 2px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 0px 8px 8px 0px; + border: none; } /* ------------------------------------ display group end ------------------------------ */ @@ -421,111 +347,90 @@ window#waybar { #wireplumber { padding-left: 6px; padding-right: 4px; - color: @base0C; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 4px 4px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 8px 0px 0px 8px; } #power-profiles-daemon { padding-left: 4px; padding-right: 6px; - color: @base0C; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 0px 8px 8px 0px; + border: none; } #network { padding-left: 4px; padding-right: 4px; - color: @base0C; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 4px 4px; margin-top: 2px; margin-bottom: 2px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 8px 8px 8px 8px; } #gamemode { padding-left: 6px; padding-right: 2px; - color: @base0C; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 0px 0px; margin-top: 2px; margin-bottom: 2px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; border-radius: 0px 0px 0px 0px; } #cava { padding-left: 4px; padding-right: 4px; - color: @base05; - background-color: alpha(@base01, 1.0); + color: @on_surface; + background-color: alpha(@surface, 1.0); border: none; border-radius: 0px 0px 4px 4px; margin-top: 2px; margin-bottom: 2px; - border: 1px solid @base01; - border-radius: 8px 8px 8px 8px; -} - -#custom-mpris { - padding-left: 4px; - padding-right: 4px; - color: @base0D; - background-color: alpha(@base01, 1.0); - border: none; - border-radius: 0px 0px 4px 4px; - margin-top: 2px; - margin-bottom: 2px; - border: 1px solid @base01; - border-radius: 8px 8px 8px 8px; -} - -#custom-powermenu { - padding-left: 4px; - padding-right: 4px; - color: @base0C; - background-color: alpha(@base01, 1.0); - border-radius: 0px 0px 4px 4px; - margin-top: 2px; - margin-bottom: 2px; - border: 1px solid @base01; border-radius: 8px 8px 8px 8px; } #custom-pipespacer { background: none; border: none; - color: @base04; + color: @fg; } -#window:hover, -#cpu:hover, -#custom-gpuusage:hover, #clock:hover, -#memory:hover, -#network:hover, +#cpu:hover, +#custom-gammarelay-brightness:hover, #custom-gammarelay-brightness:hover, #custom-gammarelay-gamma:hover, +#custom-gammarelay-gamma:hover, +#custom-gammarelay-temperature:hover, #custom-gammarelay-temperature:hover, +#custom-gpuusage:hover, +#custom-hyprsunset-gamma:hover, +#custom-hyprsunset-brightness:hover, +#custom-mpris:hover, +#custom-wallpaper:hover, +#idle_inhibitor:hover, #language:hover, +#memory:hover, +#network:hover, +#power-profiles-daemon:hover, #temperature#chipset.critical:hover, #temperature#chipset:hover, #temperature#cpu.critical:hover, @@ -536,9 +441,9 @@ window#waybar { #temperature#vrm:hover, #temperature.critical:hover, #temperature:hover, -#wireplumber:hover, -#custom-wallpaper:hover, -#idle_inhibitor:hover { - background-color: alpha(@base03, 1.0); +#window:hover, +#wireplumber:hover { + background-color: alpha(@inverse_on_surface, 1.0); + color: @inverse-surface; } diff --git a/dot-config/waybar/style.css.20250818 b/dot-config/waybar/style.css.20250818 new file mode 100644 index 00000000..22ae8a3d --- /dev/null +++ b/dot-config/waybar/style.css.20250818 @@ -0,0 +1,473 @@ +/* kak: css:noai:ts=4:sw=4 */ +/* ----------------------------------- import ----------------------------------- */ +@import "rootloops.sh.css"; + +/* ----------------------------------- window ----------------------------------- */ +* { + font-family: "ZedMono NFP"; + font-size: 12pt; + min-height: 8px; + font-weight: bold; + padding: 0px; + margin: 0px; +} + +/* ----------------------------------- waybar ----------------------------------- */ +#waybar { + border: none; + color: @bwhite; + background-color: transparent; +} + +#waybar>box { + padding-top: 0px; + padding-left: 0px; + padding-right: 0px; + padding-bottom: 0px; + margin-left: 10px; + margin-right: 10px; + margin-top: 5px; + margin-bottom: 0px; + border: 1px solid alpha(@bg, 1.00); + background: alpha(@bg, 0.666); + border-radius: 10px; +} + +tooltip { + background: alpha(@bg, 0.85); + border: 1px solid @black; + border-radius: 5px; +} + +tooltip label { + padding: 8px; + color: @fg; +} + +/* ------------------------------------ workspaces begin ------------------------------ */ +#workspaces { + padding-left: 5px; + padding-right: 5px; + border-radius: 0px 0px 4px 4px; + background: alpha(@black, 1.00); + border: 1px solid @black; + border-radius: 5px 5px 5px 5px; + margin-top: 2px; + margin-left: 2px; + margin-right: 1px; + margin-bottom: 2px; +} + +#workspaces button { + border-radius: 8px; + background: @black; + color: @fg; + border: 1px solid @black; + padding: 0 8px; + margin-top: 2px; + margin-left: 1px; + margin-right: 1px; + margin-bottom: 2px; + transition: all 0.3s ease; +} + +#workspaces button:hover { + background: alpha(@fg, 0.7); + color: @black; +} + +#workspaces button.focused:hover { +} + +#workspaces button.active:hover { +} + +#workspaces button.focused, +#workspaces button.active { + border-radius: 8px; + background: @white; + border: 1px solid @black; + padding: 0 8px; + color: @black; + transition: all 0.3s ease; + +} + +#workspaces button.urgent { + border-radius: 8px; + background: @byellow; + border: 0px solid @bblack; + color: @black; + transition: all 0.3s ease; +} + +#window { + padding-left: 10px; + padding-right: 10px; + color: @fg; + background-color: alpha(@black, 1.0); + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 5px 5px 5px 5px; + margin-top: 2px; + margin-left: 2px; + margin-right: 1px; + margin-bottom: 2px; +} + +window#waybar { + border-top: none; + border-left: none; + border-right: none; + border-bottom: none; + background-color: transparent; + transition-property: background-color; + transition-duration: 0.5s; + /*background: linear-gradient(1.0deg, rgba(21,21,21,1) 0%, rgba(21,21,21,1) 45%, rgba(32,32,32,0.3) 1.0%);*/ +} + +/* ------------------------------------ workspaces end ------------------------------ */ + +/* ------------------------------------ launcher & powermenu config ------------------------------- */ +#custom-launcher { + transition: all 0.3s ease; + padding-left: 10px; + padding-right: 10px; + margin-top: 2px; + margin-left: 2px; + margin-right: 1px; + margin-bottom: 2px; + color: @black; + background: @white; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +#custom-launcher:hover { + background: alpha(@bwhite, 0.9); + color: @black; +} + +#custom-notification { + transition: all 0.3s ease; + padding-left: 10px; + padding-right: 10px; + margin-top: 2px; + margin-left: 1px; + margin-right: 2px; + margin-bottom: 2px; + color: @black; + background: @white; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +#custom-notification:hover { + background: alpha(@bwhite, 0.9); + color: @black; +} + +/* ------------------------------------ other modules config ------------------------------- */ +#mpris { + padding-left: 4px; + padding-right: 4px; + color: @bblue; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 4px 4px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +#custom-mpris { + padding-left: 4px; + padding-right: 4px; + color: @bblue; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 4px 4px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +#submap { + font-weight: 500; + padding-left: 6px; + padding-right: 6px; + color: @black; + background-color: alpha(@byellow, 0.9); + border-radius: 0px 0px 4px 4px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +/* ------------------------------------ sysmon group begin ------------------------------ */ +#cpu { + padding-left: 6px; + padding-right: 6px; + color: @bgreen; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 0px 4px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 0px 0px 8px; +} + +#custom-gpuusage { + padding-left: 6px; + padding-right: 6px; + color: @bgreen; + background-color: alpha(@black, 1.0); + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 0px 0px 0px; +} + +#temperature, +#temperature#cpu, +#temperature#chipset, +#temperature#vrm, +#temperature#gpu { + padding-left: 6px; + padding-right: 6px; + color: @bgreen; + background-color: alpha(@black, 1.0); + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 0px 0px 0px; +} + +#temperature.critical, +#temperature#cpu.critical, +#temperature#chipset.critical, +#temperature#vrm.critical, +#temperature#gpu.critical { + padding-left: 6px; + padding-right: 6px; + color: @bred; + background-color: alpha(@black, 1.0); + border-radius: 0px 0px 0px 0px; + margin-top: 2px; + margin-bottom: 2px; + border-top: none; + border-left: none; + border-right: none; + border-bottom: 1px solid; + border-color: alpha(@bred, 0.4); +} + +#memory { + padding-left: 6px; + padding-right: 6px; + color: @bgreen; + background-color: alpha(@black, 1.0); + border: none; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 8px 8px 0px; +} + +/* ------------------------------------ sysmon group end ------------------------------ */ + +/* ------------------------------------ trayclock group begin ------------------------------ */ +#tray { + padding-left: 6px; + padding-right: 6px; + color: @black; + background-color: alpha(@black, 1.0); + border-radius: 0px 0px 0px 4px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 0px 0px 8px; +} + +#clock { + font-weight: 500; + padding-left: 6px; + padding-right: 6px; + color: @bwhite; + background-color: alpha(@black, 1.0); + border-radius: 4px 4px 4px 0px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 8px 8px 0px; +} + +/* ------------------------------------ trayclock group end ------------------------------ */ + +/* ------------------------------------ display group begin ------------------------------ */ +#idle_inhibitor { + padding-left: 6px; + padding-right: 2px; + color: @byellow; + background-color: alpha(@black, 1.0); + border-radius: 0px 0px 0px 4px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 0px 0px 8px; +} + +#custom-hyprsunset-brightness, +#custom-hyprsunset-gamma, +#custom-gammarelay-temperature, +#custom-gammarelay-gamma, +#custom-gammarelay-brightness { + padding-left: 4px; + padding-right: 4px; + color: @byellow; + background-color: alpha(@black, 1.0); + border-radius: 0px 0px 0px 0px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 0px 0px 0px; +} + +#language { + padding-left: 2px; + padding-right: 2px; + color: @byellow; + background-color: alpha(@black, 1.0); + border-radius: 0px 0px 4px 0px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 8px 8px 0px; +} + +/* ------------------------------------ display group end ------------------------------ */ + +/* ------------------------------------ modules bulk config ------------------------------ */ +#wireplumber { + padding-left: 6px; + padding-right: 4px; + color: @bcyan; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 4px 4px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 0px 0px 8px; +} + +#power-profiles-daemon { + padding-left: 4px; + padding-right: 6px; + color: @bcyan; + background-color: alpha(@black, 1.0); + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 8px 8px 0px; +} + +#network { + padding-left: 4px; + padding-right: 4px; + color: @bblue; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 4px 4px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +#gamemode { + padding-left: 6px; + padding-right: 2px; + color: @bcyan; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 0px 0px; + margin-top: 2px; + margin-bottom: 2px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 0px 0px 0px 0px; +} + +#cava { + padding-left: 4px; + padding-right: 4px; + color: @bwhite; + background-color: alpha(@black, 1.0); + border: none; + border-radius: 0px 0px 4px 4px; + margin-top: 2px; + margin-bottom: 2px; + border: 1px solid @black; + border-radius: 8px 8px 8px 8px; +} + +#custom-pipespacer { + background: none; + border: none; + color: @fg; +} + +#clock:hover, +#cpu:hover, +#custom-gammarelay-brightness:hover, +#custom-gammarelay-brightness:hover, +#custom-gammarelay-gamma:hover, +#custom-gammarelay-gamma:hover, +#custom-gammarelay-temperature:hover, +#custom-gammarelay-temperature:hover, +#custom-gpuusage:hover, +#custom-hyprsunset-gamma:hover, +#custom-hyprsunset-brightness:hover, +#custom-mpris:hover, +#custom-wallpaper:hover, +#idle_inhibitor:hover, +#language:hover, +#memory:hover, +#network:hover, +#power-profiles-daemon:hover, +#temperature#chipset.critical:hover, +#temperature#chipset:hover, +#temperature#cpu.critical:hover, +#temperature#cpu:hover, +#temperature#gpu.critical:hover, +#temperature#gpu:hover, +#temperature#vrm.critical:hover, +#temperature#vrm:hover, +#temperature.critical:hover, +#temperature:hover, +#window:hover, +#wireplumber:hover { + background-color: alpha(@bblack, 1.0); +} + -- 2.51.2