From 59d9921dae6327ddf11d7a0d0058d0e361d7d1eb Mon Sep 17 00:00:00 2001
From: credelinghuys <Chris.Redelinghuys@safelite.com>
Date: Thu, 2 Apr 2026 15:22:42 -0400
Subject: [PATCH 1/2] CASH-1684: Alert message UI updates

---
 src/layouts/schedule/schedule.vue |  1 +
 src/ux-components/alert/alert.vue | 38 +++++++++++++++++++++++++++----
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue
index 8068ac6c1..f5462fb9e 100644
--- a/src/layouts/schedule/schedule.vue
+++ b/src/layouts/schedule/schedule.vue
@@ -85,6 +85,7 @@
                         ref="alertMSRNotCoveredByInsurance"
                         class="mt-5 mb-5"
                         v-if="isMSRFeeNotCoveredByInsurance"
+                        :leftAlignCopy="true"
                         :manualHeadline="MSRFeeAlertHeadlineText"
                         :manualCopy="MSRFeeAlertBodyText"
                         :showWarningIcon="true"
diff --git a/src/ux-components/alert/alert.vue b/src/ux-components/alert/alert.vue
index deb7bca8b..2ea618f9a 100644
--- a/src/ux-components/alert/alert.vue
+++ b/src/ux-components/alert/alert.vue
@@ -1,6 +1,6 @@
 <template>
     <div
-        class="alert fade show text-center mb-0 py-2 px-4 border-0"
+        class="alert fade show mb-0 py-2 px-4 border-0"
         role="alert"
         v-on="{ 'close.bs.alert': onAlertClose }"
         :class="[
@@ -8,8 +8,9 @@
             this.alertClass,
             this.cssClassNameForCmsWidget,
             this.hasBorder ? 'bordered' : '',
+            this.leftAlignCopy ? 'text-start' : 'text-center',
         ]">
-        <p class="mx-6 my-0 fw-bold alert-heading">
+        <p class="my-0 fw-bold alert-heading" :class="leftAlignCopy ? 'mx-4' : 'mx-6'">
             <img v-if="showInfoIcon" :src="infoIcon" alt="Info Icon" class="info-icon" />
             <img
                 v-if="showWarningIcon"
@@ -74,6 +75,7 @@ export default {
         hasBorder: Boolean,
         isDismissible: Boolean,
         alertClass: String,
+        leftAlignCopy: Boolean,
         /*
             alertClass class names:
             alert-success (green)
@@ -220,13 +222,41 @@ export default {
     }
     &.alert-warning {
         background-color: $yellow-100;
-        .alert-heading {
-            color: $yellow-600;
 
+        &.bordered {
+            border-color: $yellow-400;
+        }
+
+        &.text-start {
+            .alert-heading {
+                display: flex;
+                align-items: center;
+                color: $black;
+                font-weight: 700;
+
+                .warning-icon {
+                    margin-right: 0.5rem;
+                }
+            }
+            hr {
+                margin-top: 0.5rem;
+                margin-bottom: 0.5rem;
+                border-color: $yellow-400;
+            }
+        }
+
+        &.text-center {
+            .alert-heading {
+                color: $yellow-600;
+            }            
+        }
+
+        .alert-heading {
             .warning-icon {
                 height: 1rem;
             }
         }
+        
         svg {
             fill: $yellow-600;
             width: 1rem;

From a4072eac4320381875bfd7d56fd595b4aab14a42 Mon Sep 17 00:00:00 2001
From: credelinghuys <Chris.Redelinghuys@safelite.com>
Date: Fri, 3 Apr 2026 08:36:22 -0400
Subject: [PATCH 2/2] CASH-1684: Prettier

---
 src/ux-components/alert/alert.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/ux-components/alert/alert.vue b/src/ux-components/alert/alert.vue
index 2ea618f9a..8b2b90b75 100644
--- a/src/ux-components/alert/alert.vue
+++ b/src/ux-components/alert/alert.vue
@@ -248,7 +248,7 @@ export default {
         &.text-center {
             .alert-heading {
                 color: $yellow-600;
-            }            
+            }
         }
 
         .alert-heading {
@@ -256,7 +256,7 @@ export default {
                 height: 1rem;
             }
         }
-        
+
         svg {
             fill: $yellow-600;
             width: 1rem;