From 9322ab7c39f0e2ed5a77013dbac81e6c46b810f1 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 18 Mar 2024 16:31:42 -0400
Subject: [PATCH] px to rem

---
 .../order-confirmation/add-to-calendar/add-to-calendar.vue  | 4 ++--
 .../calendar-modal-list-button.vue                          | 6 +++---
 .../calendar-modal-question/calendar-modal-question.vue     | 2 +-
 src/layouts/order-confirmation/order-confirmation.vue       | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue b/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue
index 014af7c5..ebd7eb47 100644
--- a/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue
+++ b/src/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue
@@ -296,7 +296,7 @@ export default {
 </script>
 <style scoped>
 .add-to-calendar-text {
-    margin: 0 0 0 7px;
+    margin: 0 0 0 0.4375rem;
     color: #1574a1;
     vertical-align: middle;
     font-weight: 500;
@@ -320,6 +320,6 @@ export default {
 }
 .calendar-section .add-to-calendar .add-to-calendar-img {
     display: inline;
-    width: 20px;
+    width: 1.25rem;
 }
 </style>
diff --git a/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-list-button/calendar-modal-list-button.vue b/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-list-button/calendar-modal-list-button.vue
index 1207cdf7..814d10fe 100644
--- a/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-list-button/calendar-modal-list-button.vue
+++ b/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-list-button/calendar-modal-list-button.vue
@@ -65,13 +65,13 @@ export default {
     background: $white;
     transition: all 150ms linear;
     border-radius: $border-radius-lg;
-    border: 1px solid $gray-500;
+    border: 0.063rem solid $gray-500;
     width: 100%;
     outline: none;
 
     span.calendar-text {
-        margin-left: 5px;
-        padding: 2px 8px;
+        margin-left: 0.313rem;
+        padding: 0.125rem 0.5rem;
     }
 }
 
diff --git a/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.vue b/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.vue
index 4a02b72d..702abf1b 100644
--- a/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.vue
+++ b/src/layouts/order-confirmation/add-to-calendar/calendar-modal-question/calendar-modal-question.vue
@@ -168,7 +168,7 @@ export default {
 <style lang="scss" scoped>
 .calendar-modal.modal.modal-component {
     > .modal-dialog > .modal-content {
-        margin-top: 24px;
+        margin-top: 1.5rem;
     }
     .modal-header {
         padding-bottom: 0;
diff --git a/src/layouts/order-confirmation/order-confirmation.vue b/src/layouts/order-confirmation/order-confirmation.vue
index f0364062..7ee31d95 100644
--- a/src/layouts/order-confirmation/order-confirmation.vue
+++ b/src/layouts/order-confirmation/order-confirmation.vue
@@ -312,8 +312,8 @@ $page-side-padding: 1.5rem;
 .appointment-details {
     margin-bottom: 1.5rem;
     padding: 1rem 1.5rem 1.5rem;
-    box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
-    border-radius: 5px;
+    box-shadow: 0 0.188rem 0.625rem rgb(0 0 0 / 0.2);
+    border-radius: 0.313rem;
 }
 
 .appointment-date-time P {