Hyprland waybar and begin styling

users/daniel/configs/desktop/waybar/config.json

@@ -22,9 +22,20 @@
         "format-icons": ["", ""]
     },
     "wlr/workspaces": {
-        "format": "{icon}",
         "on-scroll-up": "hyprctl dispatch workspace e+1",
-        "on-scroll-down": "hyprctl dispatch workspace e-1"
+        "on-scroll-down": "hyprctl dispatch workspace e-1",
+        "on-click": "activate",
+        "format": "{icon}",
+        "format-icons": {
+            "1": "",
+            "2": "",
+            "3": "",
+            "4": "",
+            "5": "",
+            "urgent": "",
+            "active": "",
+            "default": ""
+        }
     },
     "clock": {
         "format-alt": "{:%a, %d. %b  %H:%M}"

users/daniel/configs/desktop/waybar/default.nix

@@ -7,8 +7,12 @@
 }: {
   programs.waybar = {
     enable = true;
+    package = pkgs.waybar-hyprland;
     settings = {
       main = lib.importJSON ./config.json;
     };
+    style = ./style.css;
   };
+
+  home.file.".config/waybar/macchiato.css".source = ./macchiato.css;
 }

users/daniel/configs/desktop/waybar/macchiato.css

@@ -0,0 +1,37 @@
+/*
+*
+* Catppuccin Mocha palette
+* Maintainer: rubyowo
+*
+*/
+
+@define-color base   #24273a;
+@define-color mantle #1e2030;
+@define-color crust  #181926;
+
+@define-color text     #cad3f5;
+@define-color subtext0 #a5adcb;
+@define-color subtext1 #b8c0e0;
+
+@define-color surface0 #363a4f;
+@define-color surface1 #494d64;
+@define-color surface2 #5b6078;
+
+@define-color overlay0 #6e738d;
+@define-color overlay1 #8087a2;
+@define-color overlay2 #939ab7;
+
+@define-color blue      #8aadf4;
+@define-color lavender  #b7bdf8;
+@define-color sapphire  #7dc4e4;
+@define-color sky       #91d7e3;
+@define-color teal      #8bd5ca;
+@define-color green     #a6da95;
+@define-color yellow    #eed49f;
+@define-color peach     #f5a97f;
+@define-color maroon    #ee99a0;
+@define-color red       #ed8796;
+@define-color mauve     #c6a0f6;
+@define-color pink      #f5bde6;
+@define-color flamingo  #f0c6c6;
+@define-color rosewater #f4dbd6;

users/daniel/configs/desktop/waybar/style.css

@@ -0,0 +1,10 @@
+@import "macchiato.css";
+
+window#waybar {
+  background: @base;
+}
+
+#workspaces button.active {
+  color: @green;
+  background: @surface2;
+}