feat: improved taskbar;

refactor: hyprland blur

waybar/config_bottom.jsonc

@@ -47,8 +47,8 @@
     "wlr/taskbar": {
         "all-outputs": false,
         "format": "{icon}",
-        "icon-size": 25,
-        "icon-theme": "Retro Art - Red Kolya",
+        "icon-size": 24,
+        "icon-theme": "GreyStone",
         "tooltip-format": "{title}",
         "on-click": "activate",
         "on-click-middle": "close",
@@ -78,7 +78,8 @@
             "s3": 30,
             "s4": 50,
             "s5": 70
-        }
+        },
+        "on-click": "kitty btop"
     },
     "memory": {
         "format": "{icon}",
@@ -94,7 +95,8 @@
             "s4": 70
         },
         "tooltip-format": "{used:0.1f}GiB used",
-        "tooltip": true
+        "tooltip": true,
+        "on-click": "kitty btop"
     },
     "temperature": {
         "format": "{icon}",
@@ -103,7 +105,8 @@
           "󰄰", "󰄰", "󰄰", "󰄰", "󰄰", "󰪞", "󰪟", "󰪠", "󰪡", "󰪢", "󰪣", "󰪤", "󰪥"
         ],
         "warning-threshold": 60,
-        "critical-threshold": 80
+        "critical-threshold": 80,
+        "on-click": "kitty btop"
     },
     "mpd": {
         "password": "kapuchinamusica",

waybar/config_top.jsonc

@@ -117,7 +117,8 @@
         "format-alt": "{time} {icon}",
         // "format-good": "", // An empty format will hide the module
         "format-icons": ["󰂎", "", "", "󰁽", "", "󰁿", "", "󰂁", "󰂂"],
-        "tooltip-format": "{capacity}%, draws {power:2.1f}W, time is {time}"
+        "tooltip-format": "{capacity}%, draws {power:2.1f}W, time is {time}",
+        "on-click": "gnome-power-statistics"
     },
     "network": {
         "format-wifi": "{icon}",
@@ -127,7 +128,8 @@
         "format-disconnected": "󰤫",
         "format-icons": [
           "󰤯", "󰤟", "󰤢", "󰤥", "󰤨"
-        ]
+        ],
+        "on-click": "kitty nmtui-connect"
     },
     "pulseaudio": {
         // "scroll-step": 1, // %, can be a float

waybar/style/colors.css

@@ -1,3 +1,4 @@
+/* Normal view */
 @define-color bg-panel rgba(28, 28, 28, 0.81);
 @define-color text-secondary rgba(86, 86, 86, 0.81);
 @define-color bg-opaque rgba(23, 28, 39, 0.8);

waybar/style/style_bottom.css

@@ -60,7 +60,7 @@ window#waybar.chromium {
 #scratchpad {
   padding: 0 10px;
   color: @text-primary;
-  transition: color 0.3s ease, text-shadow 0.3s ease, background 0.3s ease;
+  transition: color 0.3s ease, text-shadow 0.3s ease, background 0.3s ease, padding 0.3s ease;
 }
 
 /* --------------------------------------------------------------------------
@@ -151,7 +151,7 @@ window#waybar.chromium {
 /* --------------------------------------------------------------------------
    SIDE PANEL GROUPS
    -------------------------------------------------------------------------- */
-.modules-left, .modules-center, .modules-right {
+.modules-left, .modules-right {
   /* Layout & Box Model */
   border: 1px solid @border-color;
   border-radius: 12px;
@@ -165,6 +165,17 @@ window#waybar.chromium {
   /* transition-duration: 0.5s; */
 }
 
+.modules-center {
+    background: linear-gradient(to right, 
+        alpha(#000000, 0) 0%, 
+        alpha(@bg-panel, 1) 20%, 
+        alpha(@bg-panel, 1) 80%, 
+        alpha(#000000, 0) 100%
+        );
+
+    padding: 0 20px;
+}
+
 .modules-left {
 }
 
@@ -223,10 +234,16 @@ window#waybar.chromium {
 }
 
 #taskbar button.active {
-    background: radial-gradient(circle, alpha(@accent, 1) 0%, alpha(@accent, 1) 50%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 25, 0) 100%);
+    background: radial-gradient(circle, alpha(@accent, 1) 0%, alpha(@accent, 1) 30%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 100%);
     transition: color 0.3s, box-shadow 0.3s, background 0.3s;
 }
 
+#taskbar button.active image {
+    min-width: 24px;
+    min-height: 24px;
+    padding: 0 5px;
+}
+
 /* POMODORO STATES */
 #custom-pomodoro.work {
   color: @accent;