From 9c94d7da6d01e4f440ecca308f0525dd92af8a82 Mon Sep 17 00:00:00 2001 From: Chris Redelinghuys Date: Thu, 20 Nov 2025 15:22:55 -0500 Subject: [PATCH 01/10] CASH-1873: Show Mobile First modal on page load --- .../mobile-first-modal/mobile-first-modal.vue | 1 + src/layouts/schedule/schedule.vue | 27 +++++++++++-------- src/styles/ux-variables.scss | 4 +-- 3 files changed, 19 insertions(+), 13 deletions(-) diff --git a/src/layouts/schedule/mobile-first-modal/mobile-first-modal.vue b/src/layouts/schedule/mobile-first-modal/mobile-first-modal.vue index 2dbde3bd9..1ef9fbc54 100644 --- a/src/layouts/schedule/mobile-first-modal/mobile-first-modal.vue +++ b/src/layouts/schedule/mobile-first-modal/mobile-first-modal.vue @@ -76,6 +76,7 @@ export default { let selectedTimeSlot = { timeSlot: this.selectedAppontment.timeSlot, routeCode: this.selectedAppontment.timeSlot.id, + date: this.selectedAppontment.date, }; this.$emit("confirm-appointment", selectedTimeSlot); this.modal.closeModal(); diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue index 3b4fec04c..1bc3c0945 100644 --- a/src/layouts/schedule/schedule.vue +++ b/src/layouts/schedule/schedule.vue @@ -469,6 +469,7 @@ export default { navigatingForward: false, shopListButton: shopListButton, lastSelectedInshopOrDropoffProvider: null, + selectedMobileFirstAppointment: false, }; }, async beforeRouteEnter(to, from, next) { @@ -597,7 +598,9 @@ export default { pricedMobileFeePart, shopProviderData.data ); - vm.initializeDatePicker(); + vm.initializeDatePicker().then(() => { + vm.showMobileFirstModal(); + }); }); }, computed: { @@ -858,7 +861,9 @@ export default { ); }, isMobileFirstModalOpen() { - return this.isMobileSelected ? this.$refs.mobileFirstModal?.getIsModalOpen() : false; + return this.selectableDatesMobile.days + ? this.$refs.mobileFirstModal?.getIsModalOpen() + : false; }, }, methods: { @@ -1187,8 +1192,6 @@ export default { moreShopTimeSlots.mobileTimeSlotsData.days ); - this.showMobileFirstModal(); - return moreShopTimeSlots; }, @@ -1678,7 +1681,9 @@ export default { this.zipCode = newZipCode.zipCode; this.zipCodeCtu = newZipCode.zipCodeCtu; this.selectedDate = null; - this.initializeDatePicker(); + this.initializeDatePicker().then(() => { + this.showMobileFirstModal(); + }); }); }, updateSelectedProviderAndZipCode(newZipCode, newProvider) { @@ -1716,7 +1721,6 @@ export default { } this.appointmentType = AppointmentTypeStrings.MOBILE; this.updateSelectedProvider(); - this.showMobileFirstModal(); } else if (newAppointmentType) { if (this.appointmentType != AppointmentTypeStrings.MOBILE) { // Clear last shop selected if appointment type was changed in any manner other than from Mobile @@ -1742,7 +1746,7 @@ export default { this.selectedDate = this.getFirstAvailableDate(); }, async showMobileFirstModal() { - if (this.appointmentType == AppointmentTypeStrings.MOBILE) { + if (!this.selectedRouteCodeData?.routeCode) { const isShowMobileFirstAppt = experimentMixin.methods.hasSettingEqualTo( experimentSettings.SHOW_MOBILE_FIRST_APPT, "true" @@ -1824,9 +1828,6 @@ export default { } }, async getFirstAvailableMobileApptByTOD(timeOfDay) { - if (!this.selectableDatesMobile.days) { - await this.initializeDatePicker(); - } if (!this.selectableDatesMobile?.days?.length) { return null; } else { @@ -1853,6 +1854,10 @@ export default { } }, updateTimeSlotandNavigateForward(timeSlotObj) { + this.selectedMobileFirstAppointment = true; + this.appointmentType = AppointmentTypeStrings.MOBILE; + this.selectedDate = timeSlotObj.date; + this.updateSelectedProvider(); this.updateTimeSlot(timeSlotObj); this.forwardButtonAction(); }, @@ -1872,7 +1877,7 @@ export default { const hasValueChanged = newValue !== oldValue; const isDateDifferent = (newValue || oldValue) !== selectedDate; - if (hasValueChanged && isDateDifferent) { + if (hasValueChanged && isDateDifferent && !this.selectedMobileFirstAppointment) { this.selectedTimeSlotInfo = { timeSlot: { date: null, diff --git a/src/styles/ux-variables.scss b/src/styles/ux-variables.scss index 770d95b42..0c275ad51 100644 --- a/src/styles/ux-variables.scss +++ b/src/styles/ux-variables.scss @@ -123,8 +123,8 @@ $body-color: $gray-600; //Fonts $font-family-sans-serif: UrbanistRegular, Arial, Helvetica, sans-serif; -$font-family-monospace: UrbanistRegular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", - monospace; +$font-family-monospace: + UrbanistRegular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; // stylelint-enable value-keyword-case $font-family-base: $font-family-sans-serif; $font-family-code: $font-family-monospace; From 2eb3b2722f8148867b541c697d9f3b214cfe52d2 Mon Sep 17 00:00:00 2001 From: Chris Redelinghuys Date: Fri, 21 Nov 2025 14:28:24 -0500 Subject: [PATCH 02/10] CASH-1873: Show waiting modal for Mobile First --- src/layouts/schedule/schedule.vue | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue index 1bc3c0945..246ce2986 100644 --- a/src/layouts/schedule/schedule.vue +++ b/src/layouts/schedule/schedule.vue @@ -470,6 +470,10 @@ export default { shopListButton: shopListButton, lastSelectedInshopOrDropoffProvider: null, selectedMobileFirstAppointment: false, + isShowMobileFirstAppt: experimentMixin.methods.hasSettingEqualTo( + experimentSettings.SHOW_MOBILE_FIRST_APPT, + "true" + ), }; }, async beforeRouteEnter(to, from, next) { @@ -1196,6 +1200,8 @@ export default { }, async initializeDatePicker() { + this.isShowMobileFirstAppt && this.showLoadingModal(); + this.selectedDate = null; const includeMobileTimeSlots = this.isServiceableMobile; @@ -1233,6 +1239,8 @@ export default { this.setDisplayWaitList(); } } + + this.isShowMobileFirstAppt && this.hideLoadingModal(); }, getScheduleApiResponse, getServiceZipCtuCodeFromStore() { @@ -1349,6 +1357,9 @@ export default { showLoadingModal() { this.$refs.loadingModal.showModal(); }, + hideLoadingModal() { + this.$refs.loadingModal.hideModal(); + }, async forwardButtonAction() { this.navigatingForward = true; var ctu = this.zipCodeCtu; @@ -1747,10 +1758,6 @@ export default { }, async showMobileFirstModal() { if (!this.selectedRouteCodeData?.routeCode) { - const isShowMobileFirstAppt = experimentMixin.methods.hasSettingEqualTo( - experimentSettings.SHOW_MOBILE_FIRST_APPT, - "true" - ); const pmMobileDays = experimentMixin.methods.getSettingValue( experimentSettings.SHOW_PM_MOBILE_DAYS ); @@ -1805,7 +1812,7 @@ export default { ); } - if (isShowMobileFirstAppt) { + if (this.isShowMobileFirstAppt) { if (firstMobilePMDate && numberOfDaysToFirstMobilePMDate <= pmMobileDays) { preSelectedMobileAppointment = firstMobilePMAppt; } else if ( From 81f005a77fb6cc4a19c634c907bcb6bd9c50f45f Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Mon, 24 Nov 2025 12:53:14 -0500 Subject: [PATCH 03/10] Fix typo for flag value --- src/layouts/quote/quote.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/layouts/quote/quote.vue b/src/layouts/quote/quote.vue index 17326ec8e..01b585349 100644 --- a/src/layouts/quote/quote.vue +++ b/src/layouts/quote/quote.vue @@ -581,7 +581,7 @@ export default { return store.getters.isRecalibrationOnOrder; }, isQuotePageDiscountOnOrder() { - return this.quotePageDiscountPartsInfo?.length > 0; + return this.quoteDiscountPartsInfo?.length > 0; }, shouldHideRecalibration() { return ( From 2738e5ceffdc064b45368422c5d4a2db885e42b9 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Mon, 24 Nov 2025 14:02:25 -0500 Subject: [PATCH 04/10] CASH-1891 font updates from Urbanist to UrbanistRegular, UrbanistSemibold. --- src/fmg-components/funnel-footer/funnel-footer.vue | 10 ++-------- src/layouts/payment-method/payment-method.vue | 5 +++-- .../service-package-radio/service-package-radio.vue | 6 ++---- src/layouts/schedule/shop-location/shop-location.vue | 2 +- src/ux-components/button-main/button-main.vue | 7 +------ 5 files changed, 9 insertions(+), 21 deletions(-) diff --git a/src/fmg-components/funnel-footer/funnel-footer.vue b/src/fmg-components/funnel-footer/funnel-footer.vue index a195c446b..572bed1ee 100644 --- a/src/fmg-components/funnel-footer/funnel-footer.vue +++ b/src/fmg-components/funnel-footer/funnel-footer.vue @@ -75,17 +75,11 @@ export default { :deep(a) { text-decoration: none; - &.new-window-link { - font-family: Urbanist, Arial, Helvetica, sans-serif; - margin: 0 0.75rem; - color: $gray-600; - font-weight: 400; - } + &.new-window-link, &.navigation-link { - font-family: Urbanist, Arial, Helvetica, sans-serif; + font-family: UrbanistRegular, Arial, Helvetica, sans-serif; margin: 0 0.75rem; color: $gray-600; - font-weight: 400; } } diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index 21c16d80b..955d106b5 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -986,8 +986,9 @@ export default { } } } -:deep(span.label) { - font-weight: 600; +:deep(span.label), +:deep(span) { + font-family: UrbanistSemibold, Arial, Helvetica, sans-serif; } :deep(div.service-questions span) { color: $black; diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue index 8bb7e921a..959c7345e 100644 --- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue +++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue @@ -294,12 +294,11 @@ export default { .pricing-info .insurance-pricing span { font-size: 0.875rem; - font-family: Urbanist, Arial, Helvetica, sans-serif; - font-weight: 500; + font-family: UrbanistSemibold, Arial, Helvetica, sans-serif; } p { - font-family: Urbanist, Arial, Helvetica, sans-serif; + font-family: UrbanistSemibold, Arial, Helvetica, sans-serif; display: flex; justify-content: space-between; align-items: center; @@ -312,7 +311,6 @@ export default { color: $green; font-size: 0.875rem; font-family: UrbanistSemibold, Arial, Helvetica, sans-serif; - font-weight: 600; @include media-breakpoint-up(md) { position: absolute; bottom: 0.75rem; diff --git a/src/layouts/schedule/shop-location/shop-location.vue b/src/layouts/schedule/shop-location/shop-location.vue index 33ec097e8..f22436eda 100644 --- a/src/layouts/schedule/shop-location/shop-location.vue +++ b/src/layouts/schedule/shop-location/shop-location.vue @@ -109,10 +109,10 @@ export default { border-radius: $border-radius-pill; a { + font-family: UrbanistSemibold; display: inline-block; text-decoration: none; color: $white; - font-weight: $font-weight-600; line-height: 1.5rem; padding: 0.75rem 3rem; } diff --git a/src/ux-components/button-main/button-main.vue b/src/ux-components/button-main/button-main.vue index f5db583bb..87eb28841 100644 --- a/src/ux-components/button-main/button-main.vue +++ b/src/ux-components/button-main/button-main.vue @@ -63,13 +63,13 @@ export default {