Truncate version on Apps list

Resolves #1937
spring-cloud · Dec 5, 2023 · 2753e99 · 2753e99
1 parent 7fb5bd9
commit 2753e99
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/ui/src/app/apps/apps.component.html b/ui/src/app/apps/apps.component.html
@@ -123,7 +123,7 @@ <h1 class="page-title-actions">
       ><span class="{{ app.labelTypeClass() }}">{{ app.type }}</span></clr-dg-cell
     >
     <clr-dg-cell>
-      <span class="label">
+      <span class="label version-truncate">
         {{ app.version }}
         <span *ngIf="app.versions?.length > 1" class="badge badge-light-blue">{{ app.versions?.length }}</span>
       </span>

diff --git a/ui/src/scss/styles.scss b/ui/src/scss/styles.scss
@@ -744,3 +744,15 @@ h1.page-title-actions {
 .clr-input-wrapper {
   max-width: none;
 }
+
+.version-truncate {
+  max-width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  display: inline-block;
+  line-height: 1rem;
+  &>.badge {
+    margin: -1px -.45rem 1px .3rem
+  }
+}