Update waybar config

waybar/.config/waybar/config.jsonc

@@ -16,16 +16,14 @@
     "position": "top",
 
     // If height property would be not present, it'd be calculated dynamically
-    "height": 30,
+    "height": 22,
 
     "modules-left": [
-        "sway/workspaces",
-        "sway/mode"
+        "sway/window"
     ],
     "modules-center": [
-        //    "sway/window"
-        "clock#date",
-        "clock#time"
+        "sway/workspaces",
+        "sway/mode"
     ],
     "modules-right": [
         "network",
@@ -35,7 +33,9 @@
         "temperature",
         "custom/keyboard-layout",
         "battery",
-        "tray"
+        "tray",
+        "clock#date",
+        "clock#time"
     ],
 
 
@@ -124,7 +124,7 @@
     "sway/workspaces": {
         "all-outputs": false,
         "disable-scroll": true,
-        "format": "{icon} {name}",
+        "format": "{name}",
         "format-icons": {
             "1:www": "龜", // Icon: firefox-browser
             "2:mail": "", // Icon: mail
@@ -132,8 +132,8 @@
             "4:terminals": "", // Icon: terminal
             "5:portal": "", // Icon: terminal
             "urgent": "",
-            "focused": "",
-            "default": ""
+            "focused": "",
+            "default": ""
         }
     },
 

waybar/.config/waybar/style.css

@@ -85,7 +85,6 @@
 
 /* Each module */
 #battery,
-#clock,
 #cpu,
 #custom-keyboard-layout,
 #memory,
@@ -94,8 +93,19 @@
 #pulseaudio,
 #temperature,
 #tray {
-    padding-left: 10px;
-    padding-right: 10px;
+  padding-right: 14px;
+}
+
+#clock.date {
+  padding-right: 8px;
+}
+
+#clock.time {
+  padding-right: 8px;
+}
+
+#window {
+  padding-left: 8px;
 }
 
 
@@ -203,9 +213,6 @@
 }
 
 #workspaces button {
-    border-top: 2px solid transparent;
-    /* To compensate for the top border and still have vertical centering */
-    padding-bottom: 2px;
   padding-left: 10px;
   padding-right: 10px;
   color: @subtext1;
@@ -214,18 +221,15 @@
 #workspaces button:hover {
   color: @text;
   background: @surface2;
-    border-color: @text;
   text-shadow: none; /* Remove predefined text-shadow */
   transition: none; /* Disable predefined animations */
 }
 
 #workspaces button.focused {
-    border-color: @surface2;
   color: @text;
   background-color: @surface0;
 }
 
 #workspaces button.urgent {
-    border-color: @red;
   color: @red;
 }