From f99929ec0a2a20442fd574b2b4c808c86c678948 Mon Sep 17 00:00:00 2001
From: Xavier Decuyper <hi@savjee.be>
Date: Sun, 27 Nov 2022 18:19:45 +0100
Subject: [PATCH] Prevent invisible cards from taking up space. Ref #41

---
 src/button-text-card.ts | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/button-text-card.ts b/src/button-text-card.ts
index caca800..c5d75a2 100644
--- 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``;
     }