From a8d5e276d3c9f9e54356a75271012e6e633d6666 Mon Sep 17 00:00:00 2001
From: Artem Dzhereleiko <Dgerik2015@gmail.com>
Date: Fri, 28 Apr 2023 17:53:59 +0300
Subject: [PATCH] UI: Fixed for long key and value

---
 .../components/attribute/attribute-table.component.html   | 8 ++++----
 .../components/attribute/attribute-table.component.scss   | 5 +++++
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.html b/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.html
index a2d230bde9..e056140b71 100644
--- a/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.html
+++ b/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.html
@@ -162,7 +162,7 @@
           <mat-header-cell *matHeaderCellDef mat-sort-header style="width: 40%"> {{ 'attribute.key' | translate }} </mat-header-cell>
           <mat-cell *matCellDef="let attribute">
             <div fxLayout="row" style="align-items: center">
-              <span>{{ attribute.key }}</span>
+              <span class="ellipsis">{{ attribute.key }}</span>
               <tb-copy-button
                 [disabled]="isLoading$ | async"
                 [copyText]="attribute.key"
@@ -180,9 +180,9 @@
           <mat-cell *matCellDef="let attribute"
                     class="tb-value-cell"
                     (click)="editAttribute($event, attribute)">
-            <div fxLayout="row" style="align-items: center">
-              <div fxFlex>
-                <span style="overflow: hidden;text-overflow: ellipsis;">{{attribute.value | tbJson}}</span>
+            <div fxFlex fxLayout="row" style="align-items: center">
+              <div fxFlex fxLayout="row"  class="ellipsis" style="align-items: center;">
+                <span class="ellipsis">{{attribute.value | tbJson}}</span>
                 <tb-copy-button
                   [disabled]="isLoading$ | async"
                   [copyText]="attribute.value | tbJson"
diff --git a/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.scss b/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.scss
index 67bf37453a..3d92d8c5fc 100644
--- a/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.scss
+++ b/ui-ngx/src/app/modules/home/components/attribute/attribute-table.component.scss
@@ -65,6 +65,11 @@
         overflow: hidden;
         text-overflow: ellipsis;
       }
+
+      .ellipsis {
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
     }
   }