From c1d14593af9926a4cc9a68427679728d3ec312e1 Mon Sep 17 00:00:00 2001
From: Bill Richardson <william.richardson@safelite.com>
Date: Wed, 3 Dec 2025 11:30:58 -0500
Subject: [PATCH] more updates

several more pages
---
 src/layouts/bailout-page/bailout-page.vue     | 25 +++++----
 .../contact-confirmation.vue                  | 38 ++++++++------
 .../contact-details/contact-details.vue       | 25 +++++----
 .../provider-preference.vue                   | 35 +++++++------
 src/layouts/schedule-page/schedule-page.vue   | 25 +++++----
 .../service-location/service-location.vue     | 51 ++++++++++---------
 src/styles/client-customizations.scss         |  4 --
 7 files changed, 114 insertions(+), 89 deletions(-)

diff --git a/src/layouts/bailout-page/bailout-page.vue b/src/layouts/bailout-page/bailout-page.vue
index 692837e1..a84f0dfe 100644
--- a/src/layouts/bailout-page/bailout-page.vue
+++ b/src/layouts/bailout-page/bailout-page.vue
@@ -4,16 +4,14 @@
         v-slot="{ meta }"
         @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">
-                    <siteHeader
-                        ref="siteHeader"
-                        cmsWidgetName="SiteHeaderWidget" />
-                </div>
+        <div class="fade-on-route-transition">
+            <div class="justify-content-center">
+                <siteHeader
+                    ref="siteHeader"
+                    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="bailout-page-container iss-heritage-content-container-width">
                     <siteSubHeader
                         ref="siteSubHeader"
                         :cmsWidgetName="subHeaderCmsWidgetName"
@@ -225,4 +223,13 @@ export default {
 
 <style lang="scss">
 @import '@/styles/bailout-common.scss';
+
+.iss-heritage-container-width {
+    .bailout-page-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
+    }
+}
 </style>
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 @@
 <template>
-    <div class="container-fluid fade-on-route-transition">
-        <div class="row justify-content-center">
-            <div class="col-md-6 px-0 px-md-2">
+    <form>
+        <div class="fade-on-route-transition">
+            <div class="justify-content-center">
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
             </div>
-        </div>
-        <div class="row justify-content-center">
-            <div class="col-md-6 col-xl-4">
-                <siteSubHeader
-                    cmsWidgetName="SiteSubHeaderWidget"
-                    class="sub-header-content"
-                    justification="left" />
+            <div class="iss-heritage-container-width">
+                <div class="contact-confirmation-container iss-heritage-content-container-width">
+                    <siteSubHeader
+                        cmsWidgetName="SiteSubHeaderWidget"
+                        class="sub-header-content mt-4"
+                        justification="left" />
+                </div>
             </div>
         </div>
-    </div>
+    </form>
 </template>
 <script>
 // Components
@@ -64,9 +64,17 @@ export default {
 </script>
 
 <style lang="scss">
-    .sub-header-content {
-        h5 {
-            margin-bottom: 1rem;
-        }
+.iss-heritage-container-width {
+    .contact-confirmation-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
     }
+}
+.sub-header-content {
+    h5 {
+        margin-bottom: 1rem;
+    }
+}
 </style>
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">
-        <div class="container-fluid fade-on-route-transition">
-            <div class="row justify-content-center">
-                <div class="col-md-6 px-0 px-md-2">
-                    <siteHeader
-                        ref="siteHeader"
-                        :cmsWidgetName="widget.siteHeader" />
-                </div>
+        <div class="fade-on-route-transition">
+            <div class="justify-content-center">
+                <siteHeader
+                    ref="siteHeader"
+                    :cmsWidgetName="widget.siteHeader" />
             </div>
-            <div class="row justify-content-center">
-                <div class="col-md-6 col-xl-4">
+            <div class="iss-heritage-container-width">
+                <div class="contact-details-container iss-heritage-content-container-width">
                     <siteSubHeader
                         id="sub-header"
                         ref="siteSubHeader"
@@ -236,6 +234,15 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.iss-heritage-container-width {
+    .contact-details-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
+    }
+}
+
 .dark-gray {
     color: $darker-gray;
 }
diff --git a/src/layouts/provider-preference/provider-preference.vue b/src/layouts/provider-preference/provider-preference.vue
index f00fd2a9..ca3b7593 100644
--- a/src/layouts/provider-preference/provider-preference.vue
+++ b/src/layouts/provider-preference/provider-preference.vue
@@ -1,26 +1,20 @@
 <template>
     <Form
-ref="theForm"
-@submit="onSubmit"
-@invalidSubmit="onInvalidSubmit">
-        <div class="container-fluid fade-on-route-transition provider-preference">
-            <div class="row justify-content-center">
-                <div class="col-md-6 px-0 px-md-2">
-                    <siteHeader
-                        class="mb-2 header"
-                        cmsWidgetName="SiteHeaderWidget" />
-                </div>
+        ref="theForm"
+        @submit="onSubmit"
+        @invalidSubmit="onInvalidSubmit">
+        <div class="fade-on-route-transition provider-preference">
+            <div class="justify-content-center">
+                <siteHeader
+                    class="mt-4 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="provider-preference-container iss-heritage-content-container-width">
                     <siteSubHeader
                         id="sub-header"
                         cmsWidgetName="SiteSubHeader"
                         class="mb-0 mt-4 text-center" />
