From f80f0592f74d2e4ee7691c4b27ef56cd4cfbeac2 Mon Sep 17 00:00:00 2001
From: Lu Yu <nluyu@amazon.com>
Date: Tue, 23 Apr 2024 11:22:37 -0700
Subject: [PATCH] Fix style for mobile view (#6617)

Signed-off-by: Lu Yu <nluyu@amazon.com>
---
 .../data_source_aggregated_view.scss                 | 12 +++++++++++-
 .../data_source_selectable.scss                      | 11 +++++++++++
 .../data_source_view/data_source_view.scss           | 11 +++++++++++
 3 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/src/plugins/data_source_management/public/components/data_source_aggregated_view/data_source_aggregated_view.scss b/src/plugins/data_source_management/public/components/data_source_aggregated_view/data_source_aggregated_view.scss
index 0c10d76c6bd8..62f6239424aa 100644
--- a/src/plugins/data_source_management/public/components/data_source_aggregated_view/data_source_aggregated_view.scss
+++ b/src/plugins/data_source_management/public/components/data_source_aggregated_view/data_source_aggregated_view.scss
@@ -11,10 +11,20 @@
 
   .euiSelectableListItem__content {
     cursor: default;
+
+
+  .euiSelectableListItem__text {
+    max-height: 100%; 
+  }
   }
-  /* stylelint-enable */
 
   .dataSourceAggregatedViewOuiFlexGroup {
+    .euiFlexItem {
+      max-width: fit-content;
+    }
+
+      /* stylelint-enable */
+
     .dataSourceAggregatedViewOuiFlexItem {
       color: grey;
       text-overflow: ellipsis;
diff --git a/src/plugins/data_source_management/public/components/data_source_selectable/data_source_selectable.scss b/src/plugins/data_source_management/public/components/data_source_selectable/data_source_selectable.scss
index 4bc7296e3647..fc0e2775bc43 100644
--- a/src/plugins/data_source_management/public/components/data_source_selectable/data_source_selectable.scss
+++ b/src/plugins/data_source_management/public/components/data_source_selectable/data_source_selectable.scss
@@ -1,12 +1,23 @@
 .dataSourceSelectableOuiPanel {
   width: 300px;
 
+  /* stylelint-disable */
+  .euiSelectableListItem__text {
+    max-height: 100%;
+  }
+
   .dataSourceSelectableOuiFlexGroup {
+    .euiFlexItem {
+      max-width: fit-content;
+    }
+    /* stylelint-enable */
+
     .dataSourceSelectableOuiFlexItem {
       text-overflow: ellipsis;
       overflow: hidden;
       white-space: nowrap;
       display: inline-block;
+      max-width: fit-content;
     }
   }
 }
diff --git a/src/plugins/data_source_management/public/components/data_source_view/data_source_view.scss b/src/plugins/data_source_management/public/components/data_source_view/data_source_view.scss
index 03235cd38537..3a91bd6bbe7d 100644
--- a/src/plugins/data_source_management/public/components/data_source_view/data_source_view.scss
+++ b/src/plugins/data_source_management/public/components/data_source_view/data_source_view.scss
@@ -1,8 +1,19 @@
 .dataSourceViewOuiPanel {
   width: 300px;
+
+  /* stylelint-disable */
+
+  .euiSelectableListItem__text {
+    max-height: 100%;
+  }
 }
 
 .dataSourceViewOuiFlexGroup {
+  .euiFlexItem {
+    max-width: fit-content;
+  }
+    /* stylelint-enable */
+
   .dataSourceViewOuiFlexItem {
     color: grey;
     text-overflow: ellipsis;