Merge pull request #280 from Safelite/feature/digital/SSR-445

Feature/digital/ssr 445
This commit is contained in:
katiekroell 2023-05-01 13:52:53 -04:00 committed by GitHub
commit 1d6df6cc82
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 30 additions and 46 deletions

View file

@ -8,7 +8,7 @@
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<vehicleBanner class="mb-3" cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="false" />
<vehicleBanner class="mt-2 mb-4" cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
<alert
ref="alertFewMoreQuestions"
@ -16,7 +16,8 @@
alertClass="alert-warning"
:manualHeadline="alertFewMoreQuestionsHeader"
:manualCopy="alertFewMoreQuestionsCopy"
v-bind:isDismissible="false" />
v-bind:isDismissible="false"
class="mt-5"/>
<div v-for="(questionsDatum, i) in questionsData" :key="questionsDatum.key">
<questionChain
ref="questionChain"

View file

@ -63,7 +63,7 @@ export default {
},
methods: {
show() {
this.currentFooterAndHeaderHeight = this.getFooterInfoBoxHeight() + 72;
this.currentFooterAndHeaderHeight = this.getFooterInfoBoxHeight() + 56;
this.isActive = true;
document.querySelector('.fade-on-route-transition').scrollTo({
top: 0, behavior: 'instant'
@ -123,8 +123,8 @@ export default {
&.menu-modal {
max-width: 576px;
left: auto;
height: calc(100% - 72px);
top: 72px;
height: calc(100% - 56px);
top: 56px;
border-top: 1px solid $gray-300;
overflow-x: visible;
overflow-y: visible;

View file

@ -1,6 +1,6 @@
<template>
<div>
<div class="site-header d-flex justify-content-center align-items-center flex-column py-2 mb-4" :style="logoBackgroundStyle">
<div class="site-header d-flex justify-content-center align-items-center flex-column py-2" :style="logoBackgroundStyle">
<img id="siteHeaderImage" class="img-fluid" :src="imageSrc" :alt="altText" />
<menuModal/>
</div>
@ -95,13 +95,12 @@ export default({
<style lang="scss" scoped>
.site-header {
height: 72px;
height: 56px;
}
.alert {
left: 0;
top: 72px;
}
#siteHeaderImage {
height: 2.5rem;
}

View file

@ -9,11 +9,11 @@
<div class="col">
<div class="select-car-form rounded">
<vehicleBanner
class="mb-3"
class="mt-2 mb-4"
cmsWidgetName="VehicleBannerWidget"
ref="vehicleBanner"
:displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" ref="siteSubHeader" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" ref="siteSubHeader" class="mb-5" />
<alert
ref="alertVinNotFound"
v-if="displayVinNotFoundAlert"

View file

@ -8,7 +8,7 @@
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="fade-on-route-transition sub-container overflow-scroll px-5">
<vehicleBanner
class="mb-3"
class="mt-2 mb-4"
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />

View file

@ -12,7 +12,7 @@
cmsWidgetName="verifyingCoverageStatement"
typeStyle="h5"
justifyText="center"
class="mt-0 mb-4"
class="mt-4 mb-4"
id="coverage-statement-text-block"
/>
<div>

View file

@ -8,7 +8,7 @@
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<vehicleBanner class="mb-3" cms-widget-name="VehicleBannerWidget" :display-generic-vehicle-image="false" />
<vehicleBanner class="mt-2 mb-4" cms-widget-name="VehicleBannerWidget" :display-generic-vehicle-image="false" />
<siteSubHeader cms-widget-name="SiteSubHeaderWidget" />
<alert
ref="alertVinNotFound"

View file

@ -17,6 +17,7 @@
disableAutoFill
validationRules="first-name-required" />
<textboxQuestion
class="mt-4"
inputId="lastNameField"
cmsWidgetName="PolicyholderLastNameQuestion"
v-model="customerQuestions.lastName"
@ -167,11 +168,6 @@ export default {
}
</script>
<style lang="scss">
.alert.alert-warning
{
margin-top: 20px;
}
#sub-header p {
font-size: 16px;
line-height: 26px;

View file

@ -8,7 +8,7 @@
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mt-2 mb-4" />
<policyVehiclesQuestion class="px-4" cmsWidgetName="PolicyVehiclesQuestion" :vehicles="VehiclesForQuestions"/>
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" :isForwardActionDisabled="!meta.valid" @ForwardClicked="forwardButtonAction" @back-clicked="backButtonAction"/>
</div>

View file

@ -6,7 +6,7 @@
<div class="page-container-grouped-styles">
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeader" id="sub-header" />
<siteSubHeader cmsWidgetName="SiteSubHeader" id="sub-header" class="mt-4"/>
<button v-on:click="forwardButtonAction">Temp Forward Button</button>
<div>
<siteFooter

View file

@ -3,7 +3,7 @@
<div class="page-container-grouped-styles">
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header" class="mt-5 mb-1" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="row px-3">
@ -28,8 +28,7 @@
buttonTypeString="listCard"
isRequired
v-model="selectedAppointmentType"
validationRules="selection-required"
class="service-location-button-question"/>
validationRules="selection-required" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="row px-3">
@ -235,7 +234,7 @@ export default {
}
.question-text {
& > span {
line-height: 1.500rem;
line-height: 1.5rem;
}
}
.list-card-content p {
@ -246,12 +245,6 @@ export default {
line-height: 1.250rem;
}
}
.siteHeader{
.site-header{
margin-bottom: 1.25rem !important;
}
}
.choose-option{
.button-question >div {
&:first-of-type {
@ -262,13 +255,7 @@ export default {
}
.button-question{
.row.form-test-error{
line-height:1.500rem;
padding-left: 0rem !important;
}
}
.service-location-button-question {
.question-text {
margin-top: 1.5rem;
line-height:1.5rem;
}
}
</style>

View file

@ -5,7 +5,8 @@
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"
justification="left"
issContainingPage="service-packages"/>
issContainingPage="service-packages"
class="my-5"/>
<div class="fade-on-route-transition sub-container make-tall">
<servicePackageQuestion ref="servicePackage"
cmsWidgetName="ServicePackage"

View file

@ -4,7 +4,7 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<div class="container-fluid pb-2">
<div class="row mt-4 px-3">
<div class="row mt-2 px-3">
<div class="col">
<alert
ref="vehicleChangeAlert"
@ -14,7 +14,7 @@
alertClass="alert-warning"
:isDismissible="false" />
<vehicleBanner
class="mb-3"
class="mb-4"
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />

View file

@ -8,8 +8,8 @@
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<VehicleBanner class="mb-3" cms-widget-name="VehicleBannerWidget" :display-generic-vehicle-image="false" />
<SiteSubHeader cms-widget-name="SiteSubHeaderWidget" />
<VehicleBanner class="mt-2 mb-4" cms-widget-name="VehicleBannerWidget" :display-generic-vehicle-image="false" />
<SiteSubHeader cms-widget-name="SiteSubHeaderWidget" class="mt-5 mb-2" />
<VinLookupMethods v-model="selectedVinLookupMethod" cms-widget-name="VINLookupMethod" group-name="VinLookupMethods" ref="VinLookupMethods" />
<SiteFooter cms-widget-name="SiteFooterWidget" :is-forward-action-disabled="isForwardActionDisabled" @back-clicked="backButtonAction" @forward-clicked="forwardButtonAction" />
</div>

View file

@ -9,7 +9,7 @@
<div class="col">
<div class="select-car-form rounded">
<vehicleBanner
class="mb-3"
class="mt-2 mb-4"
ref="vehicleBanner"
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />

View file

@ -8,7 +8,7 @@
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<vehicleBanner class="mb-3" cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="false" />
<vehicleBanner class="mt-2 mb-4" cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="false" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
<vinLookupAlerts class="mt-5" :activeAlertType="activeVehicleLookupAlertType" />
<vinQuestion v-model="vin" :mask="vinMask" :isDisabled="vinPopulatedOnPageLoad" textPosition="left" />

View file

@ -3,9 +3,9 @@
<div class="page-container-grouped-styles welcome">
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-4"/>
<div class="container-fluid pb-2">
<div class="row mt-4 px-3">
<div class="row mt-5 px-3">
<div class="col">
<textboxQuestion
inputId="policyNumberField"