Skip to content

修复全站页面对齐、首页网格与窄屏布局 - #6

Merged
bocmiao merged 1 commit into
mainfrom
fix/layout-alignment-20261104
Nov 4, 2026
Merged

bocmiao merged 1 commit into
mainfrom
fix/layout-alignment-20261104

Conversation

@bocmiao

@bocmiao bocmiao commented Nov 4, 2026

Copy link
Copy Markdown
Owner

Summary

修复总览与顶栏边界不一致、卡片列线错位,以及手机表单、侧栏和操作条布局问题,保留现有经典/玻璃外观。

页面容器:统一宽度和左右边距
├── 顶栏:沿用正文边界
├── 总览:四列基准,半宽/四分之一宽卡片共享列线
├── 表单:窄内容区标签在上,字段占满一行
└── AI 侧栏:宽屏并排,中窄屏覆盖

同时修复移动端侧栏定位被覆盖、表格操作列对齐、CDN 单元格布局、紧凑模式间距,以及 Baize 双列内容面板的窄屏重排。

Evidence

  • Before: 首页存在双重内边距、三套列宽比例;320px 设置输入框约 70px;统计与待处理页横向溢出;AI 侧栏响应式选择器未命中真实 DOM。
  • After: Chromium 9 种宽度 × 经典浅色/玻璃紧凑深色,共 306 个页面状态通过;无页面横向溢出或运行错误,标题/正文边距、卡片列线和等高、表头/数据列、菜单与 AI 侧栏开关均通过断言。320px 设置输入框为 256px。
  • 公共输入框/下拉框 32px、登录专用输入框 38px、复选框 16px、文件路径输入框 28px 均已检查。JS 语法、diff whitespace、布局检测器通过。
  • 新增 scripts/layout_smoke.mjs,运行方式和覆盖边界见验证说明。
  • 使用本地模拟数据:首页覆盖长内容,其余页面主要覆盖空数据/未配置状态,文件页覆盖离线错误状态;未连接生产账号或服务器,未验证所有服务端操作和弹窗。完整 Go CI 由此 PR 触发。

修复前:
修复前

修复后:
修复后

Merge Danger

Door: two-way

纯前端样式、表格表头标记和名称提示调整,可通过回退本提交恢复。

Blast Radius: frontend

公共样式影响所有页面。已覆盖主页面和两组外观;复杂生产数据与未覆盖弹窗仍需实际使用检查。没有后端、数据库或部署配置变更。

@bocmiao
bocmiao marked this pull request as ready for review November 4, 2026 16:33
@bocmiao
bocmiao merged commit 86e1ae1 into main Nov 4, 2026
10 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant