treewide: update waybar

config/home-manager/programs/waybar/default.nix

@@ -1,34 +1,33 @@
 {
   pkgs,
   lib,
-  osConfig,
-  config,
   ...
-}: let
+}: {
-  inherit (lib) getExe mkMerge mkIf;
-  inherit (builtins) readFile;
-in {
   programs.waybar = {
     enable = true;
     systemd.enable = true;
-    style = readFile ./style.css;
     settings = {
-      mainBar = mkMerge [
+      mainBar = {
-        {
         layer = "top";
         position = "top";
-          height = 30;
 
-          margin-top = 6;
+        modules-left = [
-          margin-left = 6;
+          "hyprland/window"
-          margin-right = 6;
+          "pulseaudio"
-          margin-bottom = 0;
+          "cpu"
+          "memory"
+          "idle_inhibitor"
+        ];
 
-          modules-left = ["hyprland/workspaces" "hyprland/window"];
+        modules-center = ["hyprland/workspaces"];
-          modules-center = ["group/clock"];
+        modules-right = [
-          modules-right =
+          "custom/swaync"
-            ["tray" "group/status" "group/power"]
+          "custom/power"
-            ++ lib.optional config.services.swaync.enable "custom/swaync";
+          "network"
+          "battery"
+          "tray"
+          "clock"
+        ];
 
         tray = {
           icon-size = 16;
@@ -89,95 +88,90 @@ in {
           };
         };
 
-          "group/status" = {
-            orientation = "inherit";
-            modules = [
-              "pulseaudio"
-              "power-profiles-daemon"
-              "network"
-              "battery"
-            ];
-          };
-
-          "group/power" = {
-            orientation = "inherit";
-            modules = [
-              "custom/power"
-            ];
-          };
-
-          "group/clock" = {
-            orientation = "inherit";
-            modules = [
-              "clock#time"
-              "clock#date"
-            ];
-          };
-
         "custom/power" = {
           format = "";
           tooltip = false;
-            on-click = getExe pkgs.wlogout;
+          on-click = lib.getExe pkgs.wlogout;
         };
 
-          "clock#date" = {
+        "memory" = {
-            format = "{:%D}";
+          interval = 5;
-            tooltip-format = "<tt><big>{calendar}</big></tt>";
+          format = " {}%";
+          tooltip = true;
         };
 
-          "clock#time" = {
+        "cpu" = {
-            format = "{:%H:%M}";
+          interval = 5;
-            tooltip-format = "{tz_list}";
+          format = " {usage:2}%";
-            timezones = [
+          tooltip = true;
-              osConfig.time.timeZone
-              "US/Eastern"
-            ];
         };
 
-          network = {
+        "idle_inhibitor" = {
-            interface = "wlp1s0";
+          format = "{icon}";
-            format = "{ifname}";
+          format-icons = {
-            format-wifi = "{icon}";
+            activated = "";
-            format-ethernet = "{ipaddr}/{cidr} 󰊗";
+            deactivated = "";
-            format-disconnected = "";
+          };
-            tooltip-format = "{ifname} via {gwaddr} 󰊗";
+          tooltip = "true";
-            tooltip-format-wifi = "{essid} ({signalStrength}%)";
+        };
-            tooltip-format-ethernet = "{ifname} ";
+
-            tooltip-format-disconnected = "Disconnected";
+        "clock" = {
-            max-length = 50;
+          format = " {:L%H:%M}";
+          tooltip = true;
+          tooltip-format = "<big>{:%A, %d.%B %Y }</big>\n<tt><small>{calendar}</small></tt>";
+        };
+
+        "network" = {
           format-icons = [
+            "󰤯"
             "󰤟"
             "󰤢"
             "󰤥"
             "󰤨"
           ];
+          format-ethernet = " {bandwidthDownOctets}";
+          format-wifi = "{icon} {signalStrength}%";
+          format-disconnected = "󰤮";
+          tooltip = false;
         };
-        }
+
-        (mkIf osConfig.programs.niri.enable {
+        "hyprland/window" = {
-          "niri/window" = {
+          max-length = 22;
-            icon = true;
+          separate-outputs = false;
         };
-        })
+
-        (mkIf config.services.swaync.enable {
+        "hyprland/workspaces" = {
+          format = "{name}";
+          format-icons = {
+            default = " ";
+            active = " ";
+            urgent = " ";
+          };
+          on-scroll-up = "hyprctl dispatch workspace e+1";
+          on-scroll-down = "hyprctl dispatch workspace e-1";
+        };
+
         "custom/swaync" = {
+          tooltip = false;
           format = "<big>{icon}</big>";
           format-icons = {
-              notification = "󱥁";
+            none = "";
-              none = "󰍥";
+            notification = "<span foreground='red'><sup></sup></span>";
-              dnd-notification = "󱅮";
+            dnd-notification = "<span foreground='red'><sup></sup></span>";
-              dnd-none = "󱅯";
+            dnd-none = "";
+            inhibited-notification = "<span foreground='red'><sup></sup></span>";
+            inhibited-none = "";
+            dnd-inhibited-notification = "<span foreground='red'><sup></sup></span>";
+            dnd-inhibited-none = "";
           };
-            max-length = 3;
           return-type = "json";
           escape = true;
           exec-if = "which ${pkgs.swaynotificationcenter}/bin/swaync-client";
           exec = "${pkgs.swaynotificationcenter}/bin/swaync-client --subscribe-waybar";
           on-click = "${pkgs.swaynotificationcenter}/bin/swaync-client --toggle-panel --skip-wait";
           on-click-middle = "${pkgs.swaynotificationcenter}/bin/swaync-client --toggle-dnd --skip-wait";
-            tooltip-format = "󰵚  {} notification(s)";
         };
-        })
+      };
-      ];
     };
   };
   home.packages = [

config/home-manager/programs/waybar/style.css

@@ -1,91 +0,0 @@
-* {
-  /* `otf-font-awesome` is required to be installed for icons */
-  border: none;
-  border-radius: 0px;
-  min-height: 0;
-}
-
-window#waybar {
-  border-radius: 2em;
-  font-family: "Symbols Nerd Font", Inter, sans-serif;
-  font-size: 16px;
-  font-style: normal;
-  background: alpha(
-    @base00,
-    0.9999999
-  ); /* niri issue workaround, thanks https://github.com/oatmealine/nix-config/blob/bfdddd2cb36ef659bcddc28e0dbb542b6db8b3bc/modules/desktop/themes/catppuccin/waybar.css#L14 */
-  color: @base05;
-}
-
-#workspaces,
-.modules-right box {
-  background: @base02;
-  padding: 0.15em 0.25em;
-  border-radius: 1em;
-  margin: 0 0.25em;
-}
-
-#workspaces {
-  padding: 0;
-  background: @base02;
-}
-
-#workspaces button:nth-child(1) {
-  border-top-left-radius: 1em;
-  border-bottom-left-radius: 1em;
-}
-#workspaces button:nth-last-child(1) {
-  border-top-right-radius: 1em;
-  border-bottom-right-radius: 1em;
-}
-
-#workspaces button {
-  padding: 0 0.5em;
-  background-color: transparent;
-}
-
-#workspaces button:hover {
-  background: rgba(255, 255, 255, 0.1);
-  box-shadow: none;
-}
-
-#workspaces button.active {
-  background: @base0D;
-  color: @base02;
-}
-
-#workspaces button.urgent {
-  background: @base08;
-}
-
-#window {
-  margin-left: 1em;
-}
-
-.modules-left,
-.modules-right {
-  margin: 0.4em 0.5em;
-}
-
-#battery,
-#clock,
-#network,
-#pulseaudio,
-#tray,
-#power-profiles-daemon {
-  padding: 0 0.5em;
-}
-
-.modules-left,
-.modules-right {
-  margin: 0.4em 0.5em;
-}
-
-#custom-power {
-  padding: 0 1.2em;
-  color: @base08;
-}
-
-#custom-swaync {
-  padding: 0 1.2em;
-}

