Review changes batch 6 of 6

This commit is contained in:
2026-07-20 06:52:33 +08:00
parent db97d3da27
commit 5a31a75da0
160 changed files with 9206 additions and 572 deletions
@@ -0,0 +1,143 @@
# G01 次要文字可读性优化实施计划
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
**Goal:** 提高 G01“加入申请”卡片说明与状态文字在浅色山水背景上的可读性,同时保持原有信息层级、卡片尺寸和滚动结构。
**Architecture:** 样式所有权继续留在 `pages/genealogy/g01-my-genealogies.vue`,不修改共享 `GenealogyCard.vue`。静态视觉契约锁定四类文字的字号、颜色和字重;现有 G01 运行 smoke 与五档截图验证没有重叠、裁切和滚动回归。
**Tech Stack:** uni-app、Vue 3、SCSS、PowerShell 静态契约、Node.js Chrome DevTools Protocol 运行 smoke。
## Global Constraints
- 只修改 G01 申请卡片说明与状态样式,不修改共享家谱卡、28% 公共背景或其他页面。
- 申请说明固定为 `28rpx / 500 / #62584c / 1.4`;状态固定为 `27rpx / 600`,审核中 `#7f4f16`,被拒绝 `#a7160c`,已退出 `#62584c`
- 卡片高度、内边距、相邻 `12rpx` 间距、箭头、文案和点击行为保持不变。
- H5 证据不等于 Android/HBuilderX 已通过,也不等于 G01 整页已验收。
- 不使用多代理或 worktree,不执行 `git add``commit``push``reset``checkout`
---
### Task 1: 用视觉契约锁定可读性样式
**Files:**
- Modify: `tests/g01-visual-contract.ps1`
- Test: `tests/g01-visual-contract.ps1`
**Interfaces:**
- Consumes: G01 的 `.application-record__copy``.application-record__status` 及两个状态修饰类。
- Produces: 已确认字号、颜色、行高和字重的静态合同。
- [ ] **Step 1: 写入失败断言**
在申请卡片间距断言之后加入:
```powershell
if ($page -notmatch '(?s)\.application-record__copy\s*\{[^}]*color:\s*#62584c;[^}]*font-size:\s*28rpx;[^}]*font-weight:\s*500;[^}]*line-height:\s*1\.4;') { throw 'G-01 application descriptions do not use the approved readable style.' }
if ($page -notmatch '(?s)\.application-record__status\s*\{[^}]*color:\s*#7f4f16;[^}]*font-size:\s*27rpx;[^}]*font-weight:\s*600;') { throw 'G-01 application statuses do not use the approved readable base style.' }
if ($page -notmatch '(?s)\.application-record__status--rejected\s*\{[^}]*color:\s*#a7160c;') { throw 'G-01 rejected status must preserve the approved semantic red.' }
if ($page -notmatch '(?s)\.application-record__status--muted\s*\{[^}]*color:\s*#62584c;') { throw 'G-01 muted status does not use the approved readable color.' }
```
- [ ] **Step 2: 运行契约并确认 RED**
Run:
```powershell
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-visual-contract.ps1
```
Expected: FAIL,错误包含 `application descriptions do not use the approved readable style`
---
### Task 2: 实施最小样式修改
**Files:**
- Modify: `pages/genealogy/g01-my-genealogies.vue`
- Test: `tests/g01-visual-contract.ps1`
**Interfaces:**
- Consumes: Task 1 的四组视觉契约。
- Produces: 仅 G01 申请卡片生效的增强可读性样式。
- [ ] **Step 1: 替换申请文字样式**
```scss
.application-record__status {
flex: 0 0 auto;
margin-left: 16rpx;
color: #7f4f16;
font-size: 27rpx;
font-weight: 600;
}
.application-record__status--rejected { color: #a7160c; }
.application-record__status--muted { color: #62584c; }
.application-record__copy {
display: block;
margin-top: 10rpx;
color: #62584c;
font-size: 28rpx;
font-weight: 500;
line-height: 1.4;
}
```
- [ ] **Step 2: 运行契约并确认 GREEN**
Run:
```powershell
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-visual-contract.ps1
```
Expected: `PASS G-01 visual contract`
- [ ] **Step 3: 证明契约可捕获回归**
临时把说明字号恢复为首轮 `26rpx`,运行契约确认失败;随后恢复 `28rpx` 并再次确认通过。临时变化不得保留。
---
### Task 3: 运行、截图和状态更新
**Files:**
- Modify: `docs/交接记录.md`
- Modify: `docs/验收规划.md`
- Modify: `design-qa.md`
- Evidence: `docs/design/screens/runtime/2026-07-16/g01-text-legibility-audit/`
**Interfaces:**
- Consumes: Task 2 已通过静态契约的 G01 页面。
- Produces: 五档响应式证据、修改前后 412×915 对比和准确的交接状态。
- [ ] **Step 1: 运行 G01 静态与运行回归**
Run:
```powershell
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-empty-state-contract.ps1
powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-visual-contract.ps1
node tests/g01-empty-state-runtime-smoke.js http://localhost:5173
```
Expected: 三组均输出 `PASS`
- [ ] **Step 2: 生成五档截图并检查布局**
覆盖 `320×568``360×640``360×800``412×915``412×1000`;确认长说明不与状态或箭头重叠,卡片高度和 12rpx 间距不变,底栏与独立滚动正常。
- [ ] **Step 3: 更新状态文档**
写明用户确认并实施 G01 申请次要文字增强;H5 只形成内部候选,Android/HBuilderX 与 G01 整页验收仍未完成。
- [ ] **Step 4: 最终检查**
Run:
```powershell
git diff --check
git status --short
```
Expected: `git diff --check` 退出码为 0;不覆盖、删除或清理任何已有工作区内容。