diff --git a/client/electron/src/index.css b/client/electron/src/index.css index 2dae3a9..4d09f7f 100644 --- a/client/electron/src/index.css +++ b/client/electron/src/index.css @@ -744,14 +744,12 @@ html[data-bg='on'] .bg-slate-100 { */ html[data-bg='on'] .glass-control { background-color: rgb(var(--c-white) / var(--bg-glass-control)); - backdrop-filter: blur(6px) saturate(1.1); - -webkit-backdrop-filter: blur(6px) saturate(1.1); + backdrop-filter: blur(8px) saturate(1.1); + -webkit-backdrop-filter: blur(8px) saturate(1.1); } html[data-bg='on'] .bg-white { background-color: rgb(var(--c-white) / var(--bg-glass)); - backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.2); - -webkit-backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.2); } /* @@ -841,10 +839,18 @@ html[data-bg='on'] .hover\:bg-gray-100:hover { } /* 基线朦胧:没开壁纸时也有一点玻璃感,而不是一块硬塑料 */ -.app-shell > *, +/* + * ★ 面板**不再各自打模糊**(2026-09-14 用户:「你又犯了模糊叠模糊的毛病, + * 整体的模糊是由壁纸那一层模糊确定的,而你在每一个卡片又打了固定的模糊底」)。 + * + * 浮在壁纸上的大面(列表栏/详情栏/卡片)背后只有**已经模糊过的壁纸**, + * 再 backdrop-filter 一次纯属叠加:不会更"玻璃",只会更脏更糊,而且每层都要 + * 重新采样一次背景(滚动时明显掉帧)。 + * + * 模糊只留给**真正悬浮在内容之上**的层:底部导航条、地址建议菜单、弹层 —— + * 它们背后是会滚动的内容,模糊在那里才有信息遮蔽的意义。 + */ .narrow-shell > *:not(.narrow-nav) { - backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.05); - -webkit-backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.05); } /* 窄屏:内容面板同样浮起来(与底部导航那条悬浮玻璃一致) */ @@ -883,10 +889,8 @@ html[data-bg='on'] .app-shell > * { * (浅色主题=白玻璃、深色主题=深玻璃,见文件末尾的令牌块)。 * 原先这里写死深玻璃 —— 那正是用户说的"导航栏为什么还是黑色"。 */ -html[data-bg='on'] .nav-rail, -html[data-bg='on'] .narrow-nav { - backdrop-filter: blur(18px) saturate(1.4); - -webkit-backdrop-filter: blur(18px) saturate(1.4); +html[data-bg='on'] .nav-rail { + /* 侧栏浮在壁纸上:模糊由壁纸层负责,这里不叠 */ } @@ -1117,8 +1121,7 @@ html.view-switch .glass-control, */ .app-shell > .bg-chrome-900 { background-color: rgb(var(--c-chrome-900) / 0.82); - backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.2); - -webkit-backdrop-filter: blur(var(--bg-blur-panel)) saturate(1.2); + /* 不留 backdrop-filter:它浮在(已模糊的)壁纸上,再模糊只是叠一层 */ }