Merge pull request #417 from Safelite/feature/digital/SSR-639

Feature/digital/ssr 639
This commit is contained in:
katiekroell 2023-08-16 13:32:21 -04:00 committed by GitHub
commit c96e4de7df
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 51 additions and 54 deletions

View file

@ -29,7 +29,7 @@
</div>
<div
ref="secondaryText"
class="text-center mt-4 fw-bold text-black"
class="text-center mt-4 mb-1 fw-bold text-black"
v-html="secondaryText">
</div>
<div
@ -39,19 +39,19 @@
</div>
<div
v-if="displayQuote"
class="d-flex justify-content-center cost mb-5">
class="d-flex justify-content-center cost mb-0">
{{ formattedServicePrice }}
</div>
<div
v-if="verifiedITAC"
class="d-flex justify-content-center mb-4">
class="d-flex justify-content-center mb-4 deductible-text">
{{ deductibleText }}&nbsp;
<span class="text-success fw-bold">{{ formattedDeductible }}</span>
</div>
<alert
v-if="verifiedITAC"
ref="verifiedITACAlert"
class="mb-4"
class="mb-5"
cmsWidgetName="VerifiedITACAlert"
:manualHeadline="verifiedITACAlertHeader"
:manualCopy="verifiedITACAlertBody"
@ -59,16 +59,15 @@
:isDismissible="false">
</alert>
<div
class="fw-bold text-black mb-2"
class="fw-bold text-black mt-5 mb-2"
v-html="nextStepsHeader">
</div>
<div
class="body-text"
v-html="nextStepsBody">
</div>
<buttonQuestion
<buttonQuestion
v-if="displayQuote"
id="coverage-button-question"
v-model="selectedProvider"
cmsWidgetName="ServiceProviderQuestion"
:questionText="questionText"
@ -76,7 +75,7 @@
buttonTypeString="listButton"
isRequired
:validationRules="rules.selectionRequired">
</buttonQuestion>
</buttonQuestion>
</div>
<siteFooter
ref="siteFooter"
@ -417,49 +416,52 @@ export default {
</script>
<style lang="scss" scoped>
.body-text {
p {
font-size: 14px;
line-height: 24px;
margin-bottom: 8px;
}
}
.cost {
color: $green;
font-size: 32px;
font-size: 2rem;
font-weight: 300;
margin-bottom: 24px;
line-height: 44px;
line-height: 2.75rem;
}
#coverage-button-question {
.question-text {
margin-bottom: 8px;
}
.question-text > span {
text-align: left;
line-height: 24px;
}
.deductible-text {
line-height: 1.5rem;
}
.deductible-modal {
::v-deep p {
line-height: 1.5rem;
font-size: 0.875rem;
margin-bottom: 0.5rem;
strong {
color: $black;
}
}
::v-deep .question-text {
margin-top: 1.5rem;
margin-bottom: 0.5rem;
font-size: 1rem;
line-height: 1.5rem;
& > span {
text-align: left;
}
}
::v-deep .deductible-modal {
p {
margin-bottom: 0px;
margin-bottom: 0 !important;
font-size: 1rem;
line-height: 1.625rem;
}
.modal-body p:last-child {
font-size: 16px;
line-height: 26px;
}
.my-4 {
margin-top: 8px !important;
margin-bottom: 0px !important;
}
img.mb-4 {
margin: 0 !important;
}
h5 {
color: black;
}
p:last-child {
margin-top: 0.5rem;
}
}
</style>

View file

@ -4,7 +4,7 @@
:modalId="ModalName"
:footerButtonText="ModalCloseButtonText"
@footer-button-event="closeModal">
<div class="recal-modal-body ps-4 pe-4 pt-0 pb-5">
<div class="recal-modal-body">
<h5
class="mb-4 text-center"
v-html="ModalHeadline"></h5>
@ -16,7 +16,7 @@
class="fw-bold mb-2 subheader-text"
v-html="ModalSubheadertext"></p>
<p
class="mb-0 small"
class="mb-0 small modal-body"
v-html="ModalBodyText"></p>
<p
v-if="ModalSubBodyText"
@ -74,21 +74,16 @@ export default {
<style lang="scss" scoped>
.recal-modal-body {
.modal-sub-body {
color: $gray-600;
}
ul {
margin-bottom: 0;
}
p {
&:last-child {
margin-bottom: 0;
}
}
.subheader-text {
::v-deep .recal-modal-body {
h5 {
color: $black;
}
.modal-body {
strong {
color: $black;
font-weight: 400;
}
}
}
</style>