paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-04 05:53:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

banners: Hide empty banner-action-buttons using CSS.

Browse Source 
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.
This commit is contained in:
Maneesh Shukla
2025-08-12 22:41:34 +05:30
committed by Tim Abbott
parent 3f6520e82a
commit bfdd28c638
2 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/styles/banners.css
View File

@@ -63,6 +63,10 @@
gap: 0.5em; /* 8px at 16px/1em */ gap: 0.5em; /* 8px at 16px/1em */
} }
.banner-action-buttons:empty {
display: none;
}
.banner-close-button { .banner-close-button {
display: flex; display: flex;
grid-area: banner-close-button; grid-area: banner-close-button;

3
web/templates/components/banner.hbs
View File

@@ -9,6 +9,8 @@
</span> </span>
{{#if buttons}} {{#if buttons}}
<span class="banner-action-buttons"> <span class="banner-action-buttons">
{{!-- squash whitespace so :empty selector works when no buttons --}}
{{~!-- squash whitespace --~}}
{{#each buttons}} {{#each buttons}}
{{#if this.intent}} {{#if this.intent}}
{{> action_button .}} {{> action_button .}}
@@ -16,6 +18,7 @@
{{> action_button . intent=../intent}} {{> action_button . intent=../intent}}
{{/if}} {{/if}}
{{/each}} {{/each}}
{{~!-- squash whitespace --~}}
</span> </span>
{{/if}} {{/if}}
</span> </span>