Improve hyprland and waybar configs

.config/waybar/config

@@ -2,7 +2,7 @@
 	"layer": "top",
 	"position": "bottom",
 	"height": 24,
-	"spacing": 4,
+	"spacing": 6,
 	"modules-left": [
 		"wlr/workspaces"
 	],
@@ -10,11 +10,10 @@
 	],
 	"modules-right": [
 		"network",
-		"cpu",
 		"temperature",
+		"cpu",
 		"memory",
 		"custom/pacman",
-		"idle_inhibitor",
 		"custom/weather",
 		"clock",
 		"tray"
@@ -57,9 +56,22 @@
 		"max-length": 128
 	},
 	"clock": {
-        "format": "{:%Y-%m-%d %H:%M:%S}",
+		"interval": 1,
+        "format": " {:%Y-%m-%d %H:%M:%S}",
         "tooltip-format": "<big>{:%Y %B}</big>\n<tt><small>{calendar}</small></tt>"
 	},
+	"cpu": {
+		"format": " {usage}%"
+	},
+	"memory": {
+		"format": " {percentage}%"
+	},
+	"network": {
+		"format": " {ipaddr}"
+	},
+	"temperature": {
+		"format": " {temperatureC}°C"
+	},
 	"tray": {
 		"spacing": 4
 	},

.config/waybar/style.css

@@ -1,36 +1,58 @@
 @import url("./colors.css");
+
 * {
     border: none;
-    border-radius: 0;
-    font-family: Iosevka;
-    font-size: 11pt;
+	border-radius: 0;
+	
+    font-family: "JetBrains Mono", monospace;
+    font-size: 10pt;
     min-height: 0;
 }
+
 window#waybar {
-    opacity: 1;
     background: @background-darker;
     color: @foreground;
-    border-bottom: 2px solid @background;
 }
+
+
+#clock {
+	border-bottom: solid 2px @yellow;
+}
+
+#cpu {
+	border-bottom: solid 2px @purple;
+}
+
+#memory {
+	border-bottom: solid 2px @pink;
+}
+
+#network {
+	border-bottom: solid 2px @green;
+}
+
+#temperature {
+	border-bottom: solid 2px @red;
+}
+
 #workspaces button {
-    padding: 0 10px;
-    background: @background;
-    color: @foreground;
+	background: none;
+	border-bottom: solid 2px @background;
 }
 #workspaces button:hover {
-    box-shadow: inherit;
-    text-shadow: inherit;
-    background-image: linear-gradient(0deg, @selection, @background-darker);
+	border-bottom: solid 2px @selection;
 }
 #workspaces button.active,
 #workspaces button.focused,
 #workspaces button.visible {
-    background-image: linear-gradient(0deg, @purple, @selection);
+	border-bottom: solid 2px @purple;
 }
-#taskbar button.active {
-    background-image: linear-gradient(0deg, @pruple, @background-darker);
+
+
+#custom-weather {
+	border-bottom: solid 2px @green;
 }
-#clock {
-    padding: 0 4px;
-    background: @background;
+
+#custom-pacman {
+	border-bottom: solid 2px @cyan;
 }