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
@@ -26,8 +26,9 @@ const featured = pickFeatured(posts, 'en', 3);
|
||||
>
|
||||
<h1>Posts</h1>
|
||||
<p class="archive-lead">
|
||||
{posts.length} posts, newest first. Filter by title, tag or category below — or read a
|
||||
whole topic through its <a href="/tags/docker/">tag page</a>.
|
||||
{posts.length} posts: three flagship write-ups first, then every post newest-first.
|
||||
Filter by title, tag or category below — or read a whole topic through its
|
||||
<a href="/tags/docker/">tag page</a>.
|
||||
</p>
|
||||
<Archive posts={posts} lang="en" featured={featured} />
|
||||
</BaseLayout>
|
||||
@@ -23,8 +23,8 @@ const featured = pickFeatured(posts, 'zh', 3);
|
||||
>
|
||||
<h1>文章</h1>
|
||||
<p class="archive-lead">
|
||||
共 {posts.length} 篇,按时间倒序。下方可按标题、标签或分类即时筛选,也可以走
|
||||
<a href="/zh/tags/docker/">标签页</a> 把一个主题读完。
|
||||
共 {posts.length} 篇:顶部是 3 篇旗舰复盘,下方全量按时间倒序。可按标题、标签或分类即时筛选,
|
||||
也可以走 <a href="/zh/tags/docker/">标签页</a> 把一个主题读完。
|
||||
</p>
|
||||
<Archive posts={posts} lang="zh" featured={featured} />
|
||||
</BaseLayout>
|
||||
Reference in new issue
Block a user