policy vehicle update

src/layouts/policy-vehicles/policy-vehicles.vue

@@ -4,29 +4,23 @@
         v-slot="{ meta }"
         @submit="onSubmit"
         @invalidSubmit="onInvalidSubmit">
-        <div class="container-fluid fade-on-route-transition policy-vehicles">
-            <div class="row justify-content-center">
-                <div class="col-md-6 px-0 px-md-2">
-                    <siteHeader
-                        class="mb-2 header"
-                        cmsWidgetName="SiteHeaderWidget" />
-                </div>
+        <div class="fade-on-route-transition policy-vehicles">
+            <div class="justify-content-center">
+                <siteHeader
+                    class="header"
+                    cmsWidgetName="SiteHeaderWidget" />
             </div>
-            <div class="row justify-content-center">
-                <div class="col-md-6 col-xl-4">
+            <div class="iss-heritage-container-width">
+                <div class="policy-vehicles-container iss-heritage-content-container-width">
                     <div class="select-car-form rounded text-center">
-                        <vehicleBanner
-                            cmsWidgetName="VehicleBannerWidget"
-                            :displayGenericVehicleImage="displayGeneric"
-                            class="mt-2" />
                         <policyVehiclesQuestion
                             v-model="selectedVehicleVin"
                             cmsWidgetName="PolicyVehiclesQuestion"
                             :vehicles="VehiclesForQuestions"
                             :validationRules="rules.optionRequired" />
                         <alert
-                            ref="AlertNoService"
                             v-if="displayNoServiceAlert"
+                            ref="AlertNoService"
                             class="mt-3"
                             cmsWidgetName="AlertVehicleSelection"
                             alertClass="alert-danger"
@@ -47,7 +41,6 @@
 // Components
 import siteHeader from '@/iss-components/site-header/site-header.vue';
 import siteFooter from '@/iss-components/site-footer/site-footer.vue';
-import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
 import policyVehiclesQuestion from '@/layouts/policy-vehicles/policy-vehicles-question/policy-vehicles-question.vue';
 // Supporting files
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper.js';
@@ -72,7 +65,6 @@ export default {
     components: {
         siteHeader,
         siteFooter,
-        vehicleBanner,
         policyVehiclesQuestion,
         // eslint-disable-next-line vue/no-reserved-component-names
         Form,
@@ -94,7 +86,6 @@ export default {
         return {
             policyVehicles,
             selectedVehicleVin: '',
-            displayGeneric: true,
             policyVinFound: true,
             rules: {
                 optionRequired: globalRules.OPTION_REQUIRED
@@ -150,7 +141,6 @@ export default {
             if (value === vehicleSelectionOptions.VEHICLE_NOT_LISTED) {
                 // clear previously selected vehicle and image
                 this.mainStore.resetVehicleState();
-                this.displayGeneric = true;
             } else {
                 // get vehicle details from selected VIN
                 const vehicle = await this.lookupVehicleByVin(value);
@@ -158,7 +148,6 @@ export default {
                 // handle error in case vehicle info doesn't come back for selected VIN
                 if (vehicle?.error === true) {
                     this.mainStore.resetVehicleState();
-                    this.displayGeneric = true;
                     return;
                 }
                 if (!vehicle?.data.canSafeliteService) {
@@ -167,7 +156,6 @@ export default {
                 }
                 if (vehicle) {
                     // save selected vehicle to the store
-                    this.displayGeneric = false;
                     useMainStore().updateVehicle({
                         ...vehicle.data,
                         policyVehicleId: this.selectedPolicyVehicle?.id,
@@ -232,8 +220,7 @@ export default {
                     repairWaived: this.repairWaivedForSelectedVehicle,
                     endorsements: this.endorsementsForSelectedVehicle
                 });
-            }
-            else {
+            } else {
                 useMainStore().updateCoverageType(coverageType.NONE);
             }
             return this.navigateForward();
@@ -292,6 +279,15 @@ export default {
 };
 </script>
 <style lang="scss">
+.iss-heritage-container-width {
+    .policy-vehicles-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
+    }
+}
+
 .policy-vehicles {
     .button-question {
         .question-text {