From 0354702b179ec15bc2eed2967c0b24db41f59d7f Mon Sep 17 00:00:00 2001
From: Michaela Brydon <Michaela.Brydon@safelite.com>
Date: Thu, 30 May 2024 15:47:02 -0400
Subject: [PATCH 1/2] Fixing vehicle lookup styling

---
 .../button-question/button-question.vue       |  5 ++++-
 .../site-sub-header/site-sub-header.vue       |  8 +++++--
 src/layouts/vehicle-lookup/vehicle-lookup.vue | 21 +++++++++++--------
 .../vin-lookup-methods/vin-lookup-methods.vue |  1 +
 4 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue
index 3f9278c4..70bfdea4 100644
--- a/src/digital-components/button-question/button-question.vue
+++ b/src/digital-components/button-question/button-question.vue
@@ -13,7 +13,9 @@
                 'small-question-text': isSmallQuestionText,
                 'small-question-label-text': isSmallQuestionLabelText,
             }">
-            <span class="fw-bold w-100">{{ questionText }}</span>
+            <span
+                class="fw-bold w-100"
+                :class="questionTextClasses">{{ questionText }}</span>
         </div>
         <div class="w-100 d-flex justify-content-center">
             <fieldset
@@ -115,6 +117,7 @@ export default {
         groupName: String,
         questionText: String,
         answers: Array,
+        questionTextClasses: Array,
         textPosition: {
             type: String,
             default: 'text-center'
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 3b4bb21f..0eeed121 100644
--- a/src/iss-components/site-sub-header/site-sub-header.vue
+++ b/src/iss-components/site-sub-header/site-sub-header.vue
@@ -16,8 +16,8 @@
         </div>
         <div
             v-if="hasSubText"
-            class="subheader-secondary d-flex align-items-center overflow-hidden mt-2"
-            :class="[justifySubheader, subHeaderClasses]">
+            :class="[justifySubheader, subHeaderClasses, subHeaderMarginClasses]"
+            class="subheader-secondary d-flex align-items-center overflow-hidden">
             <p
                 class="dark-header"
                 :class="[alternateFormatting, subTextClasses]">
@@ -52,6 +52,10 @@ export default {
         stripRteStyle: Boolean,
         subContentProperty: String,
         subHeaderClasses: String,
+        subHeaderMarginClasses: {
+            type: String,
+            default: 'mt-2'
+        },
         subTextClasses: String
     },
     emits: ['click-event'],
diff --git a/src/layouts/vehicle-lookup/vehicle-lookup.vue b/src/layouts/vehicle-lookup/vehicle-lookup.vue
index df4004c7..3e3e7156 100644
--- a/src/layouts/vehicle-lookup/vehicle-lookup.vue
+++ b/src/layouts/vehicle-lookup/vehicle-lookup.vue
@@ -1,5 +1,7 @@
 <template>
-    <Form @submit="onSubmit" @invalidSubmit="onInvalidSubmit">
+    <Form
+@submit="onSubmit"
+@invalidSubmit="onInvalidSubmit">
         <div class="container-fluid fade-on-route-transition">
             <div class="row justify-content-center">
                 <div class="col-md-6 px-0 px-md-2">
@@ -15,7 +17,8 @@
                             :displayGenericVehicleImage="false" />
                         <SiteSubHeader
                             cmsWidgetName="SiteSubHeaderWidget"
-                            class="mt-5 mb-2" />
+                            class="mb-2"
+                            subHeaderMarginClasses="mt-1" />
                         <VinLookupMethods
                             ref="VinLookupMethods"
                             v-model="selectedVinLookupMethod"
@@ -57,7 +60,7 @@ export default {
         SiteHeader,
         SiteSubHeader,
         VehicleBanner,
-        VinLookupMethods,
+        VinLookupMethods
     },
     mixins: [BaseFormMixin],
     async beforeRouteEnter(to, from, next) {
@@ -67,8 +70,8 @@ export default {
         const promiseResultMap = [
             {
                 resultKey: 'cmsContent',
-                promise: cmsContentPromise,
-            },
+                promise: cmsContentPromise
+            }
         ];
 
         const resultMap = await settleAllPromises(promiseResultMap);
@@ -80,13 +83,13 @@ export default {
     },
     data() {
         return {
-            selectedVinLookupMethod: null,
+            selectedVinLookupMethod: null
         };
     },
     computed: {
         isForwardActionDisabled() {
             return this.selectedVinLookupMethod === null;
-        },
+        }
     },
     methods: {
         arePagePrerequisiteValid() {
@@ -116,7 +119,7 @@ export default {
                     break;
             }
         },
-        resetDependentState() {},
-    },
+        resetDependentState() {}
+    }
 };
 </script>
diff --git a/src/layouts/vehicle-lookup/vin-lookup-methods/vin-lookup-methods.vue b/src/layouts/vehicle-lookup/vin-lookup-methods/vin-lookup-methods.vue
index 00288eab..6c92856a 100644
--- a/src/layouts/vehicle-lookup/vin-lookup-methods/vin-lookup-methods.vue
+++ b/src/layouts/vehicle-lookup/vin-lookup-methods/vin-lookup-methods.vue
@@ -5,6 +5,7 @@
     groupName="VinLookupMethodsOption"
     buttonTypeString="listButton"
     :questionText="questionTextFromCms"
+    :questionTextClasses="['text-center']"
     isRequired
     :validationRules="rules.optionRequired"
     data-test-id="vin-lookup-methods-button-question" />

From f7288f3d1da7f7cc92b9a7d4bb0e1b19aef8d3de Mon Sep 17 00:00:00 2001
From: Michaela Brydon <Michaela.Brydon@safelite.com>
Date: Thu, 30 May 2024 16:10:40 -0400
Subject: [PATCH 2/2] Fixing vin lookup style

---
 src/digital-components/text-block/text-block.vue | 3 ++-
 src/layouts/vin-lookup/vin-lookup.vue            | 4 +++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/digital-components/text-block/text-block.vue b/src/digital-components/text-block/text-block.vue
index c9c98e7b..483c8c48 100644
--- a/src/digital-components/text-block/text-block.vue
+++ b/src/digital-components/text-block/text-block.vue
@@ -7,6 +7,7 @@
         :key="copy">
             <span v-if="doesCopyContainRouterLink(copy)">
                 <routerLink
+                    class="bold"
                     :to="{
                         query: { issPage: `${getRouterLinkRouteFromCopy(copy)}` },
                         name: 'root',
@@ -102,7 +103,7 @@ export default {
     &.center {
         text-align: center;
     }
-    &.bold {
+    .bold {
         font-weight: 500;
     }
     &.dark {
diff --git a/src/layouts/vin-lookup/vin-lookup.vue b/src/layouts/vin-lookup/vin-lookup.vue
index 5517b3ac..cf6a7558 100644
--- a/src/layouts/vin-lookup/vin-lookup.vue
+++ b/src/layouts/vin-lookup/vin-lookup.vue
@@ -17,7 +17,9 @@
                             class="mt-2 mb-4"
                             cmsWidgetName="VehicleBannerWidget"
                             :displayGenericVehicleImage="!carIdIsValid" />
-                        <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
+                        <siteSubHeader
+                            cmsWidgetName="SiteSubHeaderWidget"
+                            subHeaderMarginClasses="mt-1" />
                         <vinLookupAlerts
                             class="mt-5"
                             :activeAlertType="activeVehicleLookupAlertType" />