change waybar theme

czrd · May 15, 2024 · 763104c · 763104c
1 parent 2eb7746
commit 763104c
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 12 deletions.
diff --git a/waybar/.config/waybar/config b/waybar/.config/waybar/config
@@ -1,8 +1,10 @@
 {
     "layer": "top",
     "position": "top",
-    "height": 30,
-    "width": 1920,
+    "height": 40,
+    "margin-left": 16,
+    "margin-right": 16,
+    "margin-top": 10,
     "spacing": 2,
     "modules-left": [
         "custom/powermenu",
@@ -104,16 +106,15 @@
         "format": "{icon}",
         "format-icons": {
             "active": "",
-            "default": ""
+            "default": "",
         },
         "on-click": "activate",
         "sort-by-number": true,
         "all-outputs": true
     },
     "custom/powermenu": {
         "format": "",
-        "tooltip": false,
-        "on-click": "~/.config/rofi/scripts/powermenu"
+        "tooltip": false
     },
     "custom/recording": {
       "tooltip": false,

diff --git a/waybar/.config/waybar/style.css b/waybar/.config/waybar/style.css
@@ -26,18 +26,16 @@ tooltip label {
 }
 
 window#waybar {
-  color: #D7DCDD;
-  background-color: rgba(0, 0, 0, 0.4);
+  color: #3E3D3F;
+  background-color: #E1E4DC;
+  border-radius: 80px;
+  border: 1px solid #C0C3BD;
 }
 
 window#waybar.hidden {
   opacity: 0.2;
 }
 
-button {
-  color: #D7DCDD;
-}
-
 /* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */
 button:hover {
   box-shadow: none;
@@ -50,6 +48,11 @@ button:hover {
   box-shadow: none;
   text-shadow: none;
   border: none;
+  color: #C0C3BD;
+}
+
+#workspaces button.active {
+  color: #3E3D3F;
 }
 
 #workspaces button.urgent {
@@ -70,13 +73,19 @@ button:hover {
   padding: 0 10px;
 }
 
+#tray {
+  background-color: #D1D3CC;
+  margin: 4px 10px;
+  border-radius: 15px;
+}
+
 #custom-recording {
   font-size: 20px;
   color: #f53c3c;
 }
 
 #custom-powermenu {
-  font-size: 25px;
+  font-size: 24px;
   margin-right: 10px;
 }