From 75c9d809d21c0484c0ae8ce691d598cf229c9525 Mon Sep 17 00:00:00 2001
From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com>
Date: Tue, 21 Jun 2022 15:33:41 +0530
Subject: [PATCH] fix(theme): nav close icon not working correctly (#744)

---
 src/client/theme-default/components/VPDoc.vue | 20 -------------------
 .../theme-default/components/VPNavBar.vue     |  1 -
 .../components/VPNavBarHamburger.vue          | 20 +++++++++----------
 3 files changed, 10 insertions(+), 31 deletions(-)

diff --git a/src/client/theme-default/components/VPDoc.vue b/src/client/theme-default/components/VPDoc.vue
index 64feaa4f..f7a9c17c 100644
--- a/src/client/theme-default/components/VPDoc.vue
+++ b/src/client/theme-default/components/VPDoc.vue
@@ -169,24 +169,4 @@ const pageName = path.replace(/[./]+/g, '_').replace(/_html$/, '')
   margin: 0 auto;
   max-width: 688px;
 }
-
-.edit-link {
-  margin: 0 0 32px;
-}
-
-.edit-link .vt-link {
-  font-size: 14px;
-  color: var(--vt-c-brand);
-  font-weight: 500;
-}
-
-.vt-icon {
-  width: 18px;
-  height: 18px;
-  color: var(--vt-c-brand);
-  display: inline-block;
-  margin-right: 8px;
-  position: relative;
-  top: -1px;
-}
 </style>
diff --git a/src/client/theme-default/components/VPNavBar.vue b/src/client/theme-default/components/VPNavBar.vue
index 256ddd0d..dc383d7d 100644
--- a/src/client/theme-default/components/VPNavBar.vue
+++ b/src/client/theme-default/components/VPNavBar.vue
@@ -48,7 +48,6 @@ const { hasSidebar } = useSidebar()
   border-bottom: 1px solid var(--vp-c-divider-light);
   padding: 0 8px 0 24px;
   height: var(--vp-nav-height-mobile);
-  background-color: var(--vt-c-bg);
   transition: border-color 0.5s, background-color 0.5s;
 }
 
diff --git a/src/client/theme-default/components/VPNavBarHamburger.vue b/src/client/theme-default/components/VPNavBarHamburger.vue
index 1e014177..e243552f 100644
--- a/src/client/theme-default/components/VPNavBarHamburger.vue
+++ b/src/client/theme-default/components/VPNavBarHamburger.vue
@@ -48,18 +48,18 @@ defineEmits<{
   overflow: hidden;
 }
 
-.container:hover .top    { top: 0; left: 0; transform: translateX(4px); }
-.container:hover .middle { top: 6; left: 0; transform: translateX(0); }
-.container:hover .bottom { top: 12px; left: 0; transform: translateX(8px); }
+.VPNavBarHamburger:hover .top    { top: 0; left: 0; transform: translateX(4px); }
+.VPNavBarHamburger:hover .middle { top: 6; left: 0; transform: translateX(0); }
+.VPNavBarHamburger:hover .bottom { top: 12px; left: 0; transform: translateX(8px); }
 
-.container.active .top    { top: 6px; transform: translateX(0) rotate(225deg); }
-.container.active .middle { top: 6px; transform: translateX(16px); }
-.container.active .bottom { top: 6px; transform: translateX(0) rotate(135deg); }
+.VPNavBarHamburger.active .top    { top: 6px; transform: translateX(0) rotate(225deg); }
+.VPNavBarHamburger.active .middle { top: 6px; transform: translateX(16px); }
+.VPNavBarHamburger.active .bottom { top: 6px; transform: translateX(0) rotate(135deg); }
 
-.container.active:hover .top,
-.container.active:hover .middle,
-.container.active:hover .bottom {
-  background-color: var(--vt-c-text-2);
+.VPNavBarHamburger.active:hover .top,
+.VPNavBarHamburger.active:hover .middle,
+.VPNavBarHamburger.active:hover .bottom {
+  background-color: var(--vp-c-text-2);
   transition: top .25s, background-color .25s, transform .25s;
 }