From e50d025cc3226ffc7f5a050564d49f89bd402ad7 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Wed, 4 Jan 2023 16:05:33 -0500
Subject: [PATCH 1/5] CSR-735 fix for screenreader reading hidden content.

---
 .../service-package-radio.vue                 | 76 ++++++++++++-------
 1 file changed, 47 insertions(+), 29 deletions(-)

diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index 7e4603bc5..574ea0b3f 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -13,34 +13,38 @@
                     class="sub-label m-0"
                     v-if="this.buttonLabelSubCopy"
                     v-html="this.buttonLabelSubCopy"></p>
-                <!-- Parse the body text containing <ul> with logic -->
-                <ul>
-                    <li v-for="listItem in this.arrayOfListItemsFromBodyText" :key="listItem">
-                        <!-- no textLink -->
-                        <span v-if="!doesCopyContainTextLink(listItem)" v-html="listItem"></span>
-                        <!-- with textLink -->
-                        <template
-                            v-else
-                            v-for="copy in splitCopyOnCMSPlaceHolder(listItem)"
-                            :key="copy">
-                            <span v-if="!doesCopyContainTextLink(copy)" v-html="copy"></span>
-                            <span v-else>
-                                <textLink
-                                    linkType="text"
-                                    :text="getLinkDisplayTextFromCopy(copy)"
-                                    href="#!"
-                                    data-bs-toggle="modal"
-                                    :data-bs-target="'#' + getLinkTargetFromCopy(copy)"
-                                    aria-label="Modal window" />
-                            </span>
-                        </template>
-                    </li>
-                </ul>
-                <!-- End of body text parsing -->
-                <div
-                    class="package-footer fw-bold caption ms-n6"
-                    v-if="this.buttonFooterCopy"
-                    v-html="this.buttonFooterCopy"></div>
+                <div class="div-to-hide">
+                    <!-- Parse the body text containing <ul> with logic -->
+                    <ul>
+                        <li v-for="listItem in this.arrayOfListItemsFromBodyText" :key="listItem">
+                            <!-- no textLink -->
+                            <span
+                                v-if="!doesCopyContainTextLink(listItem)"
+                                v-html="listItem"></span>
+                            <!-- with textLink -->
+                            <template
+                                v-else
+                                v-for="copy in splitCopyOnCMSPlaceHolder(listItem)"
+                                :key="copy">
+                                <span v-if="!doesCopyContainTextLink(copy)" v-html="copy"></span>
+                                <span v-else>
+                                    <textLink
+                                        linkType="text"
+                                        :text="getLinkDisplayTextFromCopy(copy)"
+                                        href="#!"
+                                        data-bs-toggle="modal"
+                                        :data-bs-target="'#' + getLinkTargetFromCopy(copy)"
+                                        aria-label="Modal window" />
+                                </span>
+                            </template>
+                        </li>
+                    </ul>
+                    <!-- End of body text parsing -->
+                    <div
+                        class="package-footer fw-bold caption ms-n6"
+                        v-if="this.buttonFooterCopy"
+                        v-html="this.buttonFooterCopy"></div>
+                </div>
             </div>
         </div>
     </baseInputButton>
@@ -159,6 +163,14 @@ export default {
                         max-height: 1000px;
                     }
                 }
+                + .package-label {
+                    .package-specs {
+                        .div-to-hide {
+                            visibility: visible;
+                            opacity: 1;
+                        }
+                    }
+                }
                 + .package-label {
                     background-color: $blue-100;
                     border: 1px solid $blue;
@@ -194,7 +206,7 @@ export default {
             flex-direction: column;
             width: 100%;
             max-height: 0;
-            transition: all 0.75s ease;
+            transition: all .5s ease;
 
             p {
                 font-weight: 500;
@@ -220,6 +232,12 @@ export default {
                     font-size: 0.875rem;
                 }
             }
+
+            .div-to-hide {
+                visibility: hidden;
+                opacity: 0;
+                transition: opacity 0.3s ease 0.3s, visibility 0.3s ease-out 0.3s;
+            }
         }
     }
 }

From d33dfa74fcacfa1c589a42af76c942650940ca69 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Wed, 4 Jan 2023 17:19:32 -0500
Subject: [PATCH 2/5] Format code

---
 .../service-package-radio/service-package-radio.vue             | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index 574ea0b3f..22597da79 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -206,7 +206,7 @@ export default {
             flex-direction: column;
             width: 100%;
             max-height: 0;
-            transition: all .5s ease;
+            transition: all 0.5s ease;
 
             p {
                 font-weight: 500;

From da363c0453860eb1cd06c26a8ac3c3d73372fb1c Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Thu, 5 Jan 2023 09:15:52 -0500
Subject: [PATCH 3/5] Update animation.

---
 .../service-package-radio.vue                 | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index 22597da79..c3a4eba79 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -118,10 +118,10 @@ export default {
                     0px 4px 24px -8px rgba(0, 0, 0, 0.2);
                 border-radius: 0.5rem;
                 overflow: hidden;
-                min-height: 58px;
+                min-height: 60px;
 
                 &.has-subheader {
-                    min-height: 78px;
+                    min-height: 80px;
                 }
 
                 &:before {
@@ -166,8 +166,8 @@ export default {
                 + .package-label {
                     .package-specs {
                         .div-to-hide {
+                            display: block;
                             visibility: visible;
-                            opacity: 1;
                         }
                     }
                 }
@@ -233,10 +233,19 @@ export default {
                 }
             }
 
+            @keyframes slideaway {
+                from {
+                    display: block;
+                }
+                to {
+                    transform: translateY(40px);
+                    opacity: 0;
+                }
+            }
+
             .div-to-hide {
+                display: none;
                 visibility: hidden;
-                opacity: 0;
-                transition: opacity 0.3s ease 0.3s, visibility 0.3s ease-out 0.3s;
             }
         }
     }

From 30a458c64b5ef2399b7af9eb103799e21abdbf07 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Thu, 5 Jan 2023 09:59:12 -0500
Subject: [PATCH 4/5] Update class name and remove visibility.

---
 .../service-package-radio/service-package-radio.vue         | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index c3a4eba79..aed24d984 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -165,9 +165,8 @@ export default {
                 }
                 + .package-label {
                     .package-specs {
-                        .div-to-hide {
+                        .hide-when-closed {
                             display: block;
-                            visibility: visible;
                         }
                     }
                 }
@@ -243,9 +242,8 @@ export default {
                 }
             }
 
-            .div-to-hide {
+            .hide-when-closed {
                 display: none;
-                visibility: hidden;
             }
         }
     }

From a7981a81d418474ba84d4477c884985e1e1e87eb Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Thu, 5 Jan 2023 10:23:06 -0500
Subject: [PATCH 5/5] Update class name.

---
 .../service-package-radio/service-package-radio.vue             | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index aed24d984..856b5a940 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -13,7 +13,7 @@
                     class="sub-label m-0"
                     v-if="this.buttonLabelSubCopy"
                     v-html="this.buttonLabelSubCopy"></p>
-                <div class="div-to-hide">
+                <div class="hide-when-closed">
                     <!-- Parse the body text containing <ul> with logic -->
                     <ul>
                         <li v-for="listItem in this.arrayOfListItemsFromBodyText" :key="listItem">