+
+
+
+
+
diff --git a/src/iss-components/questions-page-layout/questions-page-layout.spec.js b/src/iss-components/questions-page-layout/questions-page-layout.spec.js
index ebfb53ac..855ae439 100644
--- a/src/iss-components/questions-page-layout/questions-page-layout.spec.js
+++ b/src/iss-components/questions-page-layout/questions-page-layout.spec.js
@@ -19,60 +19,6 @@ jest.mock('@/helpers/cms-content-helper', () => ({
}));
function setupMocks() {
- // TODO: Use or delete these
- const unused1 = () => ({
- partsOrQuestions: [
- {
- parts: null,
- partQuestions: [
- {
- questionSequence: 1,
- questionText:
- 'Is your vehicle equipped with the Panoramic Sunroof which can be identified by having a glass panel over the rear seats?',
- answers: [
- {
- answerResult: '',
- answerText: 'Yes',
- nextQuestionSequence: 2
- },
- {
- answerResult: '',
- answerText: 'No',
- nextQuestionSequence: 3
- }
- ]
- }
- ],
- glassLocation: 'Windshield',
- glassName: 'Single',
- answerKey: 'Windshield-Single',
- answerData: null
- }
- ]
- });
- const unused2 = () => ({
- partsQuestionAnswers: [
- {
- glassLocation: 'Windshield',
- glassName: 'Single',
- result: 'FW04848',
- answeredQuestions: [
- {
- questionText:
- 'Is your vehicle equipped with the Panoramic Sunroof which can be identified by having a glass panel over the rear seats?',
- selectedAnswerText: 'Yes',
- questionNum: 1
- },
- {
- questionText:
- 'Is your vehicle equipped with a heated windshield that melts snow and ice from underneath the windshield wiper blades?',
- selectedAnswerText: 'Yes',
- questionNum: 2
- }
- ]
- }
- ]
- });
const mountOptions = getMountOptions({
mixins: [baseMixin, vehicleQuestionsMixin]
});
diff --git a/src/iss-components/questions-page-layout/questions-page-layout.vue b/src/iss-components/questions-page-layout/questions-page-layout.vue
index 999c3385..6be20312 100644
--- a/src/iss-components/questions-page-layout/questions-page-layout.vue
+++ b/src/iss-components/questions-page-layout/questions-page-layout.vue
@@ -1,18 +1,13 @@
-
+
+
+
+
+ ![Powered by Safelite Solutions]()
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
-
-
-
+
+
+
-
-
-
+
+
// Components
import siteHeader from '@/iss-components/site-header/site-header.vue';
-import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
import alert from '@/ux-components/alert/alert.vue';
import questionChain from '@/digital-components/question-chain/question-chain.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
-import loadingModal from '@/iss-components/loading-modal/loading-modal.vue';
export default {
name: 'questions-page',
components: {
siteHeader,
- vehicleBanner,
alert,
questionChain,
siteSubHeader,
- siteFooter,
- loadingModal,
+ siteFooter
},
props: {
isMetaValid: Boolean,
@@ -74,7 +65,7 @@ export default {
validationRules: String,
modelValue: Object,
loadingText: Array,
- index: Number,
+ index: Number
},
emits: ['update:modelValue', 'forwardButtonAction', 'back-click'],
computed: {
@@ -84,16 +75,16 @@ export default {
},
set(newValue) {
this.$emit('update:modelValue', newValue);
- },
- },
+ }
+ }
},
methods: {
showThisQuestionChain(glass, i) {
// return false if no questions or if suppressed
if (
- !glass.questions ||
- glass.questions?.length < 1 ||
- glass.isSuppressedPart
+ !glass.questions
+ || glass.questions?.length < 1
+ || glass.isSuppressedPart
) {
return false;
}
@@ -106,15 +97,21 @@ export default {
},
handleBackButtonAction() {
this.$emit('back-click');
- },
- showLoadingModal() {
- this.$refs.loadingModal.showModal();
- },
- },
+ }
+ }
};
diff --git a/src/iss-components/site-footer/site-footer.vue b/src/iss-components/site-footer/site-footer.vue
index fd41ea76..1cf0f21e 100644
--- a/src/iss-components/site-footer/site-footer.vue
+++ b/src/iss-components/site-footer/site-footer.vue
@@ -49,7 +49,6 @@
diff --git a/src/iss-components/site-sub-header/site-sub-header.vue b/src/iss-components/site-sub-header/site-sub-header.vue
index 34b4bbd8..b58be168 100644
--- a/src/iss-components/site-sub-header/site-sub-header.vue
+++ b/src/iss-components/site-sub-header/site-sub-header.vue
@@ -1,10 +1,10 @@
+ class="subheader-primary d-flex overflow-hidden">
+ :class="[justifySubheaderSubText, headerColor]"
+ class="fw-normal mb-0 subheader-primary">
{{ content }}
@@ -49,6 +49,7 @@ export default {
hasBackButton: Boolean,
issContainingPage: String,
justification: String,
+ justificationSubText: String,
stripRteStyle: Boolean,
subContentProperty: String,
subHeaderClasses: String,
@@ -108,6 +109,11 @@ export default {
? 'justify-content-left'
: 'justify-content-center';
},
+ justifySubheaderSubText() {
+ return this.justificationSubText?.toLowerCase() === 'center'
+ ? 'justify-content-center'
+ : 'justify-content-left';
+ },
alternateFormatting() {
// override for service-packages unique style
if (this.issContainingPage?.toLowerCase() === 'service-packages') {
@@ -147,6 +153,12 @@ h5 {
span {
color: $black;
}
+ &.justify-content-center {
+ text-align: center;
+ }
+ &.justify-content-left {
+ text-align: left;
+ }
}
p {
margin: 0;
@@ -167,7 +179,10 @@ p {
.subheader-secondary {
p {
- font-size: .875rem;
+ margin-bottom: 1.25rem;
+ color: #525656;
+ font-size: 1rem;
+ line-height: 1.56;
&.justify-content-center {
text-align: center;
}
diff --git a/src/iss-components/vehicle-banner/vehicle-banner.spec.js b/src/iss-components/vehicle-banner/vehicle-banner.spec.js
deleted file mode 100644
index 1eac7cf3..00000000
--- a/src/iss-components/vehicle-banner/vehicle-banner.spec.js
+++ /dev/null
@@ -1,114 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import vehicleCategories from '@/constants/vehicle-categories.js';
-import { useMainStore } from '@/store';
-import { createApp } from 'vue';
-import { createPinia, mapStores } from 'pinia';
-
-import App from '@/App.vue';
-import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
-
-const cmsData = { VehicleBannerWidget:
- {
- GenericVehicleImage: 'blurred-image.jpg',
- GenericVehicleImageFilePath: 'images/default-source/default-album/blurred-image.jpg',
- CarUnmatchedVehicleIcon: 'car-placeholder.jpg',
- TruckUnmatchedVehicleIcon: 'truck-placeholder.jpg',
- VanUnmatchedVehicleIcon: 'van-placeholder.jpg',
- CommercialVanUnmatchedVehicleIcon: 'commercial-placeholder.jpg',
- SuvUnmatchedVehicleIcon: 'suv-placeholder.jpg'
- } };
-
-const vueApp = createApp(App);
-const pinia = createPinia();
-vueApp.use(pinia);
-const store = useMainStore();
-
-const mockMixin = {
-
- methods: {
- getCmsContent(widgetName, fieldName) {
- return cmsData[widgetName][fieldName];
- }
- },
- computed: {
- ...mapStores(useMainStore),
- vehicleCategories() {
- return vehicleCategories;
- }
- }
-};
-
-describe('vehicleBanner', () => {
- test('renders the blurrycar image when displayGenericVehicleImage is true', async () => {
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: true,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- expect(wrapper.vm.vehicleImageToDisplay).toEqual(wrapper.vm.genericVehicleImage);
- expect(wrapper.find('img').attributes('class')).toContain('vehicle-image');
- wrapper.unmount();
- });
-
- test('renders expected vehicle image', async () => {
- store.order.vehicle.imageUrl = 'url_to_vehicle_image';
-
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: false,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- expect(wrapper.vm.vehicleImageToDisplay).toEqual('url_to_vehicle_image');
- expect(wrapper.find('img').attributes('class')).toContain('vehicle-image');
- wrapper.unmount();
- });
-
- test('should render default car icon when imageUrl is null and category is default', async () => {
- store.order.vehicle.imageUrl = null;
-
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: false,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- const iconUrl = wrapper.vm.vehicleImageToDisplay;
-
- expect(iconUrl).toEqual('car-placeholder.jpg');
- wrapper.unmount();
- });
-
- const params = [['CAR', 'car-placeholder.jpg'],
- ['TRUCK', 'truck-placeholder.jpg'],
- ['VAN', 'van-placeholder.jpg'],
- ['COMMERCIAL VAN', 'commercial-placeholder.jpg'],
- ['SUV', 'suv-placeholder.jpg'],
- ['OTHER', 'car-placeholder.jpg']];
-
- test.each(params)('renders correct icon when imageUrl is not populated for %s and %s', async (category, expectedIcon) => {
- store.order.vehicle.imageUrl = null;
- store.order.vehicle.category = category;
-
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: false,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- const vehicleIcon = wrapper.vm.getUnmatchedVehicleIcon();
-
- expect(vehicleIcon).toEqual(expectedIcon);
- expect(wrapper.find('img').attributes('class')).toContain('vehicle-image');
- wrapper.unmount();
- });
-});
diff --git a/src/iss-components/vehicle-banner/vehicle-banner.vue b/src/iss-components/vehicle-banner/vehicle-banner.vue
deleted file mode 100644
index 6a17a3b7..00000000
--- a/src/iss-components/vehicle-banner/vehicle-banner.vue
+++ /dev/null
@@ -1,84 +0,0 @@
-
-
+ :class="[justifySubheaderSubText, headerColor]"
+ class="fw-normal mb-0 subheader-primary">
{{ content }}
@@ -49,6 +49,7 @@ export default {
hasBackButton: Boolean,
issContainingPage: String,
justification: String,
+ justificationSubText: String,
stripRteStyle: Boolean,
subContentProperty: String,
subHeaderClasses: String,
@@ -108,6 +109,11 @@ export default {
? 'justify-content-left'
: 'justify-content-center';
},
+ justifySubheaderSubText() {
+ return this.justificationSubText?.toLowerCase() === 'center'
+ ? 'justify-content-center'
+ : 'justify-content-left';
+ },
alternateFormatting() {
// override for service-packages unique style
if (this.issContainingPage?.toLowerCase() === 'service-packages') {
@@ -147,6 +153,12 @@ h5 {
span {
color: $black;
}
+ &.justify-content-center {
+ text-align: center;
+ }
+ &.justify-content-left {
+ text-align: left;
+ }
}
p {
margin: 0;
@@ -167,7 +179,10 @@ p {
.subheader-secondary {
p {
- font-size: .875rem;
+ margin-bottom: 1.25rem;
+ color: #525656;
+ font-size: 1rem;
+ line-height: 1.56;
&.justify-content-center {
text-align: center;
}
diff --git a/src/iss-components/vehicle-banner/vehicle-banner.spec.js b/src/iss-components/vehicle-banner/vehicle-banner.spec.js
deleted file mode 100644
index 1eac7cf3..00000000
--- a/src/iss-components/vehicle-banner/vehicle-banner.spec.js
+++ /dev/null
@@ -1,114 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import vehicleCategories from '@/constants/vehicle-categories.js';
-import { useMainStore } from '@/store';
-import { createApp } from 'vue';
-import { createPinia, mapStores } from 'pinia';
-
-import App from '@/App.vue';
-import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
-
-const cmsData = { VehicleBannerWidget:
- {
- GenericVehicleImage: 'blurred-image.jpg',
- GenericVehicleImageFilePath: 'images/default-source/default-album/blurred-image.jpg',
- CarUnmatchedVehicleIcon: 'car-placeholder.jpg',
- TruckUnmatchedVehicleIcon: 'truck-placeholder.jpg',
- VanUnmatchedVehicleIcon: 'van-placeholder.jpg',
- CommercialVanUnmatchedVehicleIcon: 'commercial-placeholder.jpg',
- SuvUnmatchedVehicleIcon: 'suv-placeholder.jpg'
- } };
-
-const vueApp = createApp(App);
-const pinia = createPinia();
-vueApp.use(pinia);
-const store = useMainStore();
-
-const mockMixin = {
-
- methods: {
- getCmsContent(widgetName, fieldName) {
- return cmsData[widgetName][fieldName];
- }
- },
- computed: {
- ...mapStores(useMainStore),
- vehicleCategories() {
- return vehicleCategories;
- }
- }
-};
-
-describe('vehicleBanner', () => {
- test('renders the blurrycar image when displayGenericVehicleImage is true', async () => {
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: true,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- expect(wrapper.vm.vehicleImageToDisplay).toEqual(wrapper.vm.genericVehicleImage);
- expect(wrapper.find('img').attributes('class')).toContain('vehicle-image');
- wrapper.unmount();
- });
-
- test('renders expected vehicle image', async () => {
- store.order.vehicle.imageUrl = 'url_to_vehicle_image';
-
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: false,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- expect(wrapper.vm.vehicleImageToDisplay).toEqual('url_to_vehicle_image');
- expect(wrapper.find('img').attributes('class')).toContain('vehicle-image');
- wrapper.unmount();
- });
-
- test('should render default car icon when imageUrl is null and category is default', async () => {
- store.order.vehicle.imageUrl = null;
-
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: false,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- const iconUrl = wrapper.vm.vehicleImageToDisplay;
-
- expect(iconUrl).toEqual('car-placeholder.jpg');
- wrapper.unmount();
- });
-
- const params = [['CAR', 'car-placeholder.jpg'],
- ['TRUCK', 'truck-placeholder.jpg'],
- ['VAN', 'van-placeholder.jpg'],
- ['COMMERCIAL VAN', 'commercial-placeholder.jpg'],
- ['SUV', 'suv-placeholder.jpg'],
- ['OTHER', 'car-placeholder.jpg']];
-
- test.each(params)('renders correct icon when imageUrl is not populated for %s and %s', async (category, expectedIcon) => {
- store.order.vehicle.imageUrl = null;
- store.order.vehicle.category = category;
-
- const wrapper = shallowMount(vehicleBanner, {
- propsData: {
- displayGenericVehicleImage: false,
- cmsWidgetName: 'VehicleBannerWidget'
- },
- mixins: [mockMixin]
- });
-
- const vehicleIcon = wrapper.vm.getUnmatchedVehicleIcon();
-
- expect(vehicleIcon).toEqual(expectedIcon);
- expect(wrapper.find('img').attributes('class')).toContain('vehicle-image');
- wrapper.unmount();
- });
-});
diff --git a/src/iss-components/vehicle-banner/vehicle-banner.vue b/src/iss-components/vehicle-banner/vehicle-banner.vue
deleted file mode 100644
index 6a17a3b7..00000000
--- a/src/iss-components/vehicle-banner/vehicle-banner.vue
+++ /dev/null
@@ -1,84 +0,0 @@
-
-
- ![]()
-
-
-
-
-
-
diff --git a/src/layouts/access-denied/access-denied.vue b/src/layouts/access-denied/access-denied.vue
index f43d786f..d329343b 100644
--- a/src/layouts/access-denied/access-denied.vue
+++ b/src/layouts/access-denied/access-denied.vue
@@ -1,4 +1,5 @@
+
+
+
diff --git a/src/layouts/address-vehicles/address-vehicles.vue b/src/layouts/address-vehicles/address-vehicles.vue
index 6f57e98a..0510ad5f 100644
--- a/src/layouts/address-vehicles/address-vehicles.vue
+++ b/src/layouts/address-vehicles/address-vehicles.vue
@@ -4,19 +4,15 @@
v-slot="{ meta }"
@submit="onSubmit"
@invalidSubmit="onInvalidSubmit">
-
-
-
-
-
diff --git a/src/layouts/contact-confirmation/contact-confirmation.vue b/src/layouts/contact-confirmation/contact-confirmation.vue
index 9496fb30..29c52745 100644
--- a/src/layouts/contact-confirmation/contact-confirmation.vue
+++ b/src/layouts/contact-confirmation/contact-confirmation.vue
@@ -1,19 +1,19 @@
-
-
-
+
diff --git a/src/layouts/contact-details/contact-details.vue b/src/layouts/contact-details/contact-details.vue
index bd710d18..7e0b22f1 100644
--- a/src/layouts/contact-details/contact-details.vue
+++ b/src/layouts/contact-details/contact-details.vue
@@ -4,16 +4,14 @@
v-slot="{ meta }"
@submit="onSubmit"
@invalidSubmit="onInvalidSubmit">
-
-
-
-
diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 165fb775..3103ada2 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -4,17 +4,16 @@
v-slot="{ meta }"
@submit="onSubmit"
@invalidSubmit="onInvalidSubmit">
-
-
-
-
diff --git a/src/layouts/vehicle-parts/vehicle-parts.spec.js b/src/layouts/vehicle-parts/vehicle-parts.spec.js
index 50459f63..cd7d01e9 100644
--- a/src/layouts/vehicle-parts/vehicle-parts.spec.js
+++ b/src/layouts/vehicle-parts/vehicle-parts.spec.js
@@ -62,10 +62,6 @@ function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = {}
const apiResponses = {
cmsContent: {
SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
- VehicleBannerWidget: {
- GenericVehicleImage:
- `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`
- },
FunnelHeaderWidget: {
LogoImage:
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`
diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue
index 24bf1fc1..101e3771 100644
--- a/src/layouts/vehicle-parts/vehicle-parts.vue
+++ b/src/layouts/vehicle-parts/vehicle-parts.vue
@@ -1,47 +1,36 @@
-
-
-
+
+
+
-
-
-
+
+
-
diff --git a/src/layouts/contact-confirmation/contact-confirmation.vue b/src/layouts/contact-confirmation/contact-confirmation.vue
index 9496fb30..29c52745 100644
--- a/src/layouts/contact-confirmation/contact-confirmation.vue
+++ b/src/layouts/contact-confirmation/contact-confirmation.vue
@@ -1,19 +1,19 @@
-
-
-
+
diff --git a/src/layouts/contact-details/contact-details.vue b/src/layouts/contact-details/contact-details.vue
index bd710d18..7e0b22f1 100644
--- a/src/layouts/contact-details/contact-details.vue
+++ b/src/layouts/contact-details/contact-details.vue
@@ -4,16 +4,14 @@
v-slot="{ meta }"
@submit="onSubmit"
@invalidSubmit="onInvalidSubmit">
-
-
-
-
+
+
+
-
-
+
+
diff --git a/src/layouts/policy-holder-details/policy-holder-details.vue b/src/layouts/policy-holder-details/policy-holder-details.vue
index 165fb775..3103ada2 100644
--- a/src/layouts/policy-holder-details/policy-holder-details.vue
+++ b/src/layouts/policy-holder-details/policy-holder-details.vue
@@ -4,17 +4,16 @@
v-slot="{ meta }"
@submit="onSubmit"
@invalidSubmit="onInvalidSubmit">
-
-
-
-
+
+
+
-
-
+
+
diff --git a/src/layouts/vehicle-parts/vehicle-parts.spec.js b/src/layouts/vehicle-parts/vehicle-parts.spec.js
index 50459f63..cd7d01e9 100644
--- a/src/layouts/vehicle-parts/vehicle-parts.spec.js
+++ b/src/layouts/vehicle-parts/vehicle-parts.spec.js
@@ -62,10 +62,6 @@ function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = {}
const apiResponses = {
cmsContent: {
SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
- VehicleBannerWidget: {
- GenericVehicleImage:
- `${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`
- },
FunnelHeaderWidget: {
LogoImage:
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`
diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue
index 24bf1fc1..101e3771 100644
--- a/src/layouts/vehicle-parts/vehicle-parts.vue
+++ b/src/layouts/vehicle-parts/vehicle-parts.vue
@@ -1,47 +1,36 @@
-