welcome page updates

src/iss-components/footer-menu/footer-menu.vue

@@ -38,7 +38,7 @@
                 <a
                     href=""
                     target="_blank"
-                    @click="openCookiePreferences">Cookie Preferences</a>
+                    @click="openCookiePreferences">Cookie preferences</a>
             </div>
             <div class="footer-menu-item">
                 <textLink

src/layouts/welcome-page/welcome-page.vue

@@ -12,7 +12,7 @@
                 <div class="welcome-page-container iss-heritage-content-container-width">
                     <siteSubHeader
                         cmsWidgetName="SiteSubHeaderWidget"
-                        class="mt-4" />
+                        class="form-group" />
                     <textboxQuestion
                         ref="policyNumber"
                         v-model="welcomePageModel.policyNumber"
@@ -22,16 +22,6 @@
                         disableAutoFill
                         :isDisabled="isPolicyHolderDisabled"
                         :validationRules="rules.policyNumber" />
-                    <textboxQuestion
-                        ref="policyZip"
-                        v-model="welcomePageModel.policyZipCode"
-                        inputId="policyZipCode"
-                        cmsWidgetName="PolicyZipQuestion"
-                        isRequired
-                        mask="#####"
-                        :isDisabled="isPolicyZipDisabled"
-                        :validationRules="rules.policyZip"
-                        class="mt-3" />
                     <textboxQuestion
                         ref="phoneNumber"
                         v-model="welcomePageModel.phoneNumber"
@@ -41,7 +31,8 @@
                         isRequired
                         :mask="phoneMask"
                         disableAutoFill
-                        class="mt-3" />
+                        placeholderText="###-###-####"
+                        class="form-group" />
                     <textboxQuestion
                         ref="extension"
                         v-model="welcomePageModel.extension"
@@ -49,7 +40,7 @@
                         cmsWidgetName="ExtensionQuestion"
                         :validationRules="rules.extension"
                         disableAutoFill
-                        class="mt-3" />
+                        class="form-group" />
                     <textboxQuestion
                         ref="dateOfLoss"
                         v-model="welcomePageModel.dateOfLoss"
@@ -62,7 +53,7 @@
                         :max="new Date().toJSON().slice(0, 10)"
                         :min="'1972-12-01'"
                         :validationRules="rules.lossDate"
-                        class="mt-3" />
+                        class="form-group" />
                     <textBlock
                         cmsWidgetName="DamageDateEstimateWidget"
                         typeStyle="small"
@@ -77,44 +68,45 @@
                         disableAutoFill
                         :validationRules="rules.damageOption"
                         placeHolderText="Select an option"
-                        class="mt-3" />
+                        class="form-group" />
+                    <textboxQuestion
+                        ref="policyZip"
+                        v-model="welcomePageModel.policyZipCode"
+                        inputId="policyZipCode"
+                        cmsWidgetName="PolicyZipQuestion"
+                        isRequired
+                        mask="#####"
+                        :isDisabled="isPolicyZipDisabled"
+                        :validationRules="rules.policyZip"
+                        class="form-group" />
                     <dropdownQuestion
                         v-if="displayDamageStateQuestion"
                         id="welcomeDropdown"
                         ref="state"
                         v-model="welcomePageModel.damageState"
-                        class="mt-3"
+                        class="form-group"
                         cmsWidgetName="DamageStateQuestion"
                         inputId="8fdf9dc2e13e430eb57529499dceb3eb"
                         :options="getStates"
                         :validationRules="rules.lossState"
                         isRequired
                         disableAutoFill
-                        placeHolderText="Select an option" />
+                        placeHolderText="Select State" />
                     <textboxQuestion
                         v-if="displayDamageCityQuestion"
                         ref="damageCity"
                         v-model="welcomePageModel.damageCity"
-                        class="mt-3"
+                        class="form-group"
                         inputId="damageCityField"
                         cmsWidgetName="DamageCityQuestion"
                         isRequired
                         disableAutoFill
                         :validationRules="rules.lossCity" />
-                    <textboxQuestion
-                        ref="email"
-                        v-model="welcomePageModel.email"
-                        inputId="emailField"
-                        cmsWidgetName="EmailAddressQuestion"
-                        :validationRules="rules.email"
-                        isRequired
-                        disableAutoFill
-                        class="mt-3" />
                     <buttonQuestion
                         v-if="displayGlassOnlyQuestion"
                         ref="glassOnlyDamage"
                         v-model="welcomePageModel.isDamageGlassOnly"
-                        class="px-0 mt-3"
+                        class="px-0 form-group"
                         cmsWidgetName="GlassOnlyQuestion"
                         inputId="isDamageGlassOnly"
                         :answers="DamageGlassOnlyOptions"
@@ -142,17 +134,9 @@
                             :isDismissible="false" />
                         <siteFooter
                             ref="siteFooter"
-                            class="mt-3"
                             cmsWidgetName="SiteFooterWidget"
                             :isForwardActionDisabled="!meta.valid"
                             @ForwardClicked="forwardButtonAction" />
-                        <textBlock
-                            id="requestCallbackLink"
-                            cmsWidgetName="HelpTextWidget"
-                            linkType="navigation"
-                            href="javascript:void(0)"
-                            class="mb-5 text-left"
-                            @clickEvent="handleHelpLinkClick" />
                     </div>
                 </div>
             </div>
@@ -257,7 +241,6 @@ export default {
             duplicates: [],
             rules: {
                 damageOption: 'damage-option-required',
-                email: `${globalRules.EMAIL_ADDRESS_REQUIRED}|${globalRules.EMAIL_ADDRESS_FORMAT}`,
                 extension: `${globalRules.EXTENSION_FORMAT}`,
                 lossCity: `${globalRules.DATE_OF_LOSS_CITY_REQUIRED}|${globalRules.DATE_OF_LOSS_CITY_FORMAT}`,
                 // eslint-disable-next-line max-len
@@ -408,7 +391,6 @@ export default {
                 isDamageGlassOnly: this.mainStore.order.policy.isDamageGlassOnly,
                 phoneNumber: this.mainStore.order.contactInfo.homePhone,
                 extension: this.mainStore.order.contactInfo.extension,
-                email: this.mainStore.order.customer.emailAddress,
                 isPolicyNumberDisabled: this.mainStore.order.policy.isPolicyNumberDisabled
             };
         },
@@ -425,7 +407,6 @@ export default {
             this.welcomePageModel.isDamageGlassOnly = response.policy.isDamageGlassOnly;
             this.welcomePageModel.phoneNumber = response.customer.homePhone;
             this.welcomePageModel.extension = response.customer.extension;
-            this.welcomePageModel.email = response.customer.emailAddress;
         },
         findDamageCause(damageCause) {
             const damageCauseOptions = this.DamageCauseOptions;
@@ -481,13 +462,6 @@ export default {
             this.mainStore.order.loadedFromCookie = true;
             this.answeredContinueModal = true;
             this.$refs.continueModal.closeModal();
-        },
-        handleHelpLinkClick() {
-            useMainStore().setBailout(bailoutMessage.RequestCallback());
-            this.$router.navigate(
-                this.navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
-                this.$route
-            );
         }
     }
 };
@@ -508,6 +482,10 @@ form {
         min-height: 1px;
         padding-left: .9375rem;
         padding-right: .9375rem;
+
+        .form-group {
+            margin-top: 1.25rem;
+        }
     }
 }
 

src/styles/common-styles.scss

@@ -174,6 +174,7 @@ body {
     div.textbox-question {
         label {
             span.sub-caption {
+                color: #525656;
                 font-weight: 400;
             }
         }