JianFeeeee
8a9bc58433
feat(webui): 横竖屏自适应(紧凑双栏)+ 旋屏重算高度
用户:「为什么窄屏的横屏和竖屏没有自适应」。
## 根因
断点是**纯宽度**的:`(max-width: 1023px)`。手机竖屏 390 与横屏 844 **都落在同一档**
⇒ 布局一个像素都不变,横屏多出来的 ~450px 全浪费在空白上。看起来就是"没自适应"。
## 改动
- 新增 `useCompactTwoPane()`:`(min-width: 700px) and (max-height: 560px)`
—— 仍是紧凑外壳(悬浮底部导航),但内容区从**覆盖式**改成**列表 + 详情并排**。
用高度而不是 `landscape` 判:桌面窗口压扁、分屏、软键盘弹起都会命中,
而它们要的是同一件事(别浪费横向空间)。
- App:`compactTwoPane && hasList` 时走并排分支,其余情况仍是 NarrowStack 覆盖式。
- `--app-height` 增加 `orientationchange` 监听并延后一帧重算(iOS 上部分版本的
resize 不跟着方向变化走;立刻读会拿到旧高度)。
## 判据
`test/manual/rotate-verify.mjs` 8 条,含**可逆性**与前置对照:
竖屏覆盖式 → 横屏并排(真的换了 class)→ 旋回竖屏恢复覆盖式;
三态的 `--app-height` 分别为 844 / 390 / 844(不是旧值);横屏无横向溢出、
底部导航仍完整可见且浮着(left=20)。实测 **8/8**。
同一轮还补上了 `test/manual/calendar-swipe-verify.mjs`(日历滑动,4 条)。
2026-09-14 11:13:24 +08:00
..
2026-09-13 10:39:26 +08:00
2026-09-13 06:16:59 +08:00
2026-09-14 11:13:24 +08:00
2026-09-14 08:59:32 +08:00
2026-09-14 10:35:05 +08:00
2026-09-14 09:11:36 +08:00
2026-09-08 19:16:35 +08:00
2026-09-08 19:16:35 +08:00
2026-09-14 10:35:05 +08:00
2026-09-12 20:25:00 +08:00
2026-09-12 08:02:30 +08:00