From b56eef9c002395112c7d9d3088c3c203ef4d2537 Mon Sep 17 00:00:00 2001 From: nevaforget Date: Wed, 26 Nov 2025 13:05:34 +0100 Subject: [PATCH] add niri modules to waybar styles --- home/config/waybar/style.css | 195 ++++++++++++++++++++++++----------- 1 file changed, 136 insertions(+), 59 deletions(-) diff --git a/home/config/waybar/style.css b/home/config/waybar/style.css index 4b0a5bf..8fa6a1f 100644 --- a/home/config/waybar/style.css +++ b/home/config/waybar/style.css @@ -1,25 +1,29 @@ * { border: none; - font-family: "JetBrainsMono Nerd Font", sans-serif; + font-family: "Ubuntu Nerd Font", sans-serif; font-size: 13px; - color:alpha(@theme_text_color, 0.8); + color: alpha(@theme_text_color, 0.8); } + window#waybar { - background: transparent; - + /*background: transparent;*/ + background: alpha(@theme_selected_fg_color, 0.2); } + /*-----main groups----*/ .modules-right { margin: 0; - padding-left:5px; - padding-right:0; + padding-left: 5px; + padding-right: 0; border-radius: 0; } + .modules-center { margin: 0; border-radius: 0; } + .modules-left { margin: 0 0 0 5px; /* background-color:alpha(@theme_selected_bg_color, 0.15); @@ -57,16 +61,21 @@ window#waybar { #custom-vpn.connected, #power-profiles-daemon, #privacy, -#gamemode{ - padding:0px 10px; +#gamemode, +#taskbar, +#window { + padding: 0px 10px; } /** * GROUPS **/ -#sys, #stats, #net, #sound { +#sys, +#stats, +#net, +#sound { margin: 0; - color:alpha(@theme_text_color, 0.5); + color: alpha(@theme_text_color, 0.5); } @@ -74,17 +83,20 @@ window#waybar { * SYS **/ #sys { - padding:0 0px 0 10px; + padding: 0 0px 0 10px; } + #custom-power { - margin-left:0; - margin-right:0; - padding-left:0; + margin-left: 0; + margin-right: 0; + padding-left: 0; } + #user { - padding-left:0; - font-weight:bold; + padding-left: 0; + font-weight: bold; } + #custom-weather { padding-left: 5px; } @@ -99,11 +111,11 @@ window#waybar { border-radius: 4px; padding: 0px 8px 0px 8px; margin: 8px 0px 8px 0px; - background-color:alpha(@theme_selected_bg_color, 0.1); + background-color: alpha(@theme_selected_bg_color, 0.1); } #custom-notification { - padding-right:0 + padding-right: 0 } /** @@ -114,10 +126,12 @@ window#waybar { background-color: transparent; padding-left: 0; } + #pulseaudio-slider { padding-left: 10px; padding-right: 10px; } + #pulseaudio-slider slider { min-height: 0px; min-width: 0px; @@ -126,14 +140,16 @@ window#waybar { border: none; box-shadow: none; background-color: @insensitive_bg_color; - border:1px solid alpha(@theme_selected_bg_color, 0.1); + border: 1px solid alpha(@theme_selected_bg_color, 0.1); } + #pulseaudio-slider trough { min-height: 4px; min-width: 80px; border-radius: 5px; background-color: alpha(@theme_selected_bg_color, 0.3); } + #pulseaudio-slider highlight { min-width: 5px; @@ -142,7 +158,7 @@ window#waybar { } #custom-updates { - padding-right:5px; + padding-right: 5px; padding-left: 5px; } @@ -151,45 +167,91 @@ window#waybar { * MISC **/ #mpris { - border-radius:0; + border-radius: 0; margin: 8px 10px 8px 0px; - padding:0 10px; + padding: 0 10px; } /** * WORKSPACES **/ -#workspaces { - padding:0; +/*#workspaces { + padding: 0; border-radius: 0 } + #workspaces button { padding: 0px 10px 0px 8px; margin: 8px 2px 8px 0px; - outline:none; + outline: none; border-radius: 4px; - background-color:alpha(@theme_selected_bg_color, 0.05); + background-color: alpha(@theme_selected_bg_color, 0.05); } + #workspaces button:last-child { margin-right: 0; } -#workspaces button.empty, #workspaces button.active.empty { - color:inherit; + +#workspaces button.empty, +#workspaces button.active.empty { + color: inherit; padding: 0px 0px 0px 8px; -} -#workspaces button.active { +} + +#workspaces button.active { background-color: transparent; padding: 0px 10px 0px 8px; } -#workspaces button.visible { - background-color:alpha(@theme_selected_bg_color, 0.1); +#workspaces button.visible { + background-color: alpha(@theme_selected_bg_color, 0.1); } + #workspaces button.urgent { color: #cc3436; } -#workspaces button:hover { - background-color:alpha(@theme_selected_bg_color, 0.05); + +#workspaces button:hover { + background-color: alpha(@theme_selected_bg_color, 0.05); + box-shadow: inherit; + text-shadow: inherit; +}*/ + +#workspaces { + padding: 0; + border-radius: 0; + +} + +#workspaces button { + margin: 8px 2px 8px 0px; + padding: 0; + outline: none; + border-radius: 4px; + background-color: alpha(@theme_selected_bg_color, 0.05); +} + +#workspaces button:last-child { + margin-right: 0; +} + +#workspaces button.empty, +#workspaces button.active.empty { + color: inherit; +} + +#workspaces button.active {} + +#workspaces button.visible { + background-color: alpha(@theme_selected_bg_color, 0.1); +} + +#workspaces button.urgent { + color: #cc3436; +} + +#workspaces button:hover { + background-color: alpha(@theme_selected_bg_color, 0.05); box-shadow: inherit; text-shadow: inherit; } @@ -201,27 +263,31 @@ window#waybar { #pulseaudio.muted { color: #cc3436; } + #battery.charging { color: #2dcc36; } + #battery.warning:not(.charging) { - color: #e6e600; + color: #e6e600; } + #battery.critical:not(.charging) { color: #cc3436; } + #temperature.critical { color: #cc3436; } #idle_inhibitor.activated { - color:alpha(@theme_selected_bg_color, 0.9); + color: alpha(@theme_selected_bg_color, 0.9); } #indicators { - padding-right:5px; - padding-left:5px; - border-radius:0; + padding-right: 5px; + padding-left: 5px; + border-radius: 0; } @@ -229,43 +295,54 @@ window#waybar { * TASKBAR **/ #taskbar { - font-size:8px; - margin:0; + font-size: 8px; + margin: 0 0 0 5px; opacity: 1; - padding:0; + padding: 0; border-radius: 0; } + #taskbar.empty { - opacity:0; + opacity: 0; } + #taskbar button { - padding:3px 10px 3px 10px; - transition:100ms border ease-in-out; + padding: 3px 10px 3px 10px; + transition: 100ms border ease-in-out; border-radius: 0; - font-size:8px; + font-size: 8px; } #taskbar button:not(:first-child) { - border-radius:0px; + border-radius: 0px; } -#taskbar button:first-child { -} -#taskbar button:last-child { - -} -#taskbar button:last-child:first-child { - -} +#taskbar button:first-child {} + +#taskbar button:last-child {} + +#taskbar button:last-child:first-child {} + #taskbar button.empty { - opacity:0; + opacity: 0; } #taskbar button:hover { - background-color:alpha(@theme_selected_bg_color, 0.1); + background-color: alpha(@theme_selected_bg_color, 0.1); } + #taskbar button.active { - background-color:alpha(@theme_selected_bg_color, 0.05); - opacity:1; + background-color: alpha(@theme_selected_bg_color, 0.05); + opacity: 1; +} + + +menu { + border-radius: 4px; +} + +menuitem { + border-radius: 4px; + } \ No newline at end of file