Merge pull request #8406 from rusikv/develop/3.5

Fixed assignee cell height not matching row height in alarm entity table

ui-ngx/src/app/modules/home/components/alarm/alarm-table-config.ts

@@ -120,18 +120,11 @@ export class AlarmTableConfig extends EntityTableConfig<AlarmInfo, TimePageLink>
           color: alarmSeverityColors.get(entity.severity)
         })));
     this.columns.push(
-      new EntityTableColumn<AlarmInfo>('assignee', 'alarm.assignee', '200px',
+      new EntityTableColumn<AlarmInfo>('assignee', 'alarm.assignee', '240px',
         (entity) => {
           return this.getAssigneeTemplate(entity)
         },
-        (entity) => {
-          return {
-            display: 'flex',
-            justifyContent: 'start',
-            alignItems: 'center',
-            height: 'inherit'
-          }
-        },
+        () => ({}),
         false,
         () => ({}),
         (entity) => undefined,
@@ -203,8 +196,10 @@ export class AlarmTableConfig extends EntityTableConfig<AlarmInfo, TimePageLink>
           <span class="user-display-name">${this.getUserDisplayName(entity)}</span>
         </span>`
         :
-        `<mat-icon class="material-icons unassigned-icon">account_circle</mat-icon>
-        <span>${this.translate.instant('alarm.unassigned')}</span>`
+        `<span class="unassigned-container">
+          <mat-icon class="material-icons unassigned-icon">account_circle</mat-icon>
+          <span>${this.translate.instant('alarm.unassigned')}</span>
+        </span>`
       }
       </span>`
   }

ui-ngx/src/app/modules/home/components/alarm/alarm-table.component.scss

@@ -21,10 +21,10 @@
       }
     }
     .assignee-cell {
-      display: flex;
-      justify-content: flex-start;
-      align-items: center;
+      line-height: normal;
       .assigned-container {
+        display: inline-block;
+        vertical-align: baseline;
         max-width: 180px;
         overflow: hidden;
         white-space: nowrap;
@@ -44,14 +44,19 @@
           font-weight: 700;
         }
       }
-      .material-icons.unassigned-icon {
-        width: 28px;
-        height: 28px;
-        font-size: 28px;
-        margin-right: 8px;
-        color: rgba(0, 0, 0, 0.38);
-        overflow: visible;
+      .unassigned-container {
+        display: inline-flex;
+        align-items: center;
+        .material-icons.unassigned-icon {
+          width: 28px;
+          height: 28px;
+          font-size: 28px;
+          margin-right: 8px;
+          color: rgba(0, 0, 0, 0.38);
+          overflow: visible;
+        }
       }
+
     }
   }
 }