From aa0b8b93d171ed2264cf2f28e110c554897c2332 Mon Sep 17 00:00:00 2001
From: Kulbhushan Kaushik <kulbhushan.kaushik@safelite.com>
Date: Fri, 4 Nov 2022 08:55:23 -0400
Subject: [PATCH] fixed styling for hamburger menu

---
 .../site-header/menu-modal/menu-modal.vue     | 49 +------------------
 1 file changed, 2 insertions(+), 47 deletions(-)

diff --git a/src/common-components/site-header/menu-modal/menu-modal.vue b/src/common-components/site-header/menu-modal/menu-modal.vue
index f43a66e6..37e80850 100644
--- a/src/common-components/site-header/menu-modal/menu-modal.vue
+++ b/src/common-components/site-header/menu-modal/menu-modal.vue
@@ -8,13 +8,6 @@
     </div>
     <!-- Modal -->
     <div class="modal menu-modal fade" data-bs-backdrop="false" id="footerModal" tabindex="-1" aria-labelledby="footerModalLabel" aria-hidden="true" v-on="{ 'show.bs.modal' : show, 'hide.bs.modal' : hide }" :style="`height: calc(100% - ${currentFooterAndHeaderHeight}px);`">
-      <div class="menu-modal-container">
-        <button class="menu-button" type="button" :class="[isActive ? 'active' : '']" data-bs-toggle="modal" data-bs-target="#footerModal" aria-label="Hamburger Menu (modal window)">
-          <div class="bar1"></div>
-          <div class="bar2"></div>
-          <div class="bar3"></div>
-        </button>
-      </div>
       <div class="modal-dialog modal-fullscreen">
         <div class="modal-content">
           <div class="modal-header visually-hidden">
@@ -81,7 +74,7 @@
         justify-content: center;
         align-items: center;
         padding: 0;//Required to prevent 'squish' on iPhone
-        z-index: 1050;
+        z-index: 1056;
         .bar1,
         .bar2,
         .bar3 {
@@ -124,45 +117,7 @@
         border-top: none;
         padding: 2rem;
       }
-      .menu-modal-container {
-        position: absolute;
-        padding: 1.47rem 1rem 1.47rem 1.47rem;
-        right: 0;
-        top: -4.5rem;
-        button {
-          border: none;
-          &.menu-button {
-            width: 1.5rem;
-            height: 1.5rem;
-            border-radius: 50%;
-            box-shadow: none;
-            background-color: $white;
-            position: relative;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-            align-items: center;
-            padding: 0;//Required to prevent 'squish' on iPhone
-            z-index: 1056;
-            .bar1,
-            .bar2,
-            .bar3 {
-              width: 14px;
-              height: 2px;
-              background-color: $blue;
-              margin: 1px 0;
-              transition: 0.25s;
-            }
-            &.active .bar1 {
-              transform: rotate(-45deg) translate(-3px, 3px);
-            }
-            &.active .bar2 {opacity: 0;}
-            &.active .bar3 {
-              transform: rotate(45deg) translate(-3px, -3px);
-            }
-          }
-        }
-      }
+
       //.modal-backdrop styles are in common-styles.scss
     }
   }