endorsements page styling WIP

This commit is contained in:
Katie Kroell 2023-09-11 16:36:44 -04:00
parent 3af5a3a204
commit e1cf8e9d63

View file

@ -7,11 +7,11 @@
<div class="page-container-grouped-styles">
<div class="fade-on-route-transition position-relative">
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5 mb-5 endorsements" />
<div class="container-fluid pb-2">
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5" />
<div class="container-fluid px-5 mt-0">
<buttonQuestion
v-model="schoolPropertyAnswer"
class="radioQuestion"
class="radioQuestion windshield-chip-count-question mb-4"
cmsWidgetName="SchoolPropertyQuestion"
:questionText="schoolPropertyQuestionText"
:answers="schoolPropertyAnswersFromCms"
@ -23,7 +23,7 @@
</buttonQuestion>
<buttonQuestion
v-model="parkingLotAnswer"
class="radioQuestion"
class="radioQuestion windshield-chip-count-question"
cmsWidgetName="ParkingLotQuestion"
:questionText="parkingLotQuestionText"
:answers="parkingLotAnswersFromCms"
@ -33,12 +33,13 @@
isRequired
:validationRules="rules.selectionRequired">
</buttonQuestion>
<siteFooter
<siteFooter
ref="siteFooter"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
@ForwardClicked="forwardButtonAction"
@backClicked="backButtonAction" />
@backClicked="backButtonAction"
class="pt-5" />
</div>
</div>
</div>
@ -149,22 +150,29 @@ export default {
</script>
<style lang="scss" scoped>
:deep .endorsements {
.subheader-primary {
span {
font-size: 20px;
line-height: 32px;
}
}
.subheader-secondary {
p {
margin-top: 0.5rem;
font-size: 14px;
line-height: 24px;
}
span {
text-align: left;
}
:deep .subheader-primary {
margin-bottom: 0.5rem;
}
:deep .subheader-secondary {
p {
font-size: 0.875rem;
line-height: 1.5rem;
}
}
:deep .question-text {
& > span {
text-align: left;
line-height: 1.5rem;
}
margin-bottom: 0.5rem;
}
:deep div.question-text.d-flex {
margin-top: 1rem;
}
</style>