From 7b5c339e9363187e249fa2f6eadbb295b0e8c6ff Mon Sep 17 00:00:00 2001
From: Jas Singh <jaskiratpal.singh@outlook.com>
Date: Mon, 24 Mar 2025 22:46:58 -0700
Subject: [PATCH] Fix: styling side-effects are no longer visible on monitors
 with no bars. (#864)

---
 src/components/bar/index.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/bar/index.tsx b/src/components/bar/index.tsx
index 115fd43..eb9aea5 100644
--- a/src/components/bar/index.tsx
+++ b/src/components/bar/index.tsx
@@ -79,6 +79,11 @@ export const Bar = (() => {
             return !isLayoutEmpty(foundLayout);
         });
 
+        const computeClassName = bind(layouts).as(() => {
+            const foundLayout = getLayoutForMonitor(hyprlandMonitor, layouts.get());
+            return !isLayoutEmpty(foundLayout) ? `bar` : '';
+        });
+
         const computeAnchor = bind(location).as((loc) => {
             if (loc === 'bottom') {
                 return Astal.WindowAnchor.BOTTOM | Astal.WindowAnchor.LEFT | Astal.WindowAnchor.RIGHT;
@@ -132,7 +137,7 @@ export const Bar = (() => {
                 inhibit={bind(idleInhibit)}
                 name={`bar-${hyprlandMonitor}`}
                 namespace={`bar-${hyprlandMonitor}`}
-                className={'bar'}
+                className={computeClassName}
                 application={App}
                 monitor={monitor}
                 visible={computeVisibility}