Merge branch 'release/2025.08.21' into CASH-1327-fix-two-package-layout
This commit is contained in:
commit
8e5ebd0d20
4 changed files with 81 additions and 73 deletions
|
|
@ -1483,6 +1483,8 @@ export default {
|
|||
display: block;
|
||||
position: relative;
|
||||
height: 2rem;
|
||||
font-size: 0.875rem;
|
||||
padding-top: 0;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
background: transparent;
|
||||
|
|
|
|||
|
|
@ -5,40 +5,9 @@
|
|||
<div class="container page-container-grouped-styles">
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
|
||||
<alert
|
||||
ref="alertMilitaryBaseZip"
|
||||
class="my-5"
|
||||
cmsWidgetName="AlertMilitaryBaseZipWidget"
|
||||
v-if="displayMilitaryZipAlert"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertMobileOnly"
|
||||
class="my-5"
|
||||
cmsWidgetName="AlertMobileOnlyWidget"
|
||||
v-if="displayServiceableMobileOnly"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertRecalNoMobile"
|
||||
class="my-5"
|
||||
cmsWidgetName="AlertRecalNoMobileWidget"
|
||||
v-if="displayRecalibrationWarning"
|
||||
@text-link-clicked="openModalAction"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertInshopOnly"
|
||||
class="my-5"
|
||||
cmsWidgetName="AlertInshopOnlyWidget"
|
||||
v-if="displayServiceableInshopOnly"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertNoShops"
|
||||
class="my-5"
|
||||
cmsWidgetName="AlertNoShopsWidget"
|
||||
v-if="displayNoShopsAlert"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertMobileFeeFree"
|
||||
class="my-5"
|
||||
class="mb-5"
|
||||
cmsWidgetName="AlertMobileFeeFreeWidget"
|
||||
v-if="showMobileFreeAlert"
|
||||
alertClass="alert-success" />
|
||||
|
|
@ -46,7 +15,7 @@
|
|||
</div>
|
||||
<div class="row appointment-type">
|
||||
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
|
||||
<funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="my-5" />
|
||||
<funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="mb-5" />
|
||||
<appointmentTypeQuestion
|
||||
v-model="appointmentTypeFromAppointmentTypeQuestion"
|
||||
v-show="isAppointmentTypeDisplayed"
|
||||
|
|
@ -62,6 +31,41 @@
|
|||
labelBold="true" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-10 col-lg-8 col-xl-7">
|
||||
<alert
|
||||
ref="alertMobileOnly"
|
||||
class="mt-5 mb-5"
|
||||
cmsWidgetName="AlertMobileOnlyWidget"
|
||||
v-if="displayServiceableMobileOnly"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertRecalNoMobile"
|
||||
class="mt-5 mb-5"
|
||||
cmsWidgetName="AlertRecalNoMobileWidget"
|
||||
v-if="displayRecalibrationWarning"
|
||||
@text-link-clicked="openModalAction"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertInshopOnly"
|
||||
class="mt-5 mb-5"
|
||||
cmsWidgetName="AlertInshopOnlyWidget"
|
||||
v-if="displayServiceableInshopOnly"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertMilitaryBaseZip"
|
||||
class="mt-5 mb-5"
|
||||
cmsWidgetName="AlertMilitaryBaseZipWidget"
|
||||
v-if="displayMilitaryZipAlert"
|
||||
alertClass="alert-warning" />
|
||||
<alert
|
||||
ref="alertNoShops"
|
||||
class="mt-5 mb-5"
|
||||
cmsWidgetName="AlertNoShopsWidget"
|
||||
v-if="displayNoShopsAlert"
|
||||
alertClass="alert-warning" />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="appointmentType && appointmentType === appointmentTypeStrings.MOBILE"
|
||||
class="col-12 col-md-10 col-lg-8 col-xl-7">
|
||||
|
|
@ -695,7 +699,12 @@ export default {
|
|||
);
|
||||
},
|
||||
isAppointmentTypeDisplayed() {
|
||||
return this.zipCode && !this.displayNoShopsAlert;
|
||||
return (
|
||||
this.zipCode &&
|
||||
!this.displayNoShopsAlert &&
|
||||
this.isServiceableMobile &&
|
||||
this.isServiceableInshop
|
||||
);
|
||||
},
|
||||
requiresInshopRecalibration() {
|
||||
// Specifically check for isRecalibrationServiceableMobile === false, not null or true.
|
||||
|
|
@ -1739,47 +1748,24 @@ export default {
|
|||
|
||||
<style lang="scss">
|
||||
.container {
|
||||
&.page-schedule {
|
||||
padding: 0 1rem;
|
||||
.text-link-small {
|
||||
a,
|
||||
.btn-link {
|
||||
width: auto;
|
||||
margin: 0 auto;
|
||||
height: auto;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.75;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
&:focus {
|
||||
outline: 1px solid $blue;
|
||||
}
|
||||
@include media-breakpoint-up(md) {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
.question-text {
|
||||
margin-bottom: 1.5rem;
|
||||
|
||||
& > span {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
.funnel-sub-header {
|
||||
h5.dark-header {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
}
|
||||
.change-location a {
|
||||
font-family: UrbanistSemibold;
|
||||
}
|
||||
.date-picker {
|
||||
border-top: 1px solid $gray-500;
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
.time-slots-question {
|
||||
padding: 0 0.75rem;
|
||||
}
|
||||
}
|
||||
.question-text > span {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
.alert.alert-warning {
|
||||
.alert-heading {
|
||||
color: $black;
|
||||
font-family: UrbanistSemibold;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-question-button .list-button-content {
|
||||
background: $blue-100;
|
||||
box-shadow: 0 0 0 1px $primary;
|
||||
|
|
@ -1801,6 +1787,7 @@ export default {
|
|||
|
||||
.appointment-type .funnel-sub-header h5 {
|
||||
font-family: UrbanistRegular;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.funnel-sub-header.my-5 h5 {
|
||||
|
|
@ -1814,4 +1801,8 @@ export default {
|
|||
line-height: 26px;
|
||||
text-underline-offset: 4px;
|
||||
}
|
||||
|
||||
.text-block.duration-text-block b {
|
||||
font-family: UrbanistSemibold;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div id="shop-location">
|
||||
<textBlock :customText="questionText" typeStyle="button-question" />
|
||||
<textBlock :customText="questionText" typeStyle="button-question" class="mb-2" />
|
||||
<div>
|
||||
<div>
|
||||
<label v-for="addressItem in addressDetails" :key="addressItem">
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@
|
|||
isRequired
|
||||
insertOrLabelBeforeFinalOption
|
||||
groupName="chooseDropOffOrInshop"
|
||||
class="choose-dropoff-or-inshop"
|
||||
validationRules="time-slot-required">
|
||||
<div>
|
||||
<alert
|
||||
|
|
@ -49,6 +50,7 @@
|
|||
cmsWidgetName="WaitListLabelWidget"
|
||||
typeStyle="medium"
|
||||
fontWeight="600"
|
||||
class="waitlist-label"
|
||||
marginTopSizeOverride="0" />
|
||||
<checkboxQuestion
|
||||
class="mt-3"
|
||||
|
|
@ -651,6 +653,15 @@ export default {
|
|||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
.button-question.choose-dropoff-or-inshop
|
||||
.button-inner-wrapper
|
||||
.col:first-child
|
||||
.button-content.list-button-content
|
||||
> span::after {
|
||||
content: "TM";
|
||||
vertical-align: super;
|
||||
font-size: 50%;
|
||||
}
|
||||
.waitlist {
|
||||
box-shadow: 0px 1px 4px 0px #00000033;
|
||||
border-radius: 8px;
|
||||
|
|
@ -658,6 +669,10 @@ export default {
|
|||
padding: 16px;
|
||||
text-align: left;
|
||||
|
||||
.waitlist-label {
|
||||
font-family: UrbanistSemibold;
|
||||
}
|
||||
|
||||
.ui-checkbox {
|
||||
padding-left: 0px;
|
||||
input {
|
||||
|
|
|
|||
Loading…
Reference in a new issue