EMBCESSMOD 173 - Insurance info pop up (bcgov#872)

* Add info popup to Yes option

* Update insurance modal styles to match wireframes

embc-app/ClientApp/src/app/self-registration/self-registration-two/self-registration-two.component.html

@@ -6,7 +6,7 @@ <h2 class="blue-header h3">INSURANCE</h2>
   <section>
     <p class="required font-weight-bold">Do you have insurance to cover your immediate needs?</p>
     <div class="form-group" tabindex="0">
-      <div class="form-check">
+      <div class="form-check" (click)='openInsuranceInfoModal()'>
         <input type="radio" [class.is-invalid]="invalid('insuranceCode')" class="form-check-input" value="yes" formControlName="insuranceCode" id="insuranceCodeYes">
         <label class="form-check-label" for="insuranceCodeYes">Yes</label>
       </div>

embc-app/ClientApp/src/app/shared/modals/insurance-info/insurance-info.component.html

@@ -1,10 +1,15 @@
-<div class="info-header">
-  <button type="button" class="close close-padding" aria-label="Close" (click)="activeModal.close()">
-    <span aria-hidden="true">&times;</span>
-  </button>
-</div>
-<div class="modal-body">
-  <p>Please continue the registration and contact your insurance provider for support.</p>
-  <p>Emergency Support Services is intended for those without supports such as insurance coverage or friends and family who can assist.</p>
-  <button type="button" class="btn btn-primary" (click)="activeModal.close()">Close</button>
+<div class="info-container">
+  <div class="info-header">
+    <button type="button" class="close close-padding" aria-label="Close" (click)="activeModal.close()">
+      <span aria-hidden="true">&times;</span>
+    </button>
+  </div>
+  <div class="modal-body">
+    <p>Please continue the registration and contact your insurance provider for support.</p>
+    <p>Emergency Support Services is intended for those without supports such as insurance coverage or friends and
+      family who can assist.</p>
+      <div class="btn-container">
+        <button type="button" class="btn btn-primary" (click)="activeModal.close()">Close</button>
+      </div>
+  </div>
 </div>

embc-app/ClientApp/src/app/shared/modals/insurance-info/insurance-info.component.scss

@@ -1,13 +1,28 @@
 @import "~src/styles/_defaults.scss";
+$bgColor: #f1f4fa;
+$closeColor: #3d5d8d;
 
 .close-padding {
   padding: 5px;
 }
 
+.close-color {
+  color: $closeColor;
+}
+
 .cursor-pointer {
   cursor: pointer;
 }
 
+.info-container {
+  background-color: $bgColor;
+}
+
 .info-header {
   display: list-item;
+}
+
+.btn-container {
+  display: flex;
+  justify-content: center;
 }