From 09bcea3ffd413d504d7a3a3cf0a2ea79eaa9201d Mon Sep 17 00:00:00 2001
From: Kiarokh Moattar <kiarokh@icloud.com>
Date: Thu, 13 Jun 2024 10:58:46 +0200
Subject: [PATCH] fix(table): prevent rendering rows with very short height

The table component dynamically adds inline styles
such as `height` to its rows and cells. The height is
added in `px`, and is calculated based on the content
of the cells. In some scenarios where the cells have no
content or hold web-components that load with delay,
after the table is rendered, the dynamic inlined `height`
styles used to be calculated very strangely, causing the
rows and cells to be very short height. This change will
prevent these things, by applying a proper default `min-height`.
---
 src/components/table/table.scss | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/components/table/table.scss b/src/components/table/table.scss
index c23135ea7b..bca0c88113 100644
--- a/src/components/table/table.scss
+++ b/src/components/table/table.scss
@@ -99,6 +99,7 @@ $table--limel-table--row-selector: 1;
 
 .tabulator-row {
     transition: background-color 0.2s ease;
+    min-height: 2.25rem;
 
     &:hover {
         transition: background-color 0.1s ease;
@@ -121,6 +122,8 @@ $table--limel-table--row-selector: 1;
 
         display: inline-flex;
         align-items: center;
+        min-height: inherit;
+
         &[style*='text-align: right;'] {
             justify-content: flex-end;
         }