From 3dc2e6bcaa9f5db09684d2051ff2693200fae74e Mon Sep 17 00:00:00 2001
From: Max <maxwell.dempsey@safelite.com>
Date: Wed, 22 Dec 2021 09:47:21 -0500
Subject: [PATCH 1/2] fixing overflow issue

---
 .../funnel-sub-header/funnel-sub-header.vue              | 2 +-
 src/ux-components/list-button/list-button.vue            | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/common-components/funnel-sub-header/funnel-sub-header.vue b/src/common-components/funnel-sub-header/funnel-sub-header.vue
index a5d23a2e7..444674440 100644
--- a/src/common-components/funnel-sub-header/funnel-sub-header.vue
+++ b/src/common-components/funnel-sub-header/funnel-sub-header.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="current_car_info-text">
-    <div class="d-flex align-items-center justify-content-center container-fluid">
+    <div class="d-flex align-items-center justify-content-center container-fluid overflow-hidden">
       <h2 class="text-center fs-5 d-block fw-normal mb-0">
         <span>
           {{ text }}
diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue
index 49109fb28..b6dbb4375 100644
--- a/src/ux-components/list-button/list-button.vue
+++ b/src/ux-components/list-button/list-button.vue
@@ -1,15 +1,16 @@
 <template>
   <!-- See the component-test.vue page for example implementation -->
-  <div v-if="isMultiSelect" class="list-group list-button d-flex flex-column w-100 mb-2">
-    <input type="checkbox" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired">
+  <div class="list-group list-button d-flex flex-column w-100 mb-2">
+    <input :type="isMultiSelect ? 'checkbox' : 'radio'" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired">
     <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
       <span v-if="buttonLabelSubCopy" class="m-0 small" :class="[this.textPosition]">{{buttonLabelSubCopy}}</span>
       <span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>
+      <loader v-if="!isMultiSelect && isLoaderDisplayed" :style="{width: `${sizeInRem}rem`, height: `${sizeInRem}rem`}" :class="[this.loaderColor, this.loaderPosition]" />
   </label>
   <p class="small">{{errorMessage}}</p>
   </div>
-  <div v-else class="list-group list-button d-flex flex-column w-100 mb-2">
+  <!-- <div v-else class="list-group list-button d-flex flex-column w-100 mb-2">
     <input type="radio" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired" @keyup.space="displayLoader()">
     <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" @click="displayLoader()">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
@@ -18,7 +19,7 @@
     <loader v-if="isLoaderDisplayed" :style="{width: `${sizeInRem}rem`, height: `${sizeInRem}rem`}" :class="[this.loaderColor, this.loaderPosition]" />
   </label>
   <p class="small">{{errorMessage}}</p>
-</div>
+</div> -->
 </template>
 
 <script>

From 82eb126015200b0d3a19928d5012c3563b406387 Mon Sep 17 00:00:00 2001
From: Max <maxwell.dempsey@safelite.com>
Date: Wed, 22 Dec 2021 09:48:14 -0500
Subject: [PATCH 2/2] overflow fix

---
 src/ux-components/list-button/list-button.vue | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue
index b6dbb4375..49109fb28 100644
--- a/src/ux-components/list-button/list-button.vue
+++ b/src/ux-components/list-button/list-button.vue
@@ -1,16 +1,15 @@
 <template>
   <!-- See the component-test.vue page for example implementation -->
-  <div class="list-group list-button d-flex flex-column w-100 mb-2">
-    <input :type="isMultiSelect ? 'checkbox' : 'radio'" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired">
+  <div v-if="isMultiSelect" class="list-group list-button d-flex flex-column w-100 mb-2">
+    <input type="checkbox" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired">
     <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
       <span v-if="buttonLabelSubCopy" class="m-0 small" :class="[this.textPosition]">{{buttonLabelSubCopy}}</span>
       <span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>
-      <loader v-if="!isMultiSelect && isLoaderDisplayed" :style="{width: `${sizeInRem}rem`, height: `${sizeInRem}rem`}" :class="[this.loaderColor, this.loaderPosition]" />
   </label>
   <p class="small">{{errorMessage}}</p>
   </div>
-  <!-- <div v-else class="list-group list-button d-flex flex-column w-100 mb-2">
+  <div v-else class="list-group list-button d-flex flex-column w-100 mb-2">
     <input type="radio" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired" @keyup.space="displayLoader()">
     <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" @click="displayLoader()">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
@@ -19,7 +18,7 @@
     <loader v-if="isLoaderDisplayed" :style="{width: `${sizeInRem}rem`, height: `${sizeInRem}rem`}" :class="[this.loaderColor, this.loaderPosition]" />
   </label>
   <p class="small">{{errorMessage}}</p>
-</div> -->
+</div>
 </template>
 
 <script>