-                </div>
-            </div>
-            <div class="row justify-content-center">
-                <div class="col-md-6 col-xl-4">
                     <buttonQuestion
                         ref="buttonQuestion"
                         v-model="selectedProvider"
@@ -267,6 +261,15 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
+.iss-heritage-container-width {
+    .provider-preference-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
+    }
+}
+
 .provider-preference {
     #sub-header span {
         color: $black;
diff --git a/src/layouts/schedule-page/schedule-page.vue b/src/layouts/schedule-page/schedule-page.vue
index d824cb66..f3531c61 100644
--- a/src/layouts/schedule-page/schedule-page.vue
+++ b/src/layouts/schedule-page/schedule-page.vue
@@ -4,16 +4,14 @@
         v-slot="{ meta }"
         @submit="onSubmit"
         @invalidSubmit="onInvalidSubmit">
-        <div class="container-fluid fade-on-route-transition">
-            <div class="row justify-content-center">
-                <div class="col-md-6 col-xl-6">
-                    <siteHeader
-                        class="mb-2 header"
-                        cmsWidgetName="SiteHeaderWidget" />
-                </div>
+        <div class="fade-on-route-transition">
+            <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="schedule-page-container iss-heritage-content-container-width">
                     <siteSubHeader
                         cmsWidgetName="ScheduleSubHeaderWidget"
                         subTextClasses="text-center small sub-text"
@@ -492,8 +490,13 @@ export default {
 <style lang="scss" scoped>
 $page-side-padding: 1.5rem;
 
-.page-container-grouped-styles {
-    overflow: auto;
+.iss-heritage-container-width {
+    .schedule-page-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
+    }
 }
 
 :deep(.text-link-small) {
diff --git a/src/layouts/service-location/service-location.vue b/src/layouts/service-location/service-location.vue
index 0d25700b..78d0aa4b 100644
--- a/src/layouts/service-location/service-location.vue
+++ b/src/layouts/service-location/service-location.vue
@@ -4,13 +4,15 @@
         v-slot="{ meta }"
         @submit="onSubmit"
         @invalidSubmit="onInvalidSubmit">
-        <div class="container-fluid fade-on-route-transition">
-            <div class="row justify-content-center">
-                <div class="col-md-6 col-xl-6">
-                    <siteHeader cmsWidgetName="SiteHeaderWidget" />
+        <div class="fade-on-route-transition">
+            <div class="justify-content-center">
+                <siteHeader cmsWidgetName="SiteHeaderWidget" />
+            </div>
+            <div class="iss-heritage-container-width">
+                <div class="service-location-container iss-heritage-content-container-width">
                     <siteSubHeader
                         cmsWidgetName="SiteSubHeaderWidget"
-                        class="mt-5" />
+                        class="mt-4" />
                     <serviceZipModalQuestion
                         ref="serviceZipCodeQuestion"
                         v-model="serviceZipCodeQuestion"
@@ -51,24 +53,18 @@
                         class="my-5"
                         cmsWidgetName="AlertNoShopsWidget"
                         alertClass="alert-warning" />
-                </div>
-            </div>
-            <div class="row justify-content-center appointment-type">
-                <div class="col-md-6">
-                    <appointmentTypeQuestion
-                        v-show="isAppointmentTypeDisplayed"
-                        ref="appointmentTypeQuestion"
-                        v-model="selectedAppointmentType"
-                        :isServiceableMobile="isServiceableMobile"
-                        :isServiceableInshop="isServiceableInshop"
-                        :isDisplayed="isAppointmentTypeDisplayed"
-                        groupName="appointmentTypeQuestion"
-                        cmsWidgetName="AppointmentTypeQuestionWidget"
-                        validationRules="option-required" />
-                </div>
-            </div>
-            <div class="row justify-content-center">
-                <div class="col-md-6 col-xl-4">
+                    <div class="appointment-type">
+                        <appointmentTypeQuestion
+                            v-show="isAppointmentTypeDisplayed"
+                            ref="appointmentTypeQuestion"
+                            v-model="selectedAppointmentType"
+                            :isServiceableMobile="isServiceableMobile"
+                            :isServiceableInshop="isServiceableInshop"
+                            :isDisplayed="isAppointmentTypeDisplayed"
+                            groupName="appointmentTypeQuestion"
+                            cmsWidgetName="AppointmentTypeQuestionWidget"
+                            validationRules="option-required" />
+                    </div>
                     <mobileLocationModalQuestions
                         v-if="isMobileLocationDisplayed"
                         ref="mobileLocationQuestions"
@@ -537,8 +533,13 @@ export default {
 <style lang="scss">
 $page-side-padding: 1.5rem;
 
-.fade-on-route-transition {
-    overflow: auto;
+.iss-heritage-container-width {
+    .service-location-container {
+        position: relative;
+        min-height: 1px;
+        padding-left: .9375rem;
+        padding-right: .9375rem;
+    }
 }
 
 .question-text {
diff --git a/src/styles/client-customizations.scss b/src/styles/client-customizations.scss
index bf59ece8..ae6a41b6 100644
--- a/src/styles/client-customizations.scss
+++ b/src/styles/client-customizations.scss
@@ -15,10 +15,6 @@
     //Variables
     --iss-loader-color: #{$button-text-color};
 
-    .site-header {
-        background-color: $header-background;
-    }
-
     svg,
     .modal-text {
         fill: $accent-color;