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

CASH-177: necessary structure and CSS updates due to modal markup changes made on SYP /quote popup question

Browse source
This commit is contained in:
Adam Caouette 2025-01-31 17:02:10 -05:00
parent 00596bc232
commit 9443e31825
1 changed files with 63 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

96
src/fmg-components/save-progress-popup-question/save-progress-popup-question.vue
View file

@ -14,20 +14,22 @@
v-model="userInput"
cmsWidgetName="SaveProgressPopupQuestionWidget"
class="save-progress-popup-question" />
<buttonMain
ref="skipButton"
type="button"
:buttonText="buttonText"
loaderColor="white"
:suppressLoader="true"
class="skip-button"
@click-event="closeModal" />
<template v-slot:modal-footer-slot>
<buttonMain
ref="skipButton"
type="button"
:buttonText="buttonText"
loaderColor="white"
:suppressLoader="true"
class="skip-button"
@click-event="closeModal" />
<p class="modal-disclaimer" v-html="modalDisclaimerText"></p>
</template>
<alert
class="my-4"
v-if="isProgressSaved"
cmsWidgetName="SaveProgressModalAlertWidget"
alertClass="alert-success" />
<p class="modal-disclaimer" v-html="modalDisclaimerText"></p>
</modal>
</div>
</template>
@ -205,35 +207,63 @@ export default {
left: 0;
}
}
.modal-footer {
order: 3;
padding: 0;
}
.modal-disclaimer {
order: 4;
.modal.modal-component .modal-dialog .modal-content {
p.modal-body {
padding: 0;
}
.modal-body {
display: flex;
flex-direction: column;
padding: 0 1.5rem;
.textbox-question {
padding: 0;
margin: 0 0 1.5rem 0;
label {
text-align: left;
font-weight: 900;
}
}
}
.modal-body-inner {
text-align: center;
margin-bottom: 1.5rem;
}
.modal-footer {
padding: 0 1.5rem;
margin: 0 0 1.5rem 0;
button.btn {
order: 1;
margin-bottom: 1.5rem;
}
button.btn.skip-button {
padding: 0;
order: 2;
font-size: 1rem;
}
.modal-disclaimer {
font-size: 0.75rem;
text-align: left;
order: 3;
margin: 0;
a {
text-decoration: none;
}
}
}
}
&.progress-saved {
.modal-footer,
.save-progress-popup-question {
.modal-footer-button,
.modal-disclaimer {
display: none;
}
.skip-button {
margin-bottom: 0;
}
}
}
.applied-promo {
font-size: 0.875rem;
font-weight: 500;
line-height: 24px;
color: $green;
.promo-code {
text-transform: uppercase;
}
}
.alert {
color: $red;
font-size: 0.875rem;
font-weight: 500;
line-height: 24px;
}
</style>