From ec2e96b2b5b9fdca89513e78a02e2e79ab5336e5 Mon Sep 17 00:00:00 2001
From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com>
Date: Thu, 2 Jun 2022 14:21:56 +0530
Subject: [PATCH] fix: transparent bg in nav causes contrast issues

---
 src/client/theme-default/components/VPNav.vue    | 5 +++++
 src/client/theme-default/components/VPNavBar.vue | 5 +++++
 2 files changed, 10 insertions(+)

diff --git a/src/client/theme-default/components/VPNav.vue b/src/client/theme-default/components/VPNav.vue
index 9897e1a6..538a7165 100644
--- a/src/client/theme-default/components/VPNav.vue
+++ b/src/client/theme-default/components/VPNav.vue
@@ -35,6 +35,11 @@ provide('close-screen', closeScreen)
   .VPNav.no-sidebar {
     backdrop-filter: saturate(50%) blur(8px);
     -webkit-backdrop-filter: saturate(50%) blur(8px);
+    background: rgba(255, 255, 255, 0.9);
+  }
+
+  .dark .VPNav.no-sidebar {
+    background: rgba(36, 36, 36, 0.9);
   }
 
   @supports not (backdrop-filter: saturate(50%) blur(8px)) {
diff --git a/src/client/theme-default/components/VPNavBar.vue b/src/client/theme-default/components/VPNavBar.vue
index 4e27b1f6..cf5921e3 100644
--- a/src/client/theme-default/components/VPNavBar.vue
+++ b/src/client/theme-default/components/VPNavBar.vue
@@ -67,6 +67,11 @@ const { hasSidebar } = useSidebar()
   .VPNavBar.has-sidebar .content {
     backdrop-filter: saturate(50%) blur(8px);
     -webkit-backdrop-filter: saturate(50%) blur(8px);
+    background: rgba(255, 255, 255, 0.9);
+  }
+
+  .dark .VPNavBar.has-sidebar .content {
+    background: rgba(36, 36, 36, 0.9);
   }
 
   @supports not (backdrop-filter: saturate(50%) blur(8px)) {