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

style fixes

Browse source
This commit is contained in:
Jason Wheeler 2023-05-22 17:08:54 -04:00
parent a1eeb4e733
commit 9e5845014c
2 changed files with 54 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/layouts/service-packages/service-package-question/service-package-question.vue
View file

@ -170,7 +170,7 @@
}, },
getPackagePriceString(packageName) { getPackagePriceString(packageName) {
const formattedPriceFloat = parseFloat(this.getPackagePrice(packageName)).toFixed(2); const formattedPriceFloat = parseFloat(this.getPackagePrice(packageName)).toFixed(2);
return '$' + formattedPriceFloat; return '$' + formattedPriceFloat + '*';
}, },
getPackagePrice(packageName) { getPackagePrice(packageName) {
let priceFloat = 0; let priceFloat = 0;

80
src/layouts/service-packages/service-packages.vue
View file

@ -1,36 +1,40 @@
<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">
<loadingModal ref="loadingModal" />
<siteHeader cmsWidgetName="SiteHeaderWidget" />
<siteSubHeader cmsWidgetName="SiteSubHeaderWidget"
justification="left"
issContainingPage="service-packages"
class="my-5"/>
<div class="fade-on-route-transition sub-container make-tall"> <div class="fade-on-route-transition sub-container make-tall">
<servicePackageQuestion ref="servicePackage" <siteHeader cmsWidgetName="SiteHeaderWidget" />
cmsWidgetName="ServicePackage" <siteSubHeader cmsWidgetName="SiteSubHeaderWidget"
groupName="ServicePackageQuestion" justification="left"
:availableLineItems="availableLineItems" issContainingPage="service-packages"
@vapsItemsSelected="vapsItemsSelectedAction" />
v-on:link-event="openModalAction" <div class="mx-5">
validationRules="option-required"
isRequired /> <servicePackageQuestion ref="servicePackage"
<textBlock cmsWidgetName="PriceDisclaimerWidget" cmsWidgetName="ServicePackage"
justifyText="left" groupName="ServicePackageQuestion"
typeStyle="caption" :availableLineItems="availableLineItems"
style="margin-bottom: 6rem;" @vapsItemsSelected="vapsItemsSelectedAction"
class="mt-2 mx-6" /> v-on:link-event="openModalAction"
<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" /> validationRules="option-required"
<contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" /> isRequired
<contentGroupModal ref="RearWiperModal" cmsWidgetName="RearWiperModal" /> />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />
<siteFooter cmsWidgetName="SiteFooterWidget" <p class="caption disclaimer" v-html="PriceDisclaimerText"></p>
:isForwardActionDisabled="!meta.valid"
@back-clicked="backButtonAction" <siteFooter cmsWidgetName="SiteFooterWidget"
@ForwardClicked="forwardButtonAction" /> :isForwardActionDisabled="!meta.valid"
@back-clicked="backButtonAction"
@ForwardClicked="forwardButtonAction" />
</div>
</div> </div>
</div> </div>
<loadingModal ref="loadingModal" />
<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
<contentGroupModal ref="FrontWiperModal" cmsWidgetName="FrontWiperModal" />
<contentGroupModal ref="RearWiperModal" cmsWidgetName="RearWiperModal" />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />
</Form> </Form>
</template> </template>
@ -113,6 +117,11 @@
pricedGlassParts: [] pricedGlassParts: []
}; };
}, },
computed: {
PriceDisclaimerText() {
return this.getCmsContent("PriceDisclaimerWidget", "Text");
},
},
methods: { methods: {
openModalAction(modalName) { openModalAction(modalName) {
this.$refs[modalName.args].openModal(); this.$refs[modalName.args].openModal();
@ -159,3 +168,18 @@
} }
}; };
</script> </script>
<style lang="scss">
.subheader-secondary {
margin-top: .5rem;
padding: 0px;
}
.disclaimer {
margin-top: 1.3rem;
a {
color: #4D5151;
font-weight: 400;
}
}
</style>