fix(notification-box): Fix view of notification-box (closes #837) (#843)

* fix(notification-box-view): Fix view of notification-box * fix(notification-box-view): Fix view of notification-box * fix(notification-box-view): Fix view of notification-box * refactor(volume-model): fixes
bwsw · Jan 10, 2018 · bedbe45 · bedbe45
1 parent 95d7947
commit bedbe45
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 2 deletions.
diff --git a/src/app/shared/components/notification-box/notification-box-item.component.html b/src/app/shared/components/notification-box/notification-box-item.component.html
@@ -2,14 +2,15 @@
   <h4 matLine class="mat-list-item-content">
     <ng-container [ngSwitch]="notification.status">
       <mat-icon
+        class="done"
         *ngSwitchCase="notificationStatus.Finished"
         matListIcon
       >
         done
       </mat-icon>
       <mat-spinner
         *ngSwitchCase="notificationStatus.Pending"
-        [diameter]="50"
+        [diameter]="40"
         [strokeWidth]="5"
       ></mat-spinner>
       <mat-icon
@@ -19,7 +20,9 @@ <h4 matLine class="mat-list-item-content">
         close
       </mat-icon>
     </ng-container>
-    {{ notification.message | translate }}
+    <span>
+      {{ notification.message | translate }}
+    </span>
   </h4>
   <span>
     <mat-icon
@@ -30,5 +33,10 @@ <h4 matLine class="mat-list-item-content">
     >
       close
     </mat-icon>
+    <mat-icon
+      *ngIf="notification.status === notificationStatus.Pending"
+      class="close"
+      matListIcon
+    ></mat-icon>
   </span>
 </mat-list-item>
diff --git a/src/app/shared/components/notification-box/notification-box-item.component.scss b/src/app/shared/components/notification-box/notification-box-item.component.scss
@@ -13,4 +13,10 @@
 :host mat-icon.close {
   float: right;
   cursor: pointer;
+  padding-left: 8px;
 }
+
+:host mat-icon.done {
+  padding-left: 8px;
+}
+
diff --git a/src/app/shared/components/notification-box/notification-box.component.scss b/src/app/shared/components/notification-box/notification-box.component.scss
@@ -8,6 +8,8 @@ mat-list {
   max-height: 288px;
   overflow: auto;
   line-height: 20px;
+  padding-top: 0;
+  margin-bottom: -5px !important;
 }
 
 cs-popover {