front: handle long file names in the infra list

Signed-off-by: theocrsb <[email protected]>
OpenRailAssociation · Mar 5, 2025 · 8734217 · 8734217
1 parent 63a6a0e
commit 8734217
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/front/src/modules/infra/components/InfraSelector/InfraSelectorEditionItem.tsx b/front/src/modules/infra/components/InfraSelector/InfraSelectorEditionItem.tsx
@@ -59,7 +59,7 @@ export default function InfraSelectorEditionItem({
                 </span>
               ) : (
                 <>
-                  <span className="flex-grow-1">{infra.name}</span>
+                  <span className="flex-grow-1 infra-name">{infra.name}</span>
                   {infra.locked && (
                     <span className="infra-lock">
                       <small>{t('infraManagement:locked')}</small>

diff --git a/front/src/modules/infra/styles/_infraSelector.scss b/front/src/modules/infra/styles/_infraSelector.scss
@@ -213,12 +213,17 @@
         input {
           background: none;
         }
-        span {
-          display: flex;
+        .infra-name {
+          width: 100px;
+          overflow: hidden;
+          position: relative;
+          display: inline-block;
+          text-overflow: ellipsis;
+          white-space: nowrap;
         }
         .infra-lock {
           display: flex;
-          align-items: center;
+          justify-content: end;
           color: var(--coolgray7);
           padding: 0 4px 0 4px;
           text-transform: uppercase;