aggregate

waybar/config.jsonc

@@ -77,7 +77,7 @@
     "tooltip": true,
   },
   "memory": {
-    "format": "{}% 󰍛",
+    "format": "  {}%",
   },
   "temperature": {
     // "thermal-zone": 2,

waybar/style.css

@@ -14,30 +14,108 @@
 }
 
 @define-color button @color1;
-@define-color button-hover @color6;
+@define-color button-hover @color3;
-@define-color button-active @color4;
+@define-color button-active @color2;
 
 /*
 * General
 */
-@import url("./styles/module-groups.css");
-@import url("./styles/modules.css");
 @import url("./styles/waybar.css");
 
+/*
+ * Workspaces
+ */
+#workspaces {
+  border-radius: 9999px;
+  background: @button;
+}
+
+#workspaces button {
+  padding: 0 9px 0 4px;
+  box-shadow: none;
+  border: none;
+  border-radius: 9999px;
+  color: @color7;
+  font-size: 24px;
+}
+
+#workspaces button.active {
+  color: @button-active;
+}
+
+#workspaces button:hover {
+  background: transparent;
+  color: @button-hover;
+}
+
+#workspaces button.focused {
+  color: @button-active;
+}
+
+#workspaces button.urgent {
+  color: #bf616a;
+}
+
 /*
 * Modules 
 */
-@import url("./styles/modules/os.css");
+#cpu,
-@import url("./styles/modules/clock.css");
+#memory,
-@import url("./styles/modules/cpu.css");
+#network,
-@import url("./styles/modules/idle.css");
+#temperature {
-@import url("./styles/modules/memory.css");
+  color: @color7;
-@import url("./styles/modules/network.css");
+}
-@import url("./styles/modules/mpris.css");
+
-@import url("./styles/modules/swaync.css");
+#clock,
-@import url("./styles/modules/swww.css");
+#idle_inhibitor,
-@import url("./styles/modules/temperature.css");
+#mpris,
-@import url("./styles/modules/tray.css");
+#custom-swaync,
-@import url("./styles/modules/window.css");
+#wireplumber,
-@import url("./styles/modules/wireplumber.css");
+#custom-swww,
-@import url("./styles/modules/workspaces.css");
+#custom-os {
+  background: @button;
+}
+
+#clock:hover,
+#idle_inhibitor:hover,
+#mpris:hover,
+#custom-swaync:hover,
+#wireplumber:hover,
+#custom-swww:hover,
+#custom-os:hover {
+  background: @button-hover;
+}
+
+#idle_inhibitor.activated {
+  background-color: @button-active;
+}
+
+#idle_inhibitor {
+  padding: 0 16px 0 12px;
+}
+
+#mpris.spotify {
+  background-color: #1db954;
+}
+
+#network.disconnected {
+  color: #f53c3c;
+}
+
+#temperature.critical {
+  color: #bf616a;
+}
+
+#wireplumber.muted {
+  color: #f53c3c;
+}
+
+#custom-swww {
+  padding: 0 16px 0 8px;
+  font-size: 18px;
+}
+
+#custom-os {
+  padding: 0 12px 0 6px;
+  font-size: 24px;
+}

waybar/styles/module-groups.css

@@ -1,14 +0,0 @@
-.modules-left {
-  padding: 0 3px;
-  margin-left: 10px;
-}
-
-.modules-center {
-  padding: 0 3px;
-}
-
-.modules-right {
-  padding: 0 3px;
-  margin-right: 10px;
-}
-

waybar/styles/modules.css

@@ -1,13 +0,0 @@
-.module {
-  border-radius: 9999px;
-  margin: 8px 0;
-}
-
-label.module {
-  padding: 0 10px;
-  /* box-shadow: inset 0 -2px; */
-}
-
-box.module {
-  padding: 0 10px;
-}

waybar/styles/modules/clock.css

@@ -1,7 +0,0 @@
-#clock {
-  background: @button;
-}
-
-#clock:hover {
-  background: @button-hover;
-}

waybar/styles/modules/cpu.css

@@ -1,2 +0,0 @@
-#cpu {
-}

waybar/styles/modules/idle.css

