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

CASH-1042 WIP

Browse source
This commit is contained in:
Bryan Mauger 2025-07-15 16:22:03 -04:00
parent 15023adb96
commit 3c4a856277
9 changed files with 37 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/fmg-components/cart/cart.vue
View file

@ -1316,11 +1316,11 @@ export default {
&:after { &:after {
content: ""; content: "";
transition: all 0.5s ease; transition: all 0.5s ease;
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.9' xml:space='preserve'%3e%3cpath d='M8 8.9c-.2 0-.5-.1-.6-.3L.3 1.5C.1 1.4 0 1.1 0 .9 0 .7.1.4.3.3.4.1.7 0 .9 0c.2 0 .5.1.6.3L8 6.7 14.5.2c.1-.1.4-.2.6-.2.2 0 .5.1.6.3s.3.4.3.6c0 .2-.1.5-.3.6L8.6 8.6c-.1.2-.4.3-.6.3z' fill='%231474a2'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230070D1' d='M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24Zm6.113 11.28-5.52 5.52a.84.84 0 0 1-1.186 0l-5.52-5.52a.843.843 0 1 1 1.186-1.2L12 15.012l4.927-4.932a.843.843 0 1 1 1.186 1.2Z'/%3E%3C/svg%3E");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right center; background-position: right center;
width: 16px; width: 24px;
height: 9px; height: 24px;
display: inline-flex; display: inline-flex;
position: relative; position: relative;
right: 0.75rem; right: 0.75rem;

13
src/fmg-components/funnel-sub-header/funnel-sub-header.vue
View file

@ -13,11 +13,9 @@
</div> </div>
<div <div
v-if="subText" v-if="subText"
class="d-flex align-self-start align-self-md-center overflow-hidden mt-1"> class="d-flex align-self-center overflow-hidden mt-1">
<p class="small fw-normal sub-text"> <p class="small fw-normal sub-text">
<span> <span v-html="boldedSubHeaderText"></span>
{{ subText }}
</span>
</p> </p>
</div> </div>
</div> </div>
@ -40,6 +38,12 @@ export default {
buttonBack, buttonBack,
}, },
computed: { computed: {
boldedSubHeaderText() {
return this.subText.replace(
/^Almost done!/,
'<span class="almost-done">Almost done!</span>'
);
},
text() { text() {
return this.getCmsContent(this.cmsWidgetName, "HeaderText"); return this.getCmsContent(this.cmsWidgetName, "HeaderText");
}, },
@ -61,6 +65,7 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
h5 { h5 {
line-height: 32px; line-height: 32px;
font-size: 1.25rem;
button { button {
color: inherit; color: inherit;

8
src/fmg-components/save-progress-modal-question/save-progress-modal-question.vue
View file

@ -118,13 +118,14 @@ export default {
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
order: 2; order: 2;
text-align: center; text-align: center;
background: $blue-100; background: $gray-100;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 3rem; height: 3rem;
border-radius: 0.5rem; border-radius: 0.5rem;
box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);
&.progress-saved { &.progress-saved {
background: none; background: none;
@ -137,12 +138,11 @@ export default {
border: none; border: none;
font-weight: 900; font-weight: 900;
font-size: 0.875rem; font-size: 0.875rem;
text-align: center; text-align: left;
display: inline-block; display: inline-block;
width: auto; width: auto;
height: auto; height: auto;
text-decoration: underline; text-decoration: none;
text-underline-offset: 0.25rem;
line-height: 1rem; line-height: 1rem;
padding: 1rem; padding: 1rem;
margin: 0 auto; margin: 0 auto;

3
src/layouts/estimate/estimate.vue
View file

@ -5,7 +5,6 @@
<div class="container page-container-grouped-styles estimate"> <div class="container page-container-grouped-styles estimate">
<div class="row"> <div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7"> <div class="col-12 col-md-10 col-lg-8 col-xl-7">
<funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" />
<div> <div>
<div class="vinlookupquestion" v-html="this.VinLookupQuestionText"></div> <div class="vinlookupquestion" v-html="this.VinLookupQuestionText"></div>
<div v-html="this.VinLookupQuestionBodyText2"></div> <div v-html="this.VinLookupQuestionBodyText2"></div>
@ -41,7 +40,6 @@
// Components // Components
import funnelHeader from "@/fmg-components/funnel-header/funnel-header"; import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
import navbar from "@/fmg-components/nav-bar/nav-bar"; import navbar from "@/fmg-components/nav-bar/nav-bar";
import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
import buttonQuestion from "@/digital-components/button-question/button-question"; import buttonQuestion from "@/digital-components/button-question/button-question";
import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue"; import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
@ -243,7 +241,6 @@ export default {
}, },
components: { components: {
funnelHeader, funnelHeader,
funnelSubHeader,
navbar, navbar,
buttonQuestion, buttonQuestion,
Form, Form,

22
src/layouts/payment-method/payment-method.vue
View file

@ -53,7 +53,7 @@
<div <div
v-if="isRecalibrationOnOrder && shouldHideRecalibration" v-if="isRecalibrationOnOrder && shouldHideRecalibration"
class="questions-about-service my-5"> class="questions-about-service mt-5">
<textBlock <textBlock
cmsWidgetName="QuestionsAboutYourServiceWidget" cmsWidgetName="QuestionsAboutYourServiceWidget"
justifyText="left" justifyText="left"
@ -63,7 +63,7 @@
<div class="d-flex flex-row checkbox-group"> <div class="d-flex flex-row checkbox-group">
<checkboxQuestion <checkboxQuestion
cmsWidgetName="RecalConfirmWidget" cmsWidgetName="RecalConfirmWidget"
class="mb-5" class="mb-3"
isRequired="true" isRequired="true"
v-model="isRecalAckOptIn" v-model="isRecalAckOptIn"
validationRules="recal-ack-required" validationRules="recal-ack-required"
@ -78,13 +78,6 @@
:isInsurance="isInsurance" :isInsurance="isInsurance"
validationRules="payment-method-required" /> validationRules="payment-method-required" />
<alert
v-if="showHavePaymentReadyAlert"
:isDismissible="false"
alertClass="alert-info"
cmsWidgetName="NoPiaDisclaimerWidget"
shouldScrollToOnMount="false" />
<navbar <navbar
cmsWidgetName="FunnelFooterWidget" cmsWidgetName="FunnelFooterWidget"
ref="navbar" ref="navbar"
@ -766,11 +759,6 @@ export default {
return false; return false;
}, },
showHavePaymentReadyAlert() {
return (
!this.showPaymentMethodQuestions && !this.forwardClicked && this.totalAmountDue > 0
);
},
totalAmountDue() { totalAmountDue() {
return getAmountDue(this.lineItems); return getAmountDue(this.lineItems);
}, },
@ -903,6 +891,12 @@ export default {
margin: 0; margin: 0;
} }
.payment-method { .payment-method {
:deep(.almost-done) {
font-family: UrbanistSemibold;
}
:deep(h5) {
margin-bottom: 1rem;
}
.recal-modal { .recal-modal {
:deep(.modal-body) { :deep(.modal-body) {
display: flex; display: flex;

6
src/layouts/payment-method/review-dropdown/review-dropdown.vue
View file

@ -157,11 +157,11 @@ export default {
&:after { &:after {
content: ""; content: "";
transition: all 0.5s ease; transition: all 0.5s ease;
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.9' xml:space='preserve'%3e%3cpath d='M8 8.9c-.2 0-.5-.1-.6-.3L.3 1.5C.1 1.4 0 1.1 0 .9 0 .7.1.4.3.3.4.1.7 0 .9 0c.2 0 .5.1.6.3L8 6.7 14.5.2c.1-.1.4-.2.6-.2.2 0 .5.1.6.3s.3.4.3.6c0 .2-.1.5-.3.6L8.6 8.6c-.1.2-.4.3-.6.3z' fill='%231474a2'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230070D1' d='M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24Zm6.113 11.28-5.52 5.52a.84.84 0 0 1-1.186 0l-5.52-5.52a.843.843 0 1 1 1.186-1.2L12 15.012l4.927-4.932a.843.843 0 1 1 1.186 1.2Z'/%3E%3C/svg%3E");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right center; background-position: right center;
width: 16px; width: 24px;
height: 9px; height: 24px;
display: inline-flex; display: inline-flex;
position: relative; position: relative;
right: 0.75rem; right: 0.75rem;

9
src/layouts/quote/quote.vue
View file

@ -4,8 +4,12 @@
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" /> <funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
<div class="container quote position-relative"> <div class="container quote position-relative">
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-md-6"> <div class="col-12 col-md-10 col-lg-8 col-xl-7">
<funnelSubHeader class="mb-5" cmsWidgetName="FunnelSubHeaderWidget" /> <funnelSubHeader class="mb-5" cmsWidgetName="FunnelSubHeaderWidget" />
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-6">
<cashOrInsuranceQuestion <cashOrInsuranceQuestion
ref="cashOrInsurance" ref="cashOrInsurance"
cmsWidgetName="CashOrInsuranceQuestionWidget" cmsWidgetName="CashOrInsuranceQuestionWidget"
@ -84,9 +88,8 @@
<textBlock <textBlock
cmsWidgetName="quoteDisclaimer" cmsWidgetName="quoteDisclaimer"
justifyText="center"
typeStyle="caption" typeStyle="caption"
class="mb-5 quote-disclaimer" /> class="mb-5 quote-disclaimer text-left text-md-center" />
</div> </div>
</div> </div>

2
src/layouts/vehicle-damage/vehicle-damage.vue
View file

@ -4,7 +4,7 @@
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-12 col-md-10 col-lg-8 col-xl-7"> <div class="col-12 col-md-10 col-lg-8 col-xl-7">
<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" /> <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" class="mb-7"/>
<alert <alert
ref="vehicleChangeAlert" ref="vehicleChangeAlert"
v-if="shouldDisplayVehicleChangeAlert" v-if="shouldDisplayVehicleChangeAlert"

6
src/layouts/vin-lookup/vin-information/vin-information.vue
View file

@ -60,12 +60,12 @@ export default {
&:after { &:after {
content: ""; content: "";
transition: all 0.5s ease; transition: all 0.5s ease;
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.9' xml:space='preserve'%3e%3cpath d='M8 8.9c-.2 0-.5-.1-.6-.3L.3 1.5C.1 1.4 0 1.1 0 .9 0 .7.1.4.3.3.4.1.7 0 .9 0c.2 0 .5.1.6.3L8 6.7 14.5.2c.1-.1.4-.2.6-.2.2 0 .5.1.6.3s.3.4.3.6c0 .2-.1.5-.3.6L8.6 8.6c-.1.2-.4.3-.6.3z' fill='%231474a2'/%3e%3c/svg%3e"); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230070D1' d='M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24Zm6.113 11.28-5.52 5.52a.84.84 0 0 1-1.186 0l-5.52-5.52a.843.843 0 1 1 1.186-1.2L12 15.012l4.927-4.932a.843.843 0 1 1 1.186 1.2Z'/%3E%3C/svg%3E");
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: right center; background-position: right center;
margin-left: 0.5rem; margin-left: 0.5rem;
width: 16px; width: 24px;
height: 9px; height: 24px;
display: inline-flex; display: inline-flex;
} }
&.active:after { &.active:after {