Update FE project

Update FE to latest version so that fe can run on docker

Change-Id: I9c5dee756b567dbe64fac6d3d6fd89362813bdcc
Issue-ID: SDC-1359
Signed-off-by: Stone, Avi (as206k) <as206k@att.com>

3 files changed, 45 insertions, 11 deletions

diff --git a/public/src/app/error-dialog/error-dialog.component.html b/public/src/app/error-dialog/error-dialog.component.html
index 7b72d06..ca9dd32 100644
--- a/public/src/app/error-dialog/error-dialog.component.html
+++ b/public/src/app/error-dialog/error-dialog.component.html
@@ -1,17 +1,35 @@
-<p-dialog [(visible)]="store.displayErrorDialog" modal="modal" width="500" [responsive]="true" data-tests-id="error-dialog">
+<p-dialog [(visible)]="store.displayErrorDialog" [closable]="false" modal="modal" width="500" [responsive]="true" data-tests-id="error-dialog"
+  styleClass="dcae-error">
   <p-header>
-    <span style="font-size: 1.3em;">
-      Error
-    </span>
+    <div style="display: flex;">
+      <span style="color: #CF2A2A;
+        padding-right: 15px;
+        height: 100%;
+        display: flex;
+        justify-content: center;
+        align-items: center;" [innerHTML]="'x-circle' | feather:28"></span>
+      <span style="font-family: 'Open Sans', sans-serif;
+      font-size: 24px; width: 100%;">
+        Error
+      </span>
+      <span style="
+        height: 100%;
+        display: flex;
+        color:rgb(90, 90, 90);
+        justify-content: center;
+        align-items: center;" [innerHTML]="'x' | feather:20" (click)="closeDialog()" data-tests-id="error-cancel-icon"></span>
+    </div>
   </p-header>
 
-  <div *ngFor="let error of store.ErrorContent">
+  <div *ngFor="let error of store.ErrorContent" style="padding: 0 0 20px 43px; font-family: 'Open Sans', sans-serif;
+  font-size: 14px;">
     {{ error.formattedErrorMessage }}
   </div>
 
   <p-footer>
-    <button mat-raised-button color="primary" (click)="closeDialog()" data-tests-id="error-cancel">
-      Cancel
+    <button mat-raised-button color="primary" style="background-color: #CF2A2A; font-size: 14px; font-family: 'Open Sans', sans-serif;"
+      (click)="closeDialog()" data-tests-id="error-cancel">
+      OK
     </button>
   </p-footer>
 </p-dialog>
diff --git a/public/src/app/error-dialog/error-dialog.component.scss b/public/src/app/error-dialog/error-dialog.component.scss
index e69de29..d0c0ae1 100644
--- a/public/src/app/error-dialog/error-dialog.component.scss
+++ b/public/src/app/error-dialog/error-dialog.component.scss
@@ -0,0 +1,18 @@
+:host /deep/ .dcae-error {
+  border-top: solid 6px #cf2a2a;
+}
+
+:host /deep/ .ui-dialog .ui-dialog-titlebar {
+  padding-top: 15px;
+  padding-left: 20px;
+  padding-right: 12px;
+  padding-bottom: 0;
+}
+
+:host /deep/ .ui-dialog-footer {
+  padding: 10px;
+}
+
+:host /deep/ .ui-dialog.ui-widget .ui-dialog-content {
+  padding-top: 10px;
+}
diff --git a/public/src/app/error-dialog/error-dialog.component.ts b/public/src/app/error-dialog/error-dialog.component.ts
index 3e7bfe0..aa4b693 100644
--- a/public/src/app/error-dialog/error-dialog.component.ts
+++ b/public/src/app/error-dialog/error-dialog.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
 import { Store } from '../store/store';
 
 @Component({
@@ -6,11 +6,9 @@ import { Store } from '../store/store';
   templateUrl: './error-dialog.component.html',
   styleUrls: ['./error-dialog.component.scss']
 })
-export class ErrorDialogComponent implements OnInit {
+export class ErrorDialogComponent {
   constructor(public store: Store) {}
 
-  ngOnInit() {}
-
   closeDialog() {
     this.store.displayErrorDialog = false;
   }