shared/nixosModules/style/modules/waybar.nix

@@ -1,15 +1,96 @@
 {
   lib,
-  lib',
   config,
   ...
 }: let
   cfg = config.local.style;
+  betterTransition = "all 0.3s cubic-bezier(.55,-0.68,.48,1.682)";
 in {
   config.home-manager.sharedModules = lib.mkIf cfg.enable [
     {
-      programs.waybar.style =
+      programs.waybar.style = ''
-        lib'.generateGtkColors lib cfg.scheme.palette;
+        * {
+          font-family: "0xProto Nerd Font";
+          font-size: 16px;
+          border-radius: 0px;
+          border: none;
+          min-height: 0px;
+        }
+        window#waybar {
+          background: rgba(0,0,0,0);
+        }
+        #workspaces {
+          color: ${cfg.scheme.palette.base00};
+          background: ${cfg.scheme.palette.base01};
+          margin: 4px 4px;
+          padding: 5px 5px;
+          border-radius: 16px;
+        }
+        #workspaces button {
+          font-weight: bold;
+          padding: 0px 5px;
+          margin: 0px 3px;
+          border-radius: 16px;
+          color: ${cfg.scheme.palette.base00};
+          background: linear-gradient(45deg, ${cfg.scheme.palette.base08}, ${cfg.scheme.palette.base0D});
+          opacity: 0.5;
+          transition: ${betterTransition};
+        }
+        #workspaces button.active {
+          font-weight: bold;
+          padding: 0px 5px;
+          margin: 0px 3px;
+          border-radius: 16px;
+          color: ${cfg.scheme.palette.base00};
+          background: linear-gradient(45deg, ${cfg.scheme.palette.base08}, ${cfg.scheme.palette.base0D});
+          transition: ${betterTransition};
+          opacity: 1.0;
+          min-width: 40px;
+        }
+        #workspaces button:hover {
+          font-weight: bold;
+          border-radius: 16px;
+          color: ${cfg.scheme.palette.base00};
+          background: linear-gradient(45deg, ${cfg.scheme.palette.base08}, ${cfg.scheme.palette.base0D});
+          opacity: 0.8;
+          transition: ${betterTransition};
+        }
+        tooltip {
+          background: ${cfg.scheme.palette.base00};
+          border: 1px solid ${cfg.scheme.palette.base08};
+          border-radius: 12px;
+        }
+        tooltip label {
+          color: ${cfg.scheme.palette.base08};
+        }
+        #window, #pulseaudio, #cpu, #memory, #idle_inhibitor {
+          font-weight: bold;
+          margin: 4px 0px;
+          margin-left: 7px;
+          padding: 0px 18px;
+          background: ${cfg.scheme.palette.base00};
+          color: ${cfg.scheme.palette.base05};
+          border-radius: 24px 10px 24px 10px;
+        }
+        #network, #battery,
+        #custom-swaync, #tray, #custom-power {
+          font-weight: bold;
+          background: ${cfg.scheme.palette.base00};
+          color: ${cfg.scheme.palette.base05};
+          margin: 4px 0px;
+          margin-right: 7px;
+          border-radius: 10px 24px 10px 24px;
+          padding: 0px 18px;
+        }
+        #clock {
+          font-weight: bold;
+          color: ${cfg.scheme.palette.base00};
+          background: linear-gradient(90deg, ${cfg.scheme.palette.base0E}, ${cfg.scheme.palette.base0C});
+          margin: 0px;
+          padding: 0px 15px 0px 30px;
+          border-radius: 0px 0px 0px 40px;
+        }
+      '';
     }
   ];
 }