fix(listing): make the mobile archive reachable and clear the AA misses
Deploy / build (push) Successful in 33s
Deploy / build (push) Successful in 33s
Review pass on the 041471d delivery, measured rather than eyeballed.
/posts/ on a phone put its first archive row 2.36 screens down (featured block
1235 px + 435 px of controls = row at 1996 px at 390x844), so a reader who came
to browse had to scroll past three stacked 16:9 cards. Below 700 px the cards are
now horizontal — thumb 38 %, excerpt dropped, title clamped to three lines — and
the block header carries `All 91 posts ↓` into #archive-list (with scroll-margin
for the sticky header), which doubles as the bypass-block affordance. Block
1235 → 523 px, card 392 → 153 px, first row 1996 → 1309 px.
Two new small-text colours measured under WCAG AA (.feat-min 3.04:1,
.archive-status 3.67:1 at ~12 px) move to --muted → 5.78:1 and 6.99:1. The
featured heading went with them; pre-existing --faint dates (3.67:1) were left
alone rather than restyling 91 rows.
/categories/ still showed the old Gemini case-studies.webp while the category
page had the new topology banner — one category, two art languages. The tile now
uses case-studies-banner-1200.webp (14 KB) letterboxed on #0b1613: a 16:9 centre
crop sliced the outer host panels in half, the letterbox was measured seamless.
`6min read` was emitted without its space (template-literal fix → `6 min read`,
`6 分钟`, verified in dist/). Both /posts/ ledes stopped claiming the page is
purely newest-first.
probe-layout: 72/72 viewport checks, collapse still 425→0→425 (1280) and
523→0→523 (390) in EN and ZH.
This commit is contained in:
1 parent
050d73305d
commit
4e64bfc9ae
7 files changed
+124
-17
No files matched your search
@@ -120,3 +120,18 @@ node scripts/probe-layout.mjs # 退出码 1 = 有横向溢出或折叠
|
||||
(`devops` 出现两次:分类 30 / 话题 6)→ 加 *Category* / *Topic* 标签、≤700px 时标签上移;
|
||||
列表卡片标签数封顶 4 个 + `+N`,修复卡片元信息行高不一致;导航补 `aria-current="page"`
|
||||
(此前四个栏目链接在任何页面都没有当前位置提示)。
|
||||
|
||||
---
|
||||
|
||||
## 复审修复 — 2026-10-27(第二轮)
|
||||
|
||||
独立复核实测发现四处遗漏,已修并重新量过(详见 `project-state.md` §4e-bis):
|
||||
|
||||
| # | 问题 | 实测(前 → 后) | 改法 |
|
||||
| --- | --- | --- | --- |
|
||||
| P1 | 移动端 `/posts/` 首条归档行在 2.36 屏之外 | 精选块 1235→**523px**,卡片 392→**153px**,首行 1996→**1309px(1.55 屏)** | ≤700px 精选卡改左图右文、隐藏摘要、标题 3 行截断;块头加 `All 91 posts ↓`(含 `scroll-margin-top`) |
|
||||
| P2 | 两处新增小字不达 WCAG AA | `.feat-min` 3.04→**5.78**;`.archive-status` 3.67→**6.99**(AA 需 4.5:1) | `--faint` → `--muted`(仅新增元素;既有 91 行日期未动,避免整页重排) |
|
||||
| P3 | 同一分类两套视觉 | `/categories/` 瓦片原用旧 `case-studies.webp` | 改用 `case-studies-banner-1200.webp`(14KB)+ `object-fit:contain` on `#0b1613` 信箱式留边(16:9 居中裁切会切掉两侧主机面板,已实测) |
|
||||
| P4 | `6min read` 缺空格 | `6min read` → **`6 min read` / `6 分钟`** | 改为模板字符串(同款写法在文章页正常,此处在嵌套 span 内被吞掉) |
|
||||
|
||||
另:`/posts/`、`/zh/posts/` 导语不再声称"全部按时间倒序"。验收:`probe-layout` **72/72**,折叠在 EN/ZH × 1280/390 仍为 425→0→425 / 523→0→523。
|
||||
Reference in new issue
Block a user