From 4ecbc4c0ba169058adcaa00dfa689b7ca21f8dbf Mon Sep 17 00:00:00 2001
From: Matt Caimi <matt.caimi@safelite.com>
Date: Fri, 16 Dec 2022 10:05:40 -0500
Subject: [PATCH] CSR-883 | added element to modal body for recal copy on quote
 page

added element to modal body for recal copy on quote page

also removed unnecessary this. in modal
---
 src/common-components/modal/modal.vue | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/common-components/modal/modal.vue b/src/common-components/modal/modal.vue
index 9845e0891..7fc1c202f 100644
--- a/src/common-components/modal/modal.vue
+++ b/src/common-components/modal/modal.vue
@@ -3,7 +3,7 @@
     <div
         class="modal fade modal-component"
         v-on="{ 'hidden.bs.modal': resetButtonStyle }"
-        :id="this.cmsWidgetName"
+        :id="cmsWidgetName"
         tabindex="-1"
         aria-labelledby="ModalComponentLabel"
         aria-hidden="true">
@@ -17,10 +17,11 @@
                         aria-label="Close"></button>
                 </div>
                 <div class="modal-body ps-4 pe-4 pt-5 pb-4">
-                    <img :src="this.ModalImage" class="mw-100 d-flex mx-auto mb-4" alt="" />
-                    <h5 class="mb-4" v-html="this.ModalHeadline"></h5>
-                    <p class="fw-bold mb-2 subheader-text" v-html="this.ModalSubheadertext"></p>
-                    <p class="mb-0" v-html="this.ModalBodyText"></p>
+                    <img :src="ModalImage" class="mw-100 d-flex mx-auto mb-4" alt="" />
+                    <h5 class="mb-4" v-html="ModalHeadline"></h5>
+                    <p class="fw-bold mb-2 subheader-text" v-html="ModalSubheadertext"></p>
+                    <p class="mb-0" v-html="ModalBodyText"></p>
+                    <p class="my-4 caption modal-sub-body" v-if="ModalSubBodyText" v-html="ModalSubBodyText"></p>
                 </div>
                 <div class="modal-footer px-5 py-4">
                     <buttonMain
@@ -54,6 +55,9 @@ export default {
         ModalBodyText() {
             return this.getCmsContent(this.cmsWidgetName, "BodyText");
         },
+        ModalSubBodyText() {
+            return this.getCmsContent(this.cmsWidgetName, "BodyText2");
+        },
         ModalImage() {
             return this.getCmsContent(this.cmsWidgetName, "Image");
         },
@@ -97,6 +101,9 @@ export default {
                 box-shadow: 0px 16px 48px -16px rgba(0, 0, 0, 0.25);
                 border-radius: 1.5rem 1.5rem 0 0;
                 .modal-body {
+                    .modal-sub-body {
+                        color: $gray-600;
+                    }
                     ul {
                         margin-bottom: 0;
                     }