fix(webui): 候选菜单改用不透明弹层表面 —— 半透明+背景模糊把背后的表单糊进了列表
用户(2026-09-15,看着抄送/转发两处的候选):「你在选择框的模糊逻辑上用力过猛, 导致只能显示一条信息」。 实测(生产构建 4c2bf26,浏览器里读计算样式,壁纸开): 菜单 background: rgba(255,255,255,0.5) + backdrop-filter: blur(8px) saturate(1.1) 而它浮在**表单自己**之上(主题输入框 y=294 正落在菜单 284-510 下面) ⇒ 背后的输入框/标签被糊一遍再从半透明列表底下透上来,只有顶行还读得清。 根因与 2026-09-14 那次「模糊叠模糊」同族:把**控件档**(0.5 透 + 8px 模糊)用在 **弹层**上。控件背后是面板自身,透一点好看;弹层背后是别的内容,透就是叠两份内容。 - 新增 .popup-surface(rgb(var(--c-white)),不取 backdrop-filter;壁纸开时单独压回不透明, 否则会撞上 html[data-bg='on'] .bg-white 那条接管规则) - .popup-surface 并入「滚动区不淡」豁免(原来只认 .glass-control,换类会漏掉 → 弹层又被洗白) - AddressInput 菜单 glass-control → popup-surface;旧断言 nav-merge.test.mjs:109 钉的正是 那个错的意图(『地址建议菜单』必须用控件档),已改钉新意图 判据:narrow-layout 新增 4 条(表面不透明/不取模糊/壁纸开时也压回/菜单穿的类)+ nav-merge 反向对照。两侧都验:变异①换回 glass-control → 红;变异②改回 0.5 → 红; 复原 → 71 通过 0 失败。生产实测:rgba(...,0.5)+blur → rgb(255,255,255)+无模糊。
This commit is contained in:
@ -181,7 +181,7 @@ export default function AddressInput({
|
||||
|
||||
{open && items.length > 0 && (
|
||||
<div
|
||||
className={`absolute z-20 w-full overflow-y-auto glass-control border border-gray-200 rounded-lg shadow-2 ${
|
||||
className={`absolute z-20 w-full overflow-y-auto popup-surface border border-gray-200 rounded-lg shadow-2 ${
|
||||
menuLayout.flip ? 'bottom-full mb-1' : 'top-full mt-1'
|
||||
}`}
|
||||
style={{ maxHeight: menuLayout.maxHeight }}
|
||||
|
||||
Reference in New Issue
Block a user