From 58e51d4358f7a23cf4d3c344b9706e3d2cc0a03b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= <sxzz@sxzz.moe>
Date: Sat, 31 Dec 2022 05:35:19 +0800
Subject: [PATCH] feat: transparent nav header

---
 components/main/MainContent.vue | 2 +-
 styles/vars.css                 | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/components/main/MainContent.vue b/components/main/MainContent.vue
index ee6e1716..d47c3e2b 100644
--- a/components/main/MainContent.vue
+++ b/components/main/MainContent.vue
@@ -11,7 +11,7 @@ defineProps<{
   <div relative>
     <div
       sticky top-0 z10
-      border="b base" bg-base
+      border="b base" bg="[rgba(var(--c-bg-base-rgb),0.7)]" backdrop-blur
     >
       <div flex justify-between px5 py4>
         <div flex gap-3 items-center overflow-hidden>
diff --git a/styles/vars.css b/styles/vars.css
index 5a12d767..eff52597 100644
--- a/styles/vars.css
+++ b/styles/vars.css
@@ -6,6 +6,7 @@
   --c-border-dark: #dccfcf;
 
   --c-bg-base: #fafafa;
+  --c-bg-base-rgb: 250, 250, 250;
   --c-bg-active: #f2f2f2;
   --c-bg-code: #00000006;
   --c-bg-selection: #8885;
@@ -34,6 +35,7 @@
   --c-border-dark: #545251;
 
   --c-bg-base: #111;
+  --c-bg-base-rgb: 17, 17, 17;
   --c-bg-active: #191919;
   --c-bg-code: #ffffff06;
   --c-bg-fade: #EA9E4411;