Fix issue where sticky footer image didn't go all...

the way to the bottom on taller screens.
This commit is contained in:
Bryan Mauger 2023-02-06 16:04:13 -05:00
parent c4d37a0d11
commit 3b34e8f3d2

View file

@ -1,7 +1,7 @@
<template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }" >
<div class="page-container-grouped-styles overflow-auto welcome">
<div class="fade-on-route-transition">
<div class="fade-on-route-transition h-100">
<siteHeader cmsWidgetName="SiteHeaderWidget"/>
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"/>
<div class="row mt-4">
@ -71,12 +71,12 @@
ref="state"
inputId="8fdf9dc2e13e430eb57529499dceb3eb"
:options="stateOptions"
validationRules="loss-state-required"
validationRules="loss-state-required"
isRequired
disableAutoFill
placeHolderText="Select an option"
/>
</div>
</div>
</div>
<div class="row mt-4">
<buttonQuestion
@ -86,7 +86,7 @@
:answers="DamageGlassOnlyOptions"
:questionText="DamageGlassOnlyQuestion"
buttonTypeString="listButtonHorizontal"
validationRules="damage-option-required"
validationRules="damage-option-required"
isRequired
ref="glassOnlyDamage"
disableAutoFill/>
@ -116,7 +116,7 @@
disableAutoFill />
</div>
</div>
<div class="row mt-4">
<div class="row mt-4 position-sticky top-100">
<div class="col">
<site-footer
cmsWidgetName="SiteFooterWidget"
@ -139,7 +139,7 @@
import buttonQuestion from "@/digital-components/button-question/button-question";
import dropdownQuestion from "@/digital-components/dropdown-question/dropdown-question";
import textBlock from "@/digital-components/text-block/text-block";
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper";
@ -173,7 +173,7 @@
errorMessages.PHONE_NUMBER_FORMAT
)
);
export default {
name: "welcome-page",
mixins: [BaseFormMixin],
@ -186,7 +186,7 @@
const mainStore = useMainStore();
return { mainStore };
},
async beforeRouteEnter(to, from, next)
async beforeRouteEnter(to, from, next)
{
// Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
@ -198,7 +198,7 @@
promise: cmsContentPromise,
},
];
//use resultMap to populate layout content.
let resultMap = await settleAllPromises(promiseResultMap);
@ -213,7 +213,7 @@
return this.navigateForward();
},
navigateForward() {
navigateForward() {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WELCOME_PAGE,
this.$route
@ -331,4 +331,3 @@
margin-bottom: 0rem !important;
}
</style>