diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index 8033f5b41..858ddb3e4 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -1470,19 +1470,8 @@ export default { display: flex; max-width: 100%; flex-wrap: wrap; - gap: 0 0.5rem; & > div { - flex: 0 0 calc(50% - 0.25rem); - } - } - :deep(.button-question.is-mobile-appointment) { - .button-inner-wrapper > div { - flex: 0 0 100%; - } - } - :deep(.button-question.is-drop-off-appointment) { - .button-inner-wrapper > div { flex: 0 0 100%; } } diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue index 241df49cd..48dc66ad2 100644 --- a/src/layouts/schedule/schedule.vue +++ b/src/layouts/schedule/schedule.vue @@ -86,17 +86,19 @@ class="row your-shop-location" v-if="appointmentType && appointmentType !== appointmentTypeStrings.MOBILE">
- +
+ +
-
@@ -163,9 +157,8 @@ import alert from "@/ux-components/alert/alert"; import serviceZipModalQuestion from "@/layouts/service-location/service-zip-modal-question/service-zip-modal-question"; import appointmentTypeQuestion from "@/layouts/service-location/appointment-type-question/appointment-type-question"; import shopQuestion from "@/layouts/service-location/shop-question/shop-question"; -import shopQuestionPopup from "@/layouts/service-location/shop-question/shop-question-popup"; -import buttonQuestion from "@/digital-components/button-question/button-question.vue"; import shopListButton from "@/layouts/service-location/shop-question/shop-list-button/shop-list-button"; +import shopLocation from "@/layouts/schedule/shop-location/shop-location"; import funnelHeader from "@/fmg-components/funnel-header/funnel-header"; import navbar from "@/fmg-components/nav-bar/nav-bar"; @@ -774,21 +767,15 @@ export default { const zipCode = this.selectedProvider.address.zipCode; const distanceInMiles = provider ? Math.round(provider.distanceInMiles * 2) / 2 : 0; - return [ - { - buttonLabel: `${city}`, - buttonLabelSubCopy: `${distanceInMiles} mi`, - buttonBodyCopy: `${streetAddress}, ${city}, ${state} ${zipCode}`, - additionalButtonData: this.additionalButtonData, - value: this.selectedProvider.providerNumber, - }, - ]; + return { + city: `${city}`, + distance: `${distanceInMiles} mi`, + address1: `${streetAddress}`, + address2: `${city}, ${state} ${zipCode}`, + }; } return []; }, - questionText() { - return this.getCmsContent("YourSafeliteShopWidget", "QuestionText"); - }, appointmentTypeStrings() { return AppointmentTypeStrings; }, @@ -1745,8 +1732,7 @@ export default { serviceZipModalQuestion, appointmentTypeQuestion, contentGroupModal, - shopQuestionPopup, - buttonQuestion, + shopLocation, }, }; diff --git a/src/layouts/schedule/shop-location/shop-location.vue b/src/layouts/schedule/shop-location/shop-location.vue new file mode 100644 index 000000000..f4277e43b --- /dev/null +++ b/src/layouts/schedule/shop-location/shop-location.vue @@ -0,0 +1,120 @@ + + + + + + diff --git a/src/layouts/schedule/time-slot-modal-question/time-slot-modal-list-button/time-slot-modal-list-button.vue b/src/layouts/schedule/time-slot-modal-question/time-slot-modal-list-button/time-slot-modal-list-button.vue index 74286c550..5ee4768f8 100644 --- a/src/layouts/schedule/time-slot-modal-question/time-slot-modal-list-button/time-slot-modal-list-button.vue +++ b/src/layouts/schedule/time-slot-modal-question/time-slot-modal-list-button/time-slot-modal-list-button.vue @@ -90,7 +90,7 @@ export default { position: relative; background: $white; transition: all 150ms linear; - border-radius: $border-radius-lg; + border-radius: $border-radius-pill; border: 1px solid $gray-500; width: 100%; outline: none; diff --git a/src/styles/shared-input-button-styles.scss b/src/styles/shared-input-button-styles.scss index f212fa072..e06feaf43 100644 --- a/src/styles/shared-input-button-styles.scss +++ b/src/styles/shared-input-button-styles.scss @@ -28,7 +28,7 @@ position: relative; z-index: 5; @include box-shadow-hover($blue-300); - border-radius: 0.5rem; + border-radius: $border-radius-pill; } } }