jason/DigitalConsumer.ISS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #278 from Safelite/feature/Digital/SSR-411

Browse source 
SSR-411
This commit is contained in:
shnsuku 2023-05-03 20:52:03 +05:30 committed by GitHub
commit bebc005fbd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 78 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/iss-components/site-footer/site-footer.vue
View file

@ -1,10 +1,8 @@
<template>
<div class="footerImage" id="imgCity" v-if="footerImageURL" >
<img id="siteFooterImage" :src="footerImageURL" />
</div>
<footer class="footer container-fluid fixed-bottom g-5 bg-light py-4" id="infoBox">
<footer class="footer container-fluid g-5 px-0 py-3 " id="infoBox">
<div class="row d-flex flex-row-reverse align-items-center vw-100 mx-0">
<div class="col button-col d-flex" id="stacked" >
<div class="col button-col d-flex px-0" id="stacked" >
<buttonMain
v-if="!isForwardButtonHidden"
ref="buttonMain"
@ -19,7 +17,7 @@
data-bs-dismiss="modal"
data-test-id="site-footer-main-button" />
</div>
<div v-if="!isBackButtonHidden" class="col-auto link-col py-1 text-break">
<div v-if="!isBackButtonHidden" class="col-auto link-col py-1 px-0 text-break">
<textLink
linkType="navigation"
:text="backLink"
@ -31,6 +29,9 @@
</div>
</div>
</footer>
<div class="footerImage" id="imgCity" v-if="footerImageURL" >
<img id="siteFooterImage" :src="footerImageURL" />
</div>
</template>
<script>

13
src/layouts/coverage-statement/coverage-statement.vue
View file

