fix: listing review round — responsive grid collapse, branch fallback, test assertions
Quality review fixes for Task 10c (2 Important + 5 Minor): - [I1] sf-tp-card-grid--listing now collapses to 2 cols at 900px and compact gap at 620px: the 3-col declaration sits after the 10a media blocks in source order, so the fold rules must live in the new 10c media blocks to win at equal specificity - [I2] tp_post_like trusts the first listing item's content type when the list is non-empty; the route-substring fallback now only applies to empty listings of kind=='listing' — /categories/post-sales-service/ style slugs can no longer flip a product category page into the news branch - [M3] empty-state negative assertions check the rendered attribute string, not the selector literal (previously always true) - [M4] catalogue section-head intro is now an item/page count instead of duplicating the hero lead - [M5] Popular reads entries link to the posts (same data as Latest, no analytics source on the platform) - [M6] both /categories/pumps/ pagination pages assert exactly one h1 - [M7] side-panel sticky top uses --sf-tp-space-24 Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
@@ -290,7 +290,7 @@
|
||||
/* 产品目录布局:260px 分类侧栏 + 主列(cms layout-sidebar / side-panel) */
|
||||
.sf-theme-trade-pro .sf-tp-catalogue-layout{display:grid;grid-template-columns:260px 1fr;gap:var(--sf-tp-space-8)}
|
||||
.sf-theme-trade-pro .sf-tp-catalogue-single{display:block}
|
||||
.sf-theme-trade-pro .sf-tp-side-panel{align-self:start;padding:var(--sf-tp-space-5);border-radius:var(--sf-tp-card-border-radius);background:var(--sf-tp-color-surface-muted);position:sticky;top:calc(var(--sf-tp-space-16) + var(--sf-tp-space-16))}
|
||||
.sf-theme-trade-pro .sf-tp-side-panel{align-self:start;padding:var(--sf-tp-space-5);border-radius:var(--sf-tp-card-border-radius);background:var(--sf-tp-color-surface-muted);position:sticky;top:var(--sf-tp-space-24)}
|
||||
.sf-theme-trade-pro .sf-tp-side-panel h3{font-size:var(--sf-tp-font-size-sm);letter-spacing:var(--sf-tp-letter-spacing-wide);text-transform:uppercase;margin-block-end:var(--sf-tp-space-2)}
|
||||
.sf-theme-trade-pro .sf-tp-side-link{display:block;padding:calc(var(--sf-tp-space-4) - var(--sf-tp-space-1)) var(--sf-tp-space-4);border-block-end:var(--sf-tp-border-width-hairline) solid var(--sf-tp-color-border-default);font-weight:var(--sf-tp-font-weight-semibold);color:var(--sf-tp-color-text-secondary);font-size:var(--sf-tp-font-size-sm)}
|
||||
.sf-theme-trade-pro .sf-tp-side-link:hover{color:var(--sf-tp-color-text-brand)}
|
||||
@@ -343,6 +343,9 @@
|
||||
.sf-theme-trade-pro .sf-tp-page-hero-copy{width:100%}
|
||||
.sf-theme-trade-pro .sf-tp-catalogue-layout{grid-template-columns:1fr}
|
||||
.sf-theme-trade-pro .sf-tp-side-panel{position:static;display:grid;grid-template-columns:repeat(2,1fr);gap:0 var(--sf-tp-space-4)}
|
||||
/* listing 栅格折叠规则须落在上方 3 列声明之后(同特异性按源顺序取胜),
|
||||
既有 10a 的 900px 折叠块在本段之前,覆盖不到 --listing 修饰符 */
|
||||
.sf-theme-trade-pro .sf-tp-card-grid--listing{grid-template-columns:repeat(2,minmax(0,1fr))}
|
||||
.sf-theme-trade-pro .sf-tp-news-layout{grid-template-columns:1fr}
|
||||
.sf-theme-trade-pro .sf-tp-news-row{grid-template-columns:240px 1fr}
|
||||
}
|
||||
@@ -355,6 +358,7 @@
|
||||
.sf-theme-trade-pro .sf-tp-page-hero-copy h1{font-size:28px;line-height:1.05;margin-block-end:8px}
|
||||
.sf-theme-trade-pro .sf-tp-page-hero-lead{font-size:11px;line-height:1.35;margin-block-end:12px}
|
||||
.sf-theme-trade-pro .sf-tp-side-panel{display:block}
|
||||
.sf-theme-trade-pro .sf-tp-card-grid--listing{gap:10px}
|
||||
.sf-theme-trade-pro .sf-tp-news-row{grid-template-columns:1fr}
|
||||
.sf-theme-trade-pro .sf-tp-news-row .sf-tp-card-media{aspect-ratio:16/9}
|
||||
.sf-theme-trade-pro .sf-tp-news-body h3{font-size:var(--sf-tp-font-size-lg)}
|
||||
|
||||
Reference in New Issue
Block a user