From afebac00e19f373fcdbf77200dbd37ab8b77de30 Mon Sep 17 00:00:00 2001
From: Hakadao <a578457889743@gmail.com>
Date: Sun, 15 Dec 2024 23:06:31 +0800
Subject: [PATCH] fix(settings): reolve font blur issues (#1191)

Co-authored-by: IzumiMasaharu <muyunze2009@outlook.com>
---
 src/components/Settings/Settings.vue | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/Settings/Settings.vue b/src/components/Settings/Settings.vue
index ce287b80..f14b5c1a 100644
--- a/src/components/Settings/Settings.vue
+++ b/src/components/Settings/Settings.vue
@@ -125,13 +125,20 @@ function setCurrentTitle() {
         <ul
           style="
             --un-shadow: var(--bew-shadow-4), var(--bew-shadow-edge-glow-2);
-            backdrop-filter: var(--bew-filter-glass-2);
           "
-          flex="~ gap-2 col" rounded="30px group-hover:25px" p-2 shadow
+          relative flex="~ gap-2 col" rounded="30px group-hover:25px" p-2 shadow
           bg="$bew-content-alt group-hover:$bew-elevated dark:$bew-elevated dark-group-hover:$bew-elevated"
           scale="group-hover:105" duration-300 overflow-hidden antialiased transform-gpu
           border="1 $bew-border-color"
         >
+          <!-- frosted glass background -->
+          <!-- https://github.com/BewlyBewly/BewlyBewly/issues/1162 -->
+          <div
+            style="backdrop-filter: var(--bew-filter-glass-2);"
+            pos="absolute top-0 left-0" z--1
+            w-full h-full pointer-events-none
+          />
+
           <li v-for="menuItem in settingsMenuItems" :key="menuItem.value">
             <a
               cursor-pointer w="40px group-hover:180px" h-40px