Merge branch 'develop' into feature/CASH-341v2

src/digital-components/button-question/button-question.vue

@@ -351,6 +351,7 @@ export default {
     }
 }
 .button-question {
+    font-family: UrbanistSemibold;
     color: $black;
 
     .radio-button-container {

src/digital-components/date-picker/date-picker.vue

@@ -913,8 +913,7 @@ export default {
 
         .month-year {
             grid-area: 1 / 1 / 2 / 5;
-            font-family: AvertaBold;
-            letter-spacing: 0.75px;
+            font-family: UrbanistBold;
             color: $black;
             justify-content: center;
             margin-bottom: 0.5rem;
@@ -1209,7 +1208,7 @@ export default {
                     border-radius: 0.25rem;
                     color: $black;
                     span {
-                        font-family: AvertaSemibold;
+                        font-family: UrbanistSemibold;
                         font-weight: 400;
                     }
                 }
@@ -1240,7 +1239,7 @@ export default {
             &.current-day {
                 label {
                     font-weight: 600;
-                    font-family: "AvertaSemibold";
+                    font-family: "UrbanistSemibold";
                     color: $black;
                     font-size-adjust: 0.5; // needed for Averta fonts baseline alignment
                 }
@@ -1252,11 +1251,10 @@ export default {
                     text-decoration: none;
                     color: $black;
                     font-weight: 400;
-                    font-family: "AvertaSemibold";
+                    font-family: "UrbanistSemibold";
                     font-size-adjust: 0.5; // needed for Averta fonts baseline alignment
 
                     &.price {
-                        font-family: "AvertaRegular";
                         font-weight: 400;
                     }
                 }
@@ -1274,7 +1272,7 @@ export default {
                         color: $blue;
                         span {
                             font-weight: 400;
-                            font-family: "AvertaSemibold";
+                            font-family: "UrbanistSemibold";
                         }
                     }
                 }

src/digital-components/dropdown-question/dropdown-question.vue

@@ -136,8 +136,8 @@ export default {
 <style lang="scss">
 .dropdown-question {
     label {
+        font-family: UrbanistSemibold;
         color: $black;
-        font-weight: 500;
     }
     .label-bold {
         color: $black;

src/digital-components/salesforce-webchat/salesforce-webchat.vue

@@ -129,7 +129,6 @@ export default {
 <style lang="scss">
 .dockableContainer {
     &.showDockableContainer {
-        font-family: AvertaRegular;
         color: $gray-600;
         .sidebarBody {
             button {

src/digital-components/textbox-question/textbox-question.vue

@@ -254,8 +254,8 @@ export default {
         justify-content: center !important;
     }
     label {
+        font-family: UrbanistSemibold;
         color: $black;
-        font-weight: 500;
     }
     .label-bold {
         font-weight: 600;

src/experiment-components/donation-block.vue

@@ -177,13 +177,13 @@ export default {
 
     p {
         &.headline {
-            font-family: AvertaBold;
+            font-family: UrbanistBold;
             color: $red;
             font-weight: 600;
         }
 
         &.subheadline {
-            font-family: AvertaBold;
+            font-family: UrbanistBold;
             font-weight: 600;
         }
     }

src/experiment-components/service-package-radio-for-afterpay.vue

@@ -424,7 +424,6 @@ export default {
             text-transform: uppercase;
             font-size: 0.875rem;
             font-weight: 600;
-            letter-spacing: 0.75px;
         }
         .special-save-box {
             background-color: $green-100;

src/experiment-components/service-package-radio.vue

@@ -476,7 +476,6 @@ export default {
             text-transform: uppercase;
             font-size: 0.875rem;
             font-weight: 600;
-            letter-spacing: 0.75px;
         }
         .special-save-box {
             background-color: $green-100;

src/fmg-components/cart/cart.vue

@@ -1357,6 +1357,7 @@ export default {
             visibility: visible;
         }
         a {
+            font-family: UrbanistSemibold;
             text-decoration: none;
         }
     }

src/layouts/estimate/estimate.vue

@@ -99,9 +99,7 @@ export default {
             lowerCaseParams.append(name.toLowerCase(), value);
         }
 
-        const zip =
-            peekQueryFromStash(queryStrings.ZIP_CODE) ??
-            store.getters.order.serviceLocation.zipCode;
+        const zip = store.getters.order.serviceLocation.zipCode;
 
         var vinByAddressPromise;
         if (zip) {

src/layouts/license-plate-lookup/license-plate-lookup.vue

@@ -118,8 +118,6 @@ import baseMixin from "@/mixins/base-mixin.js";
 import store from "@/store";
 import vinPagesMixin from "@/mixins/vin-pages-mixin";
 import { routeData } from "@/router/constants/routes";
-import { consumeQueryFromStash } from "@/router/methods/helpers/querystring-stash";
-import { queryStrings } from "@/constants/query-strings";
 
 // DEFINE VALIDATION RULES
 defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
@@ -164,8 +162,7 @@ export default {
     data() {
         return {
             licensePlate: this.getLicensePlateFromStore(),
-            registrationZipCode:
-                this.getRegistrationZipFromStore() ?? consumeQueryFromStash(queryStrings.ZIP_CODE),
+            registrationZipCode: this.getRegistrationZipFromStore(),
             emailOrSms: this.getEmailOrSmsFromStore(),
             serviceZipCode: this.getServiceZipFromStore(),
             carId: this.getCarIdfromStore(),

src/layouts/payment-method/review-dropdown/review-block/review-block.vue

@@ -4,7 +4,7 @@
             <textBlock
                 :cmsWidgetName="headerCmsWidgetName"
                 :customText="customHeaderText"
-                typeStyle="body small bold dark"
+                typeStyle="body small dark"
                 marginTopSizeOverride="0" />
         </div>
         <div

src/layouts/payment-method/review-dropdown/review-dropdown.vue

@@ -145,6 +145,10 @@ export default {
     }
 }
 
+:deep(.review-table .text-block span) {
+    font-family: UrbanistSemibold;
+}
+
 .review-toggle {
     &.expanded {
         margin-bottom: 0;
@@ -177,8 +181,8 @@ export default {
         text-decoration: none;
     }
     .label {
+        font-family: UrbanistSemibold;
         color: $black;
-        font-weight: 500;
         line-height: 1.625;
     }
 }

src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue

@@ -405,7 +405,6 @@ export default {
             text-transform: uppercase;
             font-size: 0.875rem;
             font-weight: 600;
-            letter-spacing: 0.75px;
         }
         .special-save-box {
             background-color: $green-100;

src/layouts/schedule/schedule.vue

@@ -772,7 +772,7 @@ export default {
             }
         }
         .change-location a {
-            font-family: AvertaSemibold;
+            font-family: UrbanistSemibold;
         }
         .time-slots-question {
             padding: 0 0.75rem;

src/layouts/schedule/time-slot-modal-question/time-slot-modal-question.vue

@@ -631,7 +631,6 @@ export default {
             margin-left: 0.5rem;
             strong {
                 font-weight: 600;
-                letter-spacing: 0%;
             }
         }
         .success-image {

src/layouts/schedule/time-slot-question/time-slot-question.vue

@@ -561,7 +561,7 @@ export default {
     margin-top: 1.5rem;
 
     .time-slot-header {
-        font-family: AvertaBold;
+        font-family: UrbanistBold;
         margin-top: 1.5rem;
     }
     .text-block.duration-text-block {

src/layouts/service-zip/service-zip.vue

@@ -96,7 +96,6 @@ import { saveSession } from "@/helpers/heritage-integration/order-helper.js";
 import baseMixin from "@/mixins/base-mixin.js";
 import { queryStrings } from "@/constants/query-strings";
 import { routeData } from "@/router/constants/routes";
-import { consumeQueryFromStash } from "@/router/methods/helpers/querystring-stash";
 
 // Define Validation Rules
 defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED));
@@ -116,7 +115,7 @@ export default {
     mixins: [vinPagesMixin],
     data() {
         return {
-            serviceZipCode: this.getZipFromStore() ?? consumeQueryFromStash(queryStrings.ZIP_CODE),
+            serviceZipCode: this.getZipFromStore(),
             emailOrSms: this.getEmailOrSmsFromStore(),
             carId: this.getCarIdfromStore(),
             isHeavyTruck: this.getIsVehicleHeavyTruckServiceableFromStore(),

src/layouts/vehicle/vehicle.vue

@@ -110,10 +110,6 @@ import { getFunnelCookie } from "@/helpers/heritage-integration/cookie-helper";
 import { applicationConfig } from "../../constants/application-config";
 import { queryStrings } from "@/constants/query-strings";
 import { getQuerystringParameter } from "@/helpers/querystring-helper";
-import {
-    consumeQueryFromStash,
-    peekQueryFromStash,
-} from "@/router/methods/helpers/querystring-stash";
 import { debugLog } from "@/helpers/debug-log-helper";
 
 //define validation rules
@@ -138,7 +134,7 @@ export default {
             imageUrl: this.getImagefromStore(),
             imageVifNumber: this.getImageVifNumberfromStore(),
             imageVifColor: this.getImageVifColorfromStore(),
-            serviceZipCode: this.getZipFromStore() ?? peekQueryFromStash(queryStrings.ZIP_CODE),
+            serviceZipCode: this.getZipFromStore(),
             yearOptions: [],
             makeOptions: [],
             modelOptions: [],

src/layouts/vin-lookup/vin-lookup.vue

@@ -159,8 +159,6 @@ import baseMixin from "@/mixins/base-mixin.js";
 import store from "@/store";
 import vinPagesMixin from "@/mixins/vin-pages-mixin";
 import { routeData } from "@/router/constants/routes";
-import { consumeQueryFromStash } from "@/router/methods/helpers/querystring-stash";
-import { queryStrings } from "@/constants/query-strings";
 
 // DEFINE VALIDATION RULES
 defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED));
@@ -204,7 +202,7 @@ export default {
     data() {
         return {
             vin: this.getVinFromStore(),
-            serviceZipCode: this.getZipFromStore() ?? consumeQueryFromStash(queryStrings.ZIP_CODE),
+            serviceZipCode: this.getZipFromStore(),
             emailOrSms: this.getEmailOrSmsFromStore(),
             carId: this.getCarIdfromStore(),
             isHeavyTruck: this.getIsVehicleHeavyTruckServiceableFromStore(),

src/router/methods/route-logic/vehicle.js

@@ -4,6 +4,10 @@ import { getFunnelCookie } from "@/helpers/heritage-integration/cookie-helper";
 import { routeData } from "@/router/constants/routes";
 import { isVerifiedInsurance } from "@/router/methods/helpers/requires-verified-redirect";
 import store from "@/store";
+import { queryStrings } from "@/constants/query-strings";
+import baseMixin from "@/mixins/base-mixin";
+import { storeActions } from "@/constants/store-actions";
+import { consumeQueryFromStash } from "@/router/methods/helpers/querystring-stash";
 
 export async function vehicleBeforeEnter(to, from) {
     // If cookie indicates that vehicle has changed during insurance flow, reset parts info.
@@ -12,6 +16,23 @@ export async function vehicleBeforeEnter(to, from) {
         store.commit(storeMutations.RESET_GLASS_PARTS_STATE);
     }
 
+    // If there is a zip querystring, consume & commit it here.
+    const newZipFromQuerystring = consumeQueryFromStash(queryStrings.ZIP_CODE);
+    if (newZipFromQuerystring) {
+        const zipData = await baseMixin.methods.getZipCodeData(
+            newZipFromQuerystring,
+            routeData.VEHICLE.name
+        );
+
+        if (zipData.isValid) {
+            store.dispatch(storeActions.SAVE_SERVICE_ZIP_CODE_INFO, {
+                zipCode: newZipFromQuerystring,
+                state: zipData.state.state,
+                zipCodeCtu: zipData.zipCodeCtu,
+            });
+        }
+    }
+
     if (isVerifiedInsurance()) {
         return {
             name: routeData.VEHICLE_DAMAGE.name,

src/styles/common-styles.scss

@@ -97,3 +97,11 @@ body {
         }
     }
 }
+button,
+input,
+select,
+textarea,
+option,
+.btn {
+    letter-spacing: 0.03rem;
+}

src/styles/common-typography-styles.scss

@@ -4,6 +4,7 @@ body {
     font-size: 1rem;
     line-height: 1.625;
     font-weight: 400;
+    letter-spacing: 0.03rem;
 }
 
 //Headings
@@ -43,7 +44,7 @@ h5,
 h6,
 .h6 {
     line-height: 1.7;
-    letter-spacing: 0.75px;
+    letter-spacing: 0.03rem;
     text-transform: uppercase;
 }
 
@@ -78,58 +79,58 @@ caption,
     font-weight: 500;
 }
 
-// Averta Fonts
+// Urbanist Fonts
 
 @font-face {
-    font-family: "AvertaBold";
+    font-family: "UrbanistRegular";
     src:
-        url("@/assets/fonts/averta-bold-webfont.woff2") format("woff2"),
-        url("@/assets/fonts/averta-bold-webfont.woff") format("woff");
+        url("@/assets/fonts/Urbanist-Regular.woff") format("woff2"),
+        url("@/assets/fonts/Urbanist-Regular.woff2") format("woff");
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
-    font-family: "AvertaBold_Italic";
+    font-family: "UrbanistSemibold";
     src:
-        url("@/assets/fonts/averta-bolditalic-webfont.woff2") format("woff2"),
-        url("@/assets/fonts/averta-bolditalic-webfont.woff") format("woff");
+        url("@/assets/fonts/Urbanist-SemiBold.woff") format("woff2"),
+        url("@/assets/fonts/Urbanist-SemiBold.woff2") format("woff");
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
-    font-family: "AvertaExtraBold";
+    font-family: "UrbanistBold";
     src:
-        url("@/assets/fonts/averta-extrabold-webfont.woff2") format("woff2"),
-        url("@/assets/fonts/averta-extrabold-webfont.woff") format("woff");
+        url("@/assets/fonts/Urbanist-Bold.woff") format("woff2"),
+        url("@/assets/fonts/Urbanist-Bold.woff2") format("woff");
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
-    font-family: "AvertaRegular";
+    font-family: "UrbanistExtraBold";
     src:
-        url("@/assets/fonts/averta-regular-webfont.woff2") format("woff2"),
-        url("@/assets/fonts/averta-regular-webfont.woff") format("woff");
+        url("@/assets/fonts/Urbanist-ExtraBold.woff") format("woff2"),
+        url("@/assets/fonts/Urbanist-ExtraBold.woff2") format("woff");
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
-    font-family: "AvertaRegular_Italic";
+    font-family: "UrbanistMedium_Italic";
     src:
-        url("@/assets/fonts/averta-regularitalic-webfont.woff2") format("woff2"),
-        url("@/assets/fonts/averta-regularitalic-webfont.woff") format("woff");
+        url("@/assets/fonts/Urbanist-MediumItalic.woff") format("woff2"),
+        url("@/assets/fonts/Urbanist-MediumItalic.woff2") format("woff");
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
-    font-family: "AvertaSemibold";
+    font-family: "UrbanistBold_Italic";
     src:
-        url("@/assets/fonts/averta-semibold-webfont.woff2") format("woff2"),
-        url("@/assets/fonts/averta-semibold-webfont.woff") format("woff");
+        url("@/assets/fonts/Urbanist-BoldItalic.woff") format("woff2"),
+        url("@/assets/fonts/Urbanist-BoldItalic.woff2") format("woff");
     font-weight: normal;
     font-style: normal;
-}
+}

src/styles/ux-variables.scss

@@ -120,8 +120,8 @@ $theme-colors: (
 $body-color: $gray-600;
 
 //Fonts
-$font-family-sans-serif: AvertaRegular, Arial, Helvetica, sans-serif;
-$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
+$font-family-sans-serif: UrbanistRegular, Arial, Helvetica, sans-serif;
+$font-family-monospace: UrbanistRegular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
     monospace;
 // stylelint-enable value-keyword-case
 $font-family-base: $font-family-sans-serif;

src/ux-components/list-card/list-card.vue

@@ -103,6 +103,7 @@ export default {
             justify-content: flex-start;
 
             p {
+                font-family: UrbanistRegular;
                 color: $gray-600;
                 text-align: center;
 
@@ -123,15 +124,16 @@ export default {
         &:checked + .list-card-content {
             p {
                 color: $black;
-                font-weight: 500;
+                font-family: UrbanistSemibold;
             }
             .p-bold {
+                font-family: UrbanistSemibold;
                 font-weight: 600;
             }
 
             .sub-copy {
+                font-family: UrbanistSemibold;
                 color: $gray-600;
-                font-weight: 400;
             }
         }