style: MPS-24 — fatter SERP right rail + slightly larger thumbnails

Operator tuning after 479dc0e:
- SERP right rail column 260px -> 340px (>=1100px); rail card thumb
  56px -> 76px to match the wider rail.
- serp-list thumbnail column bumped up a notch (still well below the
  original 140/200/260/320): 88->110, 110->145, 130->175, 150->210
  across the container tiers.
CSS-only; common.css is ?v={{ request.git_hash }} cache-busted.
This commit is contained in:
russell@unturf.com 2026-05-17 08:56:21 -04:00
parent 479dc0ed23
commit 66a76b5d50
No known key found for this signature in database

View file

@ -1585,7 +1585,7 @@ article.serp-list-row {
display: grid;
/* Smaller thumbnails (was 140/200/260/320 across the tiers below)
frees horizontal room for the body text + a right rail. */
grid-template-columns: 88px minmax(0, 1fr);
grid-template-columns: 110px minmax(0, 1fr);
gap: var(--space-4, 16px);
align-items: start;
padding: var(--space-3, 12px);
@ -1647,7 +1647,7 @@ p.serp-list-excerpt {
grows. The parent .serp-list is the query container. */
@container (min-width: 600px) {
article.serp-list-row {
grid-template-columns: 110px minmax(0, 1fr);
grid-template-columns: 145px minmax(0, 1fr);
gap: var(--space-5, 20px);
}
h3.serp-list-title {
@ -1656,12 +1656,12 @@ p.serp-list-excerpt {
}
@container (min-width: 900px) {
article.serp-list-row {
grid-template-columns: 130px minmax(0, 1fr);
grid-template-columns: 175px minmax(0, 1fr);
}
}
@container (min-width: 1200px) {
article.serp-list-row {
grid-template-columns: 150px minmax(0, 1fr);
grid-template-columns: 210px minmax(0, 1fr);
}
}
@ -1956,7 +1956,7 @@ div.tag-detail-layout {
@media (min-width: 1100px) {
div.tag-detail-layout {
/* facet | results | featured rail */
grid-template-columns: 220px minmax(0, 1fr) 260px;
grid-template-columns: 220px minmax(0, 1fr) 340px;
}
div.tag-detail-layout > aside.serp-rail {
grid-column: auto;
@ -1992,7 +1992,7 @@ ul.serp-rail-list {
}
li.serp-rail-card {
display: grid;
grid-template-columns: 56px minmax(0, 1fr);
grid-template-columns: 76px minmax(0, 1fr);
gap: var(--space-2, 8px);
align-items: start;
padding: var(--space-2, 8px);