@@ -1,12 +0,0 @@
-#idle_inhibitor {
-  padding: 0 16px 0 12px;
-  background-color: @button;
-}
-
-#idle_inhibitor:hover {
-  background-color: @button-hover;
-}
-
-#idle_inhibitor.activated {
-  background-color: @button-active;
-}

waybar/styles/modules/memory.css

@@ -1,2 +0,0 @@
-#memory {
-}

waybar/styles/modules/mpris.css

@@ -1,11 +0,0 @@
-#mpris {
-  background-color: @button;
-}
-
-#mpris:hover {
-  background-color: @button-hover;
-}
-
-#mpris.spotify {
-  background-color: #1db954;
-}

waybar/styles/modules/network.css

@@ -1,6 +0,0 @@
-#network {
-}
-
-#network.disconnected {
-  color: #f53c3c;
-}

waybar/styles/modules/os.css

@@ -1,9 +0,0 @@
-#custom-os {
-  padding: 0 12px 0 6px;
-  font-size: 24px;
-  background: @button;
-}
-
-#custom-os:hover {
-  background: @button-hover;
-}

waybar/styles/modules/swaync.css

@@ -1,7 +0,0 @@
-#custom-swaync {
-  background-color: @button;
-}
-
-#custom-swaync:hover {
-  background-color: @button-hover;
-}

waybar/styles/modules/swww.css

@@ -1,9 +0,0 @@
-#custom-swww {
-  padding: 0 16px 0 8px;
-  font-size: 18px;
-  background-color: @button;
-}
-
-#custom-swww:hover {
-  background-color: @button-hover;
-}

waybar/styles/modules/temperature.css

@@ -1,6 +0,0 @@
-#temperature {
-}
-
-#temperature.critical {
-  color: #bf616a;
-}

waybar/styles/modules/tray.css

@@ -1,22 +0,0 @@
-#tray {
-  background-color: @button;
-  padding: 0 10px;
-}
-
-#tray > .passive {
-  -gtk-icon-effect: dim;
-}
-
-#tray > .needs-attention {
-  -gtk-icon-effect: highlight;
-  background-color: #eb4d4b;
-}
-
-#tray button {
-  border-radius: 0px;
-  box-shadow: inset 0 -3px transparent;
-}
-
-#tray button:hover {
-  box-shadow: inset 0 -3px #5e81ac;
-}

waybar/styles/modules/window.css

@@ -1,15 +0,0 @@
-#window {
-  border-radius: 20px;
-  padding-left: 10px;
-  padding-right: 10px;
-}
-
-window#waybar.kitty {
-  background-color: transparent;
-  color: #ffffff;
-}
-
-/* make window module transparent when no windows present */
-window#waybar.empty #window {
-  background-color: transparent;
-}

waybar/styles/modules/wireplumber.css

@@ -1,7 +0,0 @@
-#wireplumber {
-  background: @button;
-}
-
-#wireplumber.muted {
-  color: #f53c3c;
-}

waybar/styles/modules/workspaces.css

@@ -1,30 +0,0 @@
-#workspaces {
-  padding: 0;
-  /* border: 2px solid @color4;  */
-}
-
-#workspaces button {
-  padding: 0 9px 0 4px;
-  box-shadow: none;
-  border: none;
-  border-radius: 9999px;
-  color: @button;
-  font-size: 24px;
-}
-
-#workspaces button.active {
-  color: @button-active;
-}
-
-#workspaces button:hover {
-  background: transparent;
-  color: @button-hover;
-}
-
-#workspaces button.focused {
-  color: @button-active;
-}
-
-#workspaces button.urgent {
-  color: #bf616a;
-}

waybar/styles/waybar.css

@@ -21,3 +21,31 @@ window#waybar.hidden {
     opacity: 1;
   }
 }
+
+.module {
+  border-radius: 9999px;
+  margin: 8px 0;
+}
+
+label.module {
+  padding: 0 10px;
+  /* box-shadow: inset 0 -2px; */
+}
+
+box.module {
+  padding: 0 10px;
+}
+
+.modules-left {
+  padding: 0 3px;
+  margin-left: 10px;
+}
+
+.modules-center {
+  padding: 0 3px;
+}
+
+.modules-right {
+  padding: 0 3px;
+  margin-right: 10px;
+}