baodan/layout.md at master

#	问题	修复	文件
1	前端构建失败（引号错误）	size="small type=" → size="small" type="	PosterHistoryPage.vue
2	migrate_014 ORM vs 缺失列	全部改为原始 SQL，不再引用 ORM 模型	migrate_014.py
3	cleanup 字段名错误	output_path → ppt_path	cleanup.py
4	文案生成 case 越权	添加 case.user_id != user_id 校验	poster/service.py
5	存储路径未接通持久化卷	全部改用 get_storage_root()（默认 /app/api/storage/insurance）	config.py, ppt/routes.py, poster/service.py, poster/tasks.py
高风险问题修复
#	问题	修复	文件
6	migrate_019 rollback 撤销成功字段	每个 ALTER 后立即 commit，失败只回滚当前语句	migrate_019.py
7	迁移锁 Windows 不兼容 + 句柄未持久化	全局变量保存锁句柄，支持 Windows msvcrt	api/insurance/db/__init__.py
8	PDF 校验异常时放行	异常返回 False（文件损坏）	security.py
9	健康检查始终返回成功	缺少关键资源时返回 503 + missing 列表	poster/routes.py
10	短密钥掩码泄露原值	≤4 字符返回 ****	ppt_admin_service.py
11	设置无键名白名单	添加 _ALLOWED_SETTING_KEYS 白名单	ppt_admin_service.py
12	容器重启任务永久 stuck	添加 recover_stale_tasks() 启动恢复函数	poster/tasks.py, ppt/parse_worker.py

2026-07-27 13:52:09 +08:00

5.0 KiB

Raw Permalink Blame History

Layout turns product priority into reading order, grouping, rhythm, and usable space. Diagnose the structural problem before moving boxes.

Visitor mode

Persuade + Experience: composition may be asymmetric, fluid, or intentionally disruptive when the selected world earns it.
Operate + Read: predictable structure, stable density, and navigable linearity are affordances.
Native: follow ios.md or android.md for navigation, insets, adaptation, and touch targets.

Preserve the established visual world. A layout command changes structure inside it; identity replacement belongs to new-work.md.

Two isolated assessments

When a sub-agent tool is available and permitted, run these independently; otherwise run them yourself in this order.

Layout assessment: inspect representative states and viewports. Answer every question below with rendered or source evidence:
- Reading order: Apply the squint test. With detail blurred, can you still identify the primary element, the secondary element, and the major groups in order?
- Grouping: Are related items close and distinct groups separated, or are containers compensating for weak proximity?
- Rhythm: Do tight and generous intervals create a deliberate cadence, or is one spacing value repeated until everything has equal weight?
- Structure: Does the topology match the content and task? Are repeated cards, columns, or sections genuinely equivalent, or merely a framework default?
- Density: Does the amount of information per region fit use frequency, decision complexity, and visitor mode?
- Adaptation: At narrow, intermediate, wide, zoomed, and localized states, what reorders, collapses, wraps, scrolls, or remains fixed? Does DOM and focus order still agree with the visual order?
- Extremes: Do long content, empty states, overlays, sticky elements, safe areas, and small touch targets expose structural failures?
Mechanical scan: run:

node .claude/skills/impeccable/scripts/detect.mjs --json --scope layout [target files or dirs]

Also inspect arbitrary spacing, overflow, stacking, and container behavior the detector cannot resolve. Keep mechanical evidence out of the first assessment, then synthesize both passes before editing. A clean scan cannot prove hierarchy or rhythm.

Set the spatial thesis

Before editing, name:

the primary reading or task path;
what belongs together and what must separate;
which element leads and which supports;
the intended density and spacing rhythm;
how the structure changes across containers, viewports, input modes, and content extremes.

Choose the simplest structural model that expresses those relationships. Use layout primitives according to the relationships they control, and name reusable spacing and container roles semantically.

Apply

Group by meaning. Use proximity before adding containers or decoration.
Create rhythm through deliberate contrast between tight and generous intervals.
Use a documented spacing scale rather than one-off values. A 4-unit base usually provides the useful middle steps that an 8-only scale misses.
Let hierarchy follow product priority, not framework defaults.
Keep distinct content visually distinct without turning every group into an isolated component.
Make responsive behavior structural: reorder, collapse, reflow, or reveal based on what remains important.
Prefer container-aware components when the same component appears in different contexts.
Use gap for sibling rhythm when it expresses the relationship more directly than child margins.
Keep touch targets usable even when their visible marks are small.
Use depth only when it clarifies state or hierarchy.
Make optical corrections only after inspecting the rendered result.

Variation is not a goal by itself. Repetition should support recognition; break it only when content or priority changes.

Verify

The squint test still reveals the primary, secondary, and major groups in order.
The reading and task path remains clear at every supported size.
Related content groups naturally; unrelated content does not blur together.
Tight and generous spacing create intentional rhythm instead of monotonous repetition.
Density matches use frequency and content complexity.
Long text, empty states, localization, zoom, and dynamic content do not break the structure.
Keyboard, touch, and assistive-technology order agree with the visual order.
The final mechanical scan has no unexplained findings.

Answer each item with rendered or source evidence, then rerun the scan. Do not substitute a bare “yes” for verification.

When the structure holds, hand off to /impeccable polish.

Live-mode signature params

Every variant declares a coarse density parameter and authors spacing against var(--p-density, 1).

{"id":"density","kind":"range","min":0.6,"max":1.4,"step":0.05,"default":1,"label":"Density"}

Add one structural parameter only when the topology genuinely branches. Follow live.md's parameter contract.

5.0 KiB Raw Permalink Blame History