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

SSR-348 unsticky service location page header.

Browse source
This commit is contained in:
Bryan Mauger 2023-04-19 09:44:31 -04:00
parent 0efa2a2c50
commit a1db722aff
1 changed files with 42 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
src/layouts/service-location/service-location.vue
View file

@ -1,30 +1,38 @@
<template> <template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }" > <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }" >
<div class="page-container-grouped-styles"> <div class="page-container-grouped-styles">
<siteHeader cmsWidgetName="SiteHeaderWidget" class="siteHeader"/> <div class="fade-on-route-transition position-relative">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" id="sub-header" /> <siteHeader cmsWidgetName="SiteHeaderWidget" />
<div class="fade-on-route-transition position-relative px-5 choose-option">
<buttonQuestion
cmsWidgetName="ServiceTypeQuestionWidget"
:questionText="questionText"
:answers="answersFromCms"
buttonTypeString="listCard"
isRequired
v-model="selectedValues"
validationRules="selection-required"/>
<div class="select-car"> <div class="select-car">
<div class="container-fluid pb-2"> <div class="container-fluid pb-2">
<div class="row px-3"> <div class="row px-3">
<div class="col"> <div class="col">
<div class="select-car-form rounded"> <div class="select-car-form rounded">
<siteFooter <buttonQuestion
cmsWidgetName="SiteFooterWidget" cmsWidgetName="ServiceTypeQuestionWidget"
:isForwardActionDisabled="!meta.valid" :questionText="questionText"
@backClicked="backButtonAction" :answers="answersFromCms"
@forwardClicked="forwardButtonAction" buttonTypeString="listCard"
ref="siteFooter" isRequired
/> v-model="selectedValues"
validationRules="selection-required"/>
<div class="select-car">
<div class="container-fluid pb-2">
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded">
<siteFooter
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@backClicked="backButtonAction"
@forwardClicked="forwardButtonAction"
ref="siteFooter"
/>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -35,7 +43,7 @@
</Form> </Form>
</template> </template>
<script> <script>
// Import Supporting Files // Import Supporting Files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper"; import { settleAllPromises } from "@/helpers/layout-helper";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
@ -90,8 +98,8 @@ export default {
}, },
backButtonAction() { backButtonAction() {
/** /**
* this.navigationScenarios comes from base-mixin * this.navigationScenarios comes from base-mixin
*/ */
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route); this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
}, },
async forwardButtonAction() {}, async forwardButtonAction() {},
@ -117,16 +125,16 @@ export default {
color: $black; color: $black;
} }
.question-text { .question-text {
& > span { & > span {
line-height: 1.500rem; line-height: 1.500rem;
} }
} }
.list-card-content p { .list-card-content p {
&:first-of-type { &:first-of-type {
line-height: 1.5rem; line-height: 1.5rem;
} }
&:not(:nth-of-type(1)){ &:not(:nth-of-type(1)){
line-height: 1.250rem; line-height: 1.250rem;
} }
} }
.siteHeader{ .siteHeader{
@ -136,11 +144,11 @@ export default {
} }
.choose-option{ .choose-option{
.button-question >div { .button-question >div {
&:first-of-type { &:first-of-type {
margin-bottom: 0.95rem; margin-bottom: 0.95rem;
line-height: 1.500rem; line-height: 1.500rem;
} }
} }
} }
.button-question{ .button-question{