From 3841c491b082d0433d55853495aa3ce320fe7831 Mon Sep 17 00:00:00 2001
From: kirreen <kirreen.forsaeus@gmail.com>
Date: Fri, 11 Oct 2024 21:24:15 +0200
Subject: [PATCH] now the waybar looks nice on lappy :)

---
 home/.config/waybar/config.jsonc |  6 ++--
 home/.config/waybar/style.css    | 55 +++++++++++++++++---------------
 2 files changed, 33 insertions(+), 28 deletions(-)

diff --git a/home/.config/waybar/config.jsonc b/home/.config/waybar/config.jsonc
index e871891..cf1cd7d 100644
--- a/home/.config/waybar/config.jsonc
+++ b/home/.config/waybar/config.jsonc
@@ -3,7 +3,7 @@
     // "layer": "top", // Waybar at top layer
     // "position": "bottom", // Waybar position (top|bottom|left|right)
     "height": 30, // Waybar height (to be removed for auto height)
-    // "width": 1280, // Waybar width
+    // "width": 90%, // Waybar width
     "spacing": 4, // Gaps between modules (4px)
     // Choose the order of the modules
     "modules-left": [
@@ -29,8 +29,8 @@
         "sway/language",
         "battery",
         "battery#bat2",
-        "clock",
-        "tray"
+        "tray",
+        "clock"
     ],
     // Modules configuration
     "hyprland/workspaces": {
diff --git a/home/.config/waybar/style.css b/home/.config/waybar/style.css
index 47f6579..d96bb17 100644
--- a/home/.config/waybar/style.css
+++ b/home/.config/waybar/style.css
@@ -10,12 +10,13 @@
 
 * {
 	border: none;
-	border-radius: 0;
+	border-radius: 24px;
 	font-family: Nerd Font Hack;
 	font-size: 14px;
-	min-height: 24px;
+	min-height: 16px;
+	background-color: rgba(40, 42, 46, 0.86);
 }
-
+/*
 window#waybar {
 	background: transparent;
 }
@@ -23,9 +24,9 @@ window#waybar {
 window#waybar.hidden {
 	opacity: 0.2;
 }
-
+*/
 #window {
-    margin-top: 8px;
+    margin-top: 0px;
     padding-left: 16px;
     padding-right: 16px;
 	border-radius: 26px;
@@ -35,7 +36,7 @@ window#waybar.hidden {
 	background: #282a36;
     */
     color: white;
-	background: #585858;
+	background-color: rgba(88, 88, 88, 0.0);
 }
 
 window#waybar.termite #window,
@@ -47,10 +48,10 @@ window#waybar.PCSX2 #window {
 }
 
 #workspaces {
-	margin-top: 8px;
-	margin-left: 12px;
+	margin-top: 0px;
+	margin-left: 2px;
 	margin-bottom: 0;
-	border-radius: 26px;
+	/*border-radius: 26px;*/
 	background: #282a36;
 	transition: none;
 }
@@ -63,18 +64,20 @@ window#waybar.PCSX2 #window {
 }
 
 #workspaces button.active {
-	color: #9aedfe;
+	/*color: #9aedfe;*/
+	color: #d65d0e;
+	/*background-color: #231531;*/
 }
 
 #workspaces button:hover {
 	transition: none;
 	box-shadow: inherit;
 	text-shadow: inherit;
-	color: #ff79c6;
+	color: #9aedfe;
 }
 
 #mpd {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	padding-left: 16px;
 	padding-right: 16px;
@@ -93,7 +96,7 @@ window#waybar.PCSX2 #window {
 }
 
 #network {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	padding-left: 16px;
 	padding-right: 16px;
@@ -101,11 +104,11 @@ window#waybar.PCSX2 #window {
 	border-radius: 26px;
 	transition: none;
 	color: #4d4d4d;
-	background: #bd93f9;
+	background: #282A2E;
 }
 
 #pulseaudio {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	padding-left: 16px;
 	padding-right: 16px;
@@ -113,11 +116,11 @@ window#waybar.PCSX2 #window {
 	border-radius: 26px;
 	transition: none;
 	color: #4d4d4d;
-	background: #9aedfe;
+	background: #282A2E;
 }
 
 #temperature {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	padding-left: 16px;
 	padding-right: 16px;
@@ -125,11 +128,11 @@ window#waybar.PCSX2 #window {
 	border-radius: 26px;
 	transition: none;
 	color: #4d4d4d;
-	background: #5af78e;
+	background: #282A2E;
 }
 
 #cpu {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	padding-left: 16px;
 	padding-right: 16px;
@@ -137,11 +140,11 @@ window#waybar.PCSX2 #window {
 	border-radius: 26px;
 	transition: none;
 	color: #4d4d4d;
-	background: #f1fa8c;
+	background: #282A2E;
 }
 
 #memory {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	padding-left: 16px;
 	padding-right: 16px;
@@ -149,11 +152,11 @@ window#waybar.PCSX2 #window {
 	border-radius: 26px;
 	transition: none;
 	color: #4d4d4d;
-	background: #ff6e67;
+	background: #282A2E;
 }
 
 #clock {
-	margin-top: 8px;
+	margin-top: 0px;
 	margin-left: 8px;
 	margin-right: 12px;
 	padding-left: 16px;
@@ -161,6 +164,8 @@ window#waybar.PCSX2 #window {
 	margin-bottom: 0;
 	border-radius: 26px;
 	transition: none;
-	color: #f8f8f2;
-	background: #282a36;
+	color: #d65d0e;
+	font-size: 16px;
+	font-weight: bold;
+	background: #282A2E;
 }