From 26b2ca50cffa9c8db7f09aac1861d4d446d3477a Mon Sep 17 00:00:00 2001
From: brydon1 <michaela.brydon@safelite.com>
Date: Fri, 21 Jul 2023 12:47:30 -0400
Subject: [PATCH] Refactoring CSS

---
 .../contact-details/contact-details.vue       | 42 +++++++------------
 1 file changed, 14 insertions(+), 28 deletions(-)

diff --git a/src/layouts/contact-details/contact-details.vue b/src/layouts/contact-details/contact-details.vue
index a7071ee3..6a35949d 100644
--- a/src/layouts/contact-details/contact-details.vue
+++ b/src/layouts/contact-details/contact-details.vue
@@ -9,16 +9,16 @@
                 <siteHeader
                     ref="siteHeader"
                     :cmsWidgetName="widget.siteHeader" />
-                <div class="container-fluid pb-2">
+                <div class="container-fluid px-5">
                     <siteSubHeader
                         id="sub-header"
                         ref="siteSubHeader"
-                        class="margin-top-16"
+                        class="mt-5"
                         :cmsWidgetName="widget.siteSubHeader" />
                     <textboxQuestion
                         ref="firstNameQuestion"
                         v-model="firstName"
-                        class="margin-top-24"
+                        class="mt-6"
                         inputId="firstName"
                         :cmsWidgetName="widget.firstNameQuestion"
                         isRequired
@@ -26,7 +26,7 @@
                     <textboxQuestion
                         ref="lastNameQuestion"
                         v-model="lastName"
-                        class="margin-top-16"
+                        class="mt-5"
                         inputId="lastName"
                         :cmsWidgetName="widget.lastNameQuestion"
                         isRequired
@@ -34,7 +34,7 @@
                     <textboxQuestion
                         ref="emailQuestion"
                         v-model="emailAddress"
-                        class="margin-top-16"
+                        class="mt-5"
                         inputId="emailAddress"
                         :cmsWidgetName="widget.emailQuestion"
                         isRequired
@@ -42,7 +42,7 @@
                     <textboxQuestion
                         ref="phoneNumberQuestion"
                         v-model="phoneNumber"
-                        class="margin-top-16"
+                        class="mt-5"
                         inputId="phoneNumber"
                         :cmsWidgetName="widget.phoneNumberQuestion"
                         isRequired
@@ -51,7 +51,7 @@
                         ref="requestTextUpdatesCheckbox"
                         v-model="requestTextUpdates"
                         :isChecked="requestTextUpdates"
-                        class="margin-top-8"
+                        class="mt-3"
                         checkboxName="requestTextUpdates"
                         buttonID="requestTextUpdates"
                         :checkboxLabel="requestTextUpdatesCheckboxText" />
@@ -59,7 +59,7 @@
                     <textareaQuestion
                         ref="notesQuestion"
                         v-model="notesForTechnician"
-                        class="margin-top-16"
+                        class="mt-5"
                         inputId="technicianNotes"
                         :isDisabled="false"
                         :isRequired="false"
@@ -69,18 +69,18 @@
 
                     <p
                         ref="disclaimerText"
-                        class="disclaimer margin-top-24">
+                        class="caption dark-gray mt-6">
                     {{ textUpdateDisclaimerText }} I also agree to Safelite's
                         <textLink
                             ref="privacyPolicyLink"
-                            class="disclaimer-link"
+                            class="normal-line-height"
                             linkType="text"
                             text="Privacy Policy"
                             href="//www.safelite.com/privacy-center" />
                         and
                         <textLink
                             ref="termsOfUseLink"
-                            class="disclaimer-link"
+                            class="normal-line-height"
                             linkType="text"
                             text="Terms of Use"
                             href="//www.safelite.com/terms-of-use" />.
@@ -88,6 +88,7 @@
 
                     <siteFooter
                         ref="siteFooter"
+                        class="my-6"
                         :cmsWidgetName="widget.siteFooter"
                         :isForwardActionDisabled="!meta.valid"
                         @forwardClicked="forwardButtonAction"
@@ -218,26 +219,11 @@ export default {
     }
 }
 
-.margin-top-24 {
-    margin-top: 24px;
-}
-
-.margin-top-16 {
-    margin-top: 16px;
-}
-
-.margin-top-8 {
-    margin-top: 8px;
-}
-
-.disclaimer {
-    font-size: 12px;
+.dark-gray {
     color: $darker-gray;
-    font-weight: 400;
 }
 
-.disclaimer-link {
-    text-decoration: none;
+.normal-line-height {
     line-height: normal;
 }