[myfaces-tobago] 01/02: fix(select[One/Many]List): long option label

[bo...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

bommel pushed a commit to branch tobago-5.x
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git

commit 91f4d62d65b9335e6c83275e974882ba5ef50244
Author: Henning Noeth <hn...@apache.org>
AuthorDate: Thu Jun 15 10:22:45 2023 +0200

    fix(select[One/Many]List): long option label
    
    * fix width for selectOne/ManyList if content is too big
    
    Issue: TOBAGO-2233
---
 tobago-theme/src/main/scss/_tobago.scss | 28 +++++++++++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/tobago-theme/src/main/scss/_tobago.scss b/tobago-theme/src/main/scss/_tobago.scss
index 66fe923507..b5107f6468 100644
--- a/tobago-theme/src/main/scss/_tobago.scss
+++ b/tobago-theme/src/main/scss/_tobago.scss
@@ -179,6 +179,7 @@ $tobago-flex-layout-spacing: 0.5rem;
   &.tobago-label-container {
     .dropdown, .list-group {
       flex: 1 0 0;
+      min-width: 0;
     }
   }
 
@@ -227,6 +228,10 @@ $tobago-flex-layout-spacing: 0.5rem;
     }
   }
 
+  .dropdown {
+    min-width: 0;
+  }
+
   .tobago-select-field {
     display: flex;
     flex-wrap: wrap;
@@ -243,13 +248,19 @@ $tobago-flex-layout-spacing: 0.5rem;
       padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
     }
 
+    span {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
     .tobago-filter {
       margin: 0;
       border: 0;
       border-radius: 0;
       padding: 0;
       flex: 1 0 0;
-      min-width: 8rem;
+      min-width: 1rem;
       background-color: transparent;
 
       &:focus {
@@ -1344,6 +1355,16 @@ tobago-select-one-choice {
 
 tobago-select-one-list {
   @include selectListBase();
+
+  .tobago-select-field {
+    flex-wrap: nowrap;
+
+    span {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
 }
 
 tobago-select-one-listbox {
@@ -1373,6 +1394,11 @@ tobago-select-many-list {
 
     .btn-group {
       margin-right: 0.25rem;
+
+      tobago-badge {
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
     }
   }
 }