From bfdd28c638f89edcf3fc4b520ed72327420b1dae Mon Sep 17 00:00:00 2001
From: Maneesh Shukla <shuklamaneesh24@gmail.com>
Date: Tue, 12 Aug 2025 22:41:34 +0530
Subject: [PATCH] banners: Hide empty banner-action-buttons using CSS.

Previously, the action buttons container was only hidden via
conditional rendering in the template. This commit adds a CSS-based
approach to also hide the container when it becomes empty, using the
:empty pseudo-class. This ensures correct behavior if we later have a
class of banners where the buttons area is dynamically updated, and
buttons are removed dynamically.
---
 web/styles/banners.css              | 4 ++++
 web/templates/components/banner.hbs | 3 +++
 2 files changed, 7 insertions(+)

diff --git a/web/styles/banners.css b/web/styles/banners.css
index f245e6852c..1662794fdb 100644
--- a/web/styles/banners.css
+++ b/web/styles/banners.css
@@ -63,6 +63,10 @@
     gap: 0.5em; /* 8px at 16px/1em */
 }
 
+.banner-action-buttons:empty {
+    display: none;
+}
+
 .banner-close-button {
     display: flex;
     grid-area: banner-close-button;
diff --git a/web/templates/components/banner.hbs b/web/templates/components/banner.hbs
index e8062fd429..59d4f40ebc 100644
--- a/web/templates/components/banner.hbs
+++ b/web/templates/components/banner.hbs
@@ -9,6 +9,8 @@
         </span>
         {{#if buttons}}
             <span class="banner-action-buttons">
+                {{!-- squash whitespace so :empty selector works when no buttons --}}
+                {{~!-- squash whitespace --~}}
                 {{#each buttons}}
                     {{#if this.intent}}
                         {{> action_button .}}
@@ -16,6 +18,7 @@
                         {{> action_button . intent=../intent}}
                     {{/if}}
                 {{/each}}
+                {{~!-- squash whitespace --~}}
             </span>
         {{/if}}
     </span>