Fix reward code modal and mobile viewport dock
Some checks failed
CI / verify (push) Has been cancelled

This commit is contained in:
2026-04-30 16:25:46 +08:00
parent 22f3f963de
commit 4ef1d27021
8 changed files with 177 additions and 16 deletions

View File

@@ -0,0 +1,18 @@
# 平台首页移动端底部 Dock 可见视口修复
## 背景
手机浏览器会把顶部地址栏纳入传统 `100vh` 的计算,导致平台首页根容器高于真实可见区域。底部 dock 虽然在 flex 布局末尾,但会被推到浏览器可见区域之外,用户需要滚动或收起地址栏后才能看到。
## 落地口径
- 平台入口根壳统一使用 `.platform-viewport-shell`,优先按 `100dvh` 约束高度,旧浏览器回退到 `100vh`
- 移动端首页底部 dock 使用 `.platform-mobile-bottom-dock` 固定在可见视口底部,并叠加 `safe-area-inset-bottom`
- 移动端首页内容壳通过 `--platform-bottom-dock-outer-height` 预留底部空间,避免滚动内容被固定 dock 遮挡。
- 不新增 UI 说明文案,不改变底部导航业务语义。
## 验收
- 手机竖屏打开平台首页时,底部 dock 始终贴住浏览器可见区域底部。
- 浏览器地址栏展开时dock 不应被挤到屏幕外。
- 主页、分类、创作、存档、我的五个 tab 均保持原有点击行为。