feat(ui): 迁移液态玻璃质感(TabBar/返回按钮)

- 自定义 TabBar 增加弯月面聚光带与银丝边缘,玻璃参数升级
- 全局返回按钮与 ScrollTopMask 返回按钮升级 135° 液态玻璃渐变
- 激活态升级为玻璃透镜,浅色/深色主题同步
- 新增 tools/liquid-glass.test.mjs 回归断言
- 同步构建产物 dist/,并合并此前未提交的 .claude 配置与 dist 变更
This commit is contained in:
2026-08-18 21:30:39 +08:00
parent 2a5728bccc
commit 242c52af43
16 changed files with 187 additions and 41 deletions
+28 -8
View File
@@ -44,17 +44,37 @@
justify-content: center;
border-radius: 50%;
pointer-events: auto;
background: rgba(255, 255, 255, 0.55);
backdrop-filter: blur(32px) saturate(1.2);
-webkit-backdrop-filter: blur(32px) saturate(1.2);
border: 1rpx solid rgba(255, 255, 255, 0.55);
box-shadow: 0 12rpx 40rpx rgba(0, 0, 0, 0.18), 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
background: linear-gradient(
135deg,
rgba(255, 255, 255, 0.55) 0%,
rgba(255, 255, 255, 0.28) 45%,
rgba(255, 255, 255, 0.42) 100%
);
backdrop-filter: blur(24px) saturate(1.7) brightness(1.05);
-webkit-backdrop-filter: blur(24px) saturate(1.7) brightness(1.05);
border: 1rpx solid rgba(255, 255, 255, 0.35);
box-shadow:
inset 0 2rpx 3rpx rgba(255, 255, 255, 0.65),
inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.06),
inset 0 0 0 1rpx rgba(255, 255, 255, 0.18),
0 12rpx 40rpx rgba(0, 0, 0, 0.18),
0 4rpx 12rpx rgba(0, 0, 0, 0.08);
}
.theme-dark .scroll-top-back {
background: rgba(25, 25, 25, 0.55);
border-color: rgba(255, 255, 255, 0.14);
box-shadow: 0 12rpx 40rpx rgba(0, 0, 0, 0.5), 0 4rpx 12rpx rgba(0, 0, 0, 0.3);
background: linear-gradient(
135deg,
rgba(255, 255, 255, 0.16) 0%,
rgba(255, 255, 255, 0.06) 45%,
rgba(255, 255, 255, 0.12) 100%
);
border-color: rgba(255, 255, 255, 0.18);
box-shadow:
inset 0 2rpx 3rpx rgba(255, 255, 255, 0.22),
inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.28),
inset 0 0 0 1rpx rgba(255, 255, 255, 0.1),
0 12rpx 40rpx rgba(0, 0, 0, 0.5),
0 4rpx 12rpx rgba(0, 0, 0, 0.3);
}
.scroll-top-back-arrow {