Prevent invisible cards from taking up space. Ref #41

Savjee · Nov 27, 2022 · f99929e · f99929e
1 parent dde2fc0
commit f99929e
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/src/button-text-card.ts b/src/button-text-card.ts
@@ -141,7 +141,13 @@ export class BoilerplateCard extends LitElement {
     // Render JS templates
     this.evaluateJsTemplates();
 
-    if (!this._inEditMode() && this._renderedConfig.hide_condition === true) {
+
+    // When card should not be visible, explicitly hide the card by setting
+    // the display type to none. This avoids padding issues with cards below it.
+    const invisible = !this._inEditMode() && this._renderedConfig.hide_condition === true;
+    this.style.setProperty("display", invisible ? "none" : "");
+
+    if (invisible) {
       return html``;
     }