more style related changes

home-manager/dotfiles/waybar/config.jsonc

@@ -1,16 +1,23 @@
 {
   "layer": "top",
   "modules-left": ["sway/workspaces", "sway/mode"],
-  "modules-center": [ ],
-  "modules-right": ["mpris", "wireplumber","cpu", "bluetooth", "network", "clock", "privacy"],
+  "modules-center": [],
+  "modules-right": [
+    "wireplumber",
+    "cpu",
+    "bluetooth",
+    "network",
+    "clock",
+    "privacy"
+  ],
   "clock": {
-      "format-alt": "{:%a, %d. %b  %H:%M}"
+    "format-alt": "{:%a, %d. %b  %H:%M}"
   },
   "wireplumber": {
-      "format": "{volume}% ",
-      "format-muted": "",
-      "max-volume": 120,
-      "scroll-step": 0.2
+    "format": "{volume}% ",
+    "format-muted": "",
+    "max-volume": 120,
+    "scroll-step": 0.2
   },
   "privacy": {
     "icon-spacing": 4,
@@ -40,19 +47,39 @@
   "network": {
     "interface": "wlp3s0",
     "format": "{ifname}",
-    "format-wifi": "{essid} ({signalStrength}%)  ",
-    "format-ethernet": "{ipaddr}/{cidr} 󰊗",
+    "format-wifi": " ",
+    "format-ethernet": "󰈀",
     "format-disconnected": "", //An empty format will hide the module.
-    "tooltip-format": "{ifname} via {gwaddr} 󰊗",
+    "tooltip-format": "{ifname} via {gwaddr} 󰈀",
     "tooltip-format-wifi": "{essid} ({signalStrength}%)  ",
     "tooltip-format-ethernet": "{ifname}  ",
     "tooltip-format-disconnected": "Disconnected",
     "max-length": 50
-  }, 
+  },
   "bluetooth": {
     "format": "",
     "format-disabled": "",
     "format-connected": ""
-  }
+  },
 
+  "custom/notification": {
+    "tooltip": false,
+    "format": "{} {icon}",
+    "format-icons": {
+      "notification": "<span foreground='red'><sup></sup></span>",
+      "none": "",
+      "dnd-notification": "<span foreground='red'><sup></sup></span>",
+      "dnd-none": "",
+      "inhibited-notification": "<span foreground='red'><sup></sup></span>",
+      "inhibited-none": "",
+      "dnd-inhibited-notification": "<span foreground='red'><sup></sup></span>",
+      "dnd-inhibited-none": ""
+    },
+    "return-type": "json",
+    "exec-if": "which swaync-client",
+    "exec": "swaync-client -swb",
+    "on-click": "swaync-client -t -sw",
+    "on-click-right": "swaync-client -d -sw",
+    "escape": true
+  }
 }

home-manager/dotfiles/waybar/style.css

@@ -1,3 +1,7 @@
+:root {
+  --primary-color: #7b002c;
+}
+
 * {
   font-family: "CodeNewRoman Nerd Font";
   font-weight: bold;
@@ -6,24 +10,27 @@
 }
 
 window#waybar {
+  margin: 12px 24px;
   background-color: #fff;
-
+  border: solid 2px var(--primary-color);
+  min-height: 14px; /* set waybar's height to 14px */
+  font-size: 14px; /* set only the font size to be bigger, which in turn will adjust the height of other elements */
+  border-radius: 12px;
 }
 
-#clock, #battery, #cpu, #wireplumber, #bluetooth {
+#clock,
+#battery,
+#cpu,
+#wireplumber,
+#bluetooth {
   padding: 0 12px;
 }
 
 #workspaces button.focused {
-    border-bottom: solid 2px #7b002c;
-    border-radius: 0;
+  border-bottom: solid 2px var(--primary-color);
+  border-radius: 0;
 }
 
 #workspaces {
   padding: 4px 0;
 }
-
-window#waybar {
-  min-height: 14px; /* set waybar's height to 18px */
-  font-size: 14px; /* set only the font size to be bigger, which in turn will adjust the height of other elements */
-}