SSR-411
Removed the sticky footer and fixed the space between the button
This commit is contained in:
parent
af384c40df
commit
3b97b21c24
11 changed files with 34 additions and 22 deletions
|
|
@ -9,7 +9,7 @@
|
|||
<span class="fw-bold w-100">{{ questionText }}</span>
|
||||
</div>
|
||||
|
||||
<div class="w-100 d-flex justify-content-center">
|
||||
<div class="w-100 d-flex justify-content-center mb-2">
|
||||
<fieldset
|
||||
class="w-100"
|
||||
:aria-required="isRequired"
|
||||
|
|
|
|||
|
|
@ -1,8 +1,6 @@
|
|||
<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 py-4" 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" >
|
||||
<buttonMain
|
||||
|
|
@ -31,6 +29,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<div class="footerImage" id="imgCity" v-if="footerImageURL" >
|
||||
<img id="siteFooterImage" :src="footerImageURL" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -156,6 +156,7 @@ export default {
|
|||
<style lang="scss">
|
||||
ol {
|
||||
margin-left: -1rem;
|
||||
margin-bottom:0;
|
||||
li {
|
||||
margin-bottom: .5rem;
|
||||
line-height: 1.5rem;
|
||||
|
|
@ -169,7 +170,10 @@ ol {
|
|||
color: $black;
|
||||
}
|
||||
p strong {
|
||||
color: $black;
|
||||
color: $black;
|
||||
font-weight: 500;
|
||||
}
|
||||
p.small{
|
||||
margin-bottom:0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -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,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-4 px-3 mb-2">
|
||||
<div class="col">
|
||||
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header"/>
|
||||
<addressQuestions ref="addressQuestions" v-model="customerQuestions.addressQuestions" includeStreetAddress2="true" id="address-questions-wrapper"/>
|
||||
|
|
|
|||
|
|
@ -219,9 +219,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.fade-on-route-transition {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
|
||||
.page-container-grouped-styles {
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"
|
||||
justification="left"
|
||||
issContainingPage="service-packages"/>
|
||||
<div class="fade-on-route-transition sub-container make-tall">
|
||||
<div class="fade-on-route-transition ">
|
||||
<servicePackageQuestion ref="servicePackage"
|
||||
cmsWidgetName="ServicePackage"
|
||||
groupName="ServicePackageQuestion"
|
||||
|
|
@ -18,8 +18,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" />
|
||||
|
|
@ -188,4 +188,10 @@
|
|||
contentGroupModal
|
||||
}
|
||||
};
|
||||
</script>
|
||||
</script>
|
||||
<style>
|
||||
.fade-on-route-transition{
|
||||
overflow-x:hidden;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="vin-location-information mt-2">
|
||||
<div class="vin-location-information mt-2 mb-2">
|
||||
<div
|
||||
class="vin-toggle"
|
||||
:class="[isVinLocationDetailVisible ? 'active' : '']"
|
||||
|
|
|
|||
|
|
@ -88,9 +88,10 @@
|
|||
disableAutoFill />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mt-4 px-3">
|
||||
<div class="row px-3" >
|
||||
<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 px-3">
|
||||
<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-2 ">
|
||||
<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"
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ body {
|
|||
font-size: 1rem;
|
||||
line-height: 1.625;
|
||||
font-weight: 400;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
//Headings
|
||||
|
|
|
|||
Loading…
Reference in a new issue