@ -7,7 +7,7 @@
<div class="container-fluid pb-2">
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<div class="select-car-form rounded pb-1">
<textBlock
cmsWidgetName="verifyingCoverageStatement"
typeStyle="h5"
@ -28,14 +28,15 @@
</div>
<steeringText cmsWidgetName="MASteeringText" ></steeringText>
<siteFooter
</div>
<siteFooter
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@backClicked="navigateBack"
@forwardClicked="forwardButtonAction"
ref="siteFooter"
/>
</div>
</div>
</div>
</div>
@ -156,6 +157,7 @@ export default {
<style lang="scss">
ol {
margin-left: -1rem;
margin-bottom:0;
li {
margin-bottom: .5rem;
line-height: 1.5rem;
@ -169,7 +171,10 @@ ol {
color: $black;
}
p strong {
color: $black;
color: $black;
font-weight: 500;
}
p.small{
margin-bottom:0;
}
</style>

2
src/layouts/license-plate-lookup/license-plate-lookup.vue
View file

@ -51,7 +51,7 @@
:options="stateOptions"
disableAutoFill
validationRules="state-required"
class="mt-4" />
class="mt-4 mb-2"/>
<siteFooter
:isForwardActionDisabled="!meta.valid"
cms-widget-name="SiteFooterWidget"

4
src/layouts/policy-holder-details/policy-holder-details.vue
View file

@ -3,8 +3,8 @@
<div class="page-container-grouped-styles">
<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="container-fluid pb-2 px-5">
<div class="row mt-4 mb-3">
<div class="col">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
<addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>

4
src/layouts/policy-vehicles/policy-vehicles.vue
View file

@ -4,12 +4,12 @@
<div class="fade-on-route-transition position-relative">
<siteHeader class="mb-2 header" cmsWidgetName="SiteHeaderWidget"/>
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mt-2 mb-4" />
<policyVehiclesQuestion class="px-4" cmsWidgetName="PolicyVehiclesQuestion" :vehicles="VehiclesForQuestions" validationRules="option-required"/>
<policyVehiclesQuestion cmsWidgetName="PolicyVehiclesQuestion" :vehicles="VehiclesForQuestions" validationRules="option-required"/>
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" :isForwardActionDisabled="!meta.valid" @ForwardClicked="forwardButtonAction" @back-clicked="backButtonAction"/>
</div>
</div>

2
src/layouts/provider-preference/provider-preference.vue
View file

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

24
src/layouts/service-location/service-location.vue
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" class="mt-5" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="row px-3">
@ -28,11 +28,12 @@
buttonTypeString="listCard"
isRequired
v-model="selectedAppointmentType"
validationRules="selection-required" />
<div class="select-car">
validationRules="selection-required"
class="service-location-button-question mb-1"/>
<div class="select-car">
<div class="container-fluid pb-2">
<div class="row px-3">
<div class="col">
<div class="row">
<div class="col px-0">
<div class="select-car-form rounded">
<siteFooter
cmsWidgetName="SiteFooterWidget"
@ -218,9 +219,7 @@ export default {
</script>
<style lang="scss">
.fade-on-route-transition {
margin-bottom: 100px;
}
.page-container-grouped-styles {
overflow: auto;
}
@ -245,6 +244,7 @@ export default {
line-height: 1.250rem;
}
}
.choose-option{
.button-question >div {
&:first-of-type {
@ -255,7 +255,13 @@ export default {
}
.button-question{
.row.form-test-error{
line-height:1.5rem;
line-height:1.500rem;
padding-left: 0rem !important;
}
}
.service-location-button-question {
.question-text {
margin-top: 1.5rem;
}
}
</style>

14
src/layouts/service-packages/service-packages.vue
View file

@ -7,7 +7,7 @@
justification="left"
issContainingPage="service-packages"
class="my-5"/>
<div class="fade-on-route-transition sub-container make-tall">
<div class="fade-on-route-transition">
<servicePackageQuestion ref="servicePackage"
cmsWidgetName="ServicePackage"
groupName="ServicePackageQuestion"
@ -19,8 +19,8 @@
<textBlock cmsWidgetName="PriceDisclaimerWidget"
justifyText="left"
typeStyle="caption"
style="margin-bottom: 6rem;"
class="mt-2 mx-6" />
class="mt-2 mx-6 mb-2" />
<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
<contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" />
<contentGroupModal ref="RearWiperModal" cmsWidgetName="RearWiperModal" />
@ -189,4 +189,10 @@
contentGroupModal
}
};
</script>
</script>
<style>
.fade-on-route-transition{
overflow-x:hidden;
}
</style>

5
src/layouts/vehicle-damage/vehicle-damage.vue
View file

@ -28,7 +28,8 @@
v-model="selectedWindshieldOptions"
:hasRepairReplaceConflict="hasRepairReplaceConflict"
:hasSplitSingleConflict="hasSplitSingleConflict"
:selectedDamageLocations="selectedDamageLocations" />
:selectedDamageLocations="selectedDamageLocations"
class="mb-3" />
<alert
v-if="hasRepairReplaceConflict"
class="my-5"
@ -41,7 +42,7 @@
groupName="SideDoorSideQuestion"
v-model="sideDoorOptionsData"
v-show="!hasRepairReplaceConflict"
:selectedDamageLocations="selectedDamageLocations" />
:selectedDamageLocations="selectedDamageLocations" class="mb-1"/>
<replaceOptionsQuestion
ref="backGlassOptions"
cmsWidgetName="RearReplaceOptionsQuestion"

4
src/layouts/vehicle-make/vehicle-make.vue
View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" :hasBackButton="true" @click-event="backButtonAction" />
<makeQuestion class="px-4" v-model="selectedMake" ref="makeQuestion" cmsWidgetName="VehicleMakeQuestion" />
<makeQuestion v-model="selectedMake" ref="makeQuestion" cmsWidgetName="VehicleMakeQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

4
src/layouts/vehicle-model/vehicle-model.vue
View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" :hasBackButton="true" :backButtonAccessibleText="backButtonAccessibleText" @click-event="backButtonAction" />
<modelQuestion v-model="selectedModel" ref="modelQuestion" cmsWidgetName="VehicleModelQuestion" class="px-4" />
<modelQuestion v-model="selectedModel" ref="modelQuestion" cmsWidgetName="VehicleModelQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

4
src/layouts/vehicle-style/vehicle-style.vue
View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" class="mb-3" displayGenericVehicleImage />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" :hasBackButton="true" :backButtonAccessibleText="backButtonAccessibleText" @click-event="backButtonAction" />
<styleQuestion v-model="selectedStyle" ref="styleQuestion" cmsWidgetName="VehicleStyleQuestion" class="px-4" />
<styleQuestion v-model="selectedStyle" ref="styleQuestion" cmsWidgetName="VehicleStyleQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

4
src/layouts/vehicle-year/vehicle-year.vue
View file

@ -3,13 +3,13 @@
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="select-car">
<div class="container-fluid pb-2">
<div class="container-fluid pb-2 px-5">
<div class="row">
<div class="col">
<div class="select-car-form rounded text-center">
<vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage="true" class="mb-3" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
<yearQuestion class="px-4" v-model="selectedYear" ref="yearQuestion" cmsWidgetName="VehicleYearQuestion" />
<yearQuestion v-model="selectedYear" ref="yearQuestion" cmsWidgetName="VehicleYearQuestion" />
<siteFooter cmsWidgetName="SiteFooterWidget" ref="siteFooter" @back-clicked="backButtonAction" :isForwardButtonHidden="shouldHideForwardButton" />
</div>
</div>

2
src/layouts/vin-lookup/vin-location-information/vin-location-information.vue
View file

@ -1,5 +1,5 @@
<template>
<div class="vin-location-information mt-2">
<div class="vin-location-information mt-2 mb-3">
<div
class="vin-toggle"
:class="[isVinLocationDetailVisible ? 'active' : '']"

31
src/layouts/welcome-page/welcome-page.vue
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" class="mt-4"/>
<div class="container-fluid pb-2">
<div class="row mt-5 px-3">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
<div class="container-fluid px-5">
<div class="row mt-4">
<div class="col">
<textboxQuestion
inputId="policyNumberField"
@ -18,7 +18,7 @@
validationRules="policy-number-required" />
</div>
</div>
<div class="row mt-4 px-3" v-if="this.displayPolicyZip">
<div class="row mt-4 " v-if="this.displayPolicyZip">
<div class="col">
<textboxQuestion
inputId="policyZipCode"
@ -27,7 +27,7 @@
ref="policyZip" />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4">
<div class="col">
<textboxQuestion
type="date"
@ -48,7 +48,7 @@
<textBlock cmsWidgetName="DamageDateEstimateWidget" typeStyle="small" class="mt-2" />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4">
<div class="col">
<dropdownQuestion
cmsWidgetName="DamageCauseQuestion"
@ -63,7 +63,7 @@
/>
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4 ">
<div class="col">
<textboxQuestion
inputId="phoneNumberField"
@ -76,7 +76,7 @@
disableAutoFill />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row mt-4">
<div class="col">
<textboxQuestion
inputId="emailField"
@ -88,9 +88,10 @@
disableAutoFill />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row">
<div class="col">
<textboxQuestion
class="mt-4"
inputId="damageCityField"
cmsWidgetName="DamageCityQuestion"
v-model="welcomePageModel.damageCity"
@ -101,9 +102,10 @@
validationRules="loss-city-required" />
</div>
</div>
<div class="row mt-4 px-3">
<div class="row">
<div class="col">
<dropdownQuestion
class="mt-4"
cmsWidgetName="DamageStateQuestion"
v-model="welcomePageModel.damageState"
ref="state"
@ -118,9 +120,9 @@
/>
</div>
</div>
<div class="row mt-4">
<div class="row mb-3">
<buttonQuestion
class="px-0"
class="px-0 mt-4"
cmsWidgetName="GlassOnlyQuestion"
v-model="welcomePageModel.isDamageGlassOnly"
inputId = "isDamageGlassOnly"
@ -134,7 +136,7 @@
v-if="this.displayGlassOnlyQuestion"
disableAutoFill/>
</div>
<div class="row mt-4 position-sticky top-100" id="welcomeFooter">
<div class="row position-sticky top-100" id="welcomeFooter">
<div class="col">
<site-footer
cmsWidgetName="SiteFooterWidget"
@ -323,6 +325,9 @@ export default {
.my-2 {
margin-bottom: 0rem !important;
}
.page-container-grouped-styles.welcome {
height: auto;
}
@-moz-document url-prefix() {
// Temporary solution that prevents the Continue button from being hidden in Firefox
#welcomeFooter {

2
src/styles/common-styles.scss
View file

@ -54,7 +54,7 @@ body {
}
// Scroll page when modal isn't open
.fade-on-route-transition {
height: calc(100% - 80px);
height: calc(100% - 10px);
overflow: auto;
}
// Prevent scroll when modal is open