From 242894c9f2dcc49743e02f5472c7f5be7f6bd597 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fred=20Lef=C3=A9v=C3=A8re-Laoide?=
 <90181748+FredLL-Avaiga@users.noreply.github.com>
Date: Wed, 18 Dec 2024 16:47:22 +0100
Subject: [PATCH] normalize components height (#2354)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

resolves #2305

Co-authored-by: Fred Lefévère-Laoide <Fred.Lefevere-Laoide@Taipy.io>
---
 frontend/taipy-gui/public/stylekit/controls/button.css        | 4 ++++
 frontend/taipy-gui/public/stylekit/controls/file_download.css | 3 +++
 frontend/taipy-gui/public/stylekit/controls/file_selector.css | 3 +++
 frontend/taipy-gui/public/stylekit/controls/selector.css      | 2 +-
 frontend/taipy-gui/public/stylekit/controls/slider.css        | 1 +
 frontend/taipy-gui/public/stylekit/controls/status.css        | 1 +
 frontend/taipy-gui/public/stylekit/controls/toggle.css        | 3 +++
 7 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/frontend/taipy-gui/public/stylekit/controls/button.css b/frontend/taipy-gui/public/stylekit/controls/button.css
index 9bf4d9a171..f2b1e56a6e 100644
--- a/frontend/taipy-gui/public/stylekit/controls/button.css
+++ b/frontend/taipy-gui/public/stylekit/controls/button.css
@@ -21,6 +21,10 @@
               MODIFIER CLASSES
 **************************************************/
 
+.taipy-button {
+    margin: 4px 0;
+}
+
 /* fullwidth :  */
 .taipy-button.fullwidth {
     display: flex;
diff --git a/frontend/taipy-gui/public/stylekit/controls/file_download.css b/frontend/taipy-gui/public/stylekit/controls/file_download.css
index 54085e4b4c..903818c918 100644
--- a/frontend/taipy-gui/public/stylekit/controls/file_download.css
+++ b/frontend/taipy-gui/public/stylekit/controls/file_download.css
@@ -20,6 +20,9 @@
 /*************************************************
               MODIFIER CLASSES
 **************************************************/
+.taipy-file-download>button {
+    margin: 4px 0;
+}
 
 /* fullwidth :  */
 .taipy-file-download.fullwidth button {
diff --git a/frontend/taipy-gui/public/stylekit/controls/file_selector.css b/frontend/taipy-gui/public/stylekit/controls/file_selector.css
index 08515985d8..d99757cdb8 100644
--- a/frontend/taipy-gui/public/stylekit/controls/file_selector.css
+++ b/frontend/taipy-gui/public/stylekit/controls/file_selector.css
@@ -20,6 +20,9 @@
 /*************************************************
               MODIFIER CLASSES
 **************************************************/
+.taipy-file-selector .MuiButtonBase-root {
+    margin: 4px 0;
+}
 
 /* fullwidth :  */
 .taipy-file-selector.fullwidth [role='button'] {
diff --git a/frontend/taipy-gui/public/stylekit/controls/selector.css b/frontend/taipy-gui/public/stylekit/controls/selector.css
index 0e56ecdc7d..cdb929aca4 100644
--- a/frontend/taipy-gui/public/stylekit/controls/selector.css
+++ b/frontend/taipy-gui/public/stylekit/controls/selector.css
@@ -22,7 +22,7 @@
 **************************************************/
 
 .taipy-selector {
-  margin: 0;
+  margin: 4px 0;
 }
 
 
diff --git a/frontend/taipy-gui/public/stylekit/controls/slider.css b/frontend/taipy-gui/public/stylekit/controls/slider.css
index 4bba39e40a..e978642689 100644
--- a/frontend/taipy-gui/public/stylekit/controls/slider.css
+++ b/frontend/taipy-gui/public/stylekit/controls/slider.css
@@ -26,4 +26,5 @@
     max-width: 100%;
     min-height: 48px;
     align-items: center;
+    margin: 4px 0;
 }
diff --git a/frontend/taipy-gui/public/stylekit/controls/status.css b/frontend/taipy-gui/public/stylekit/controls/status.css
index c0e1d73381..3643303e77 100644
--- a/frontend/taipy-gui/public/stylekit/controls/status.css
+++ b/frontend/taipy-gui/public/stylekit/controls/status.css
@@ -25,4 +25,5 @@
     display: inline-flex;
     min-height: 48px;
     padding-top: 0.5em;
+    margin: 4px 0;
 }
diff --git a/frontend/taipy-gui/public/stylekit/controls/toggle.css b/frontend/taipy-gui/public/stylekit/controls/toggle.css
index 7ff2b1afe9..2a75e9ee5e 100644
--- a/frontend/taipy-gui/public/stylekit/controls/toggle.css
+++ b/frontend/taipy-gui/public/stylekit/controls/toggle.css
@@ -36,6 +36,9 @@
 /*************************************************
               MODIFIER CLASSES
 **************************************************/
+.taipy-toggle {
+    margin: 4px 0;
+}
 
 /* relative : Reset the theme toggle position to fit page flow */
 .taipy-toggle.relative {