Commit 815ee2641c

815ee2641c3e7dec3e32b1242c0919028742afaf

parent: f7887a84d2

Verified · cmc ci/build: success ci/test: success

cmc <hello@cleberg.net> · 2026-09-19 01:50 UTC

web: the overview's side column rules apply only above 62rem

Ref #228
internal/web/static/style.css +9 −8
@@ -1325,10 +1325,15 @@ details.refmenu .refdrop a.allrefs {
13251325
13261326/* ---- repository overview layout ---- */
13271327.overview { display: block; }
1328.overview.withfacts { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: var(--sp-6); align-items: start; }
13291328.overviewmain { min-width: 0; }
1330.overview.withfacts .facts { display: block; margin-top: 0; max-width: none; }
1331.overview.withfacts .clone pre { white-space: pre-wrap; word-break: break-all; }
1329/* the side column exists only above 62rem; below it .facts keeps its
1330 own two-up layout and the 40rem factgrid rule applies untouched */
1331@media (min-width: 62.01rem) {
1332 .overview.withfacts { display: grid; grid-template-columns: minmax(0, 1fr) 18rem; gap: var(--sp-6); align-items: start; }
1333 .overview.withfacts .facts { display: block; margin-top: 0; max-width: none; }
1334 .overview.withfacts .facts .factgrid { grid-template-columns: repeat(2, auto); }
1335 .overview.withfacts .clone pre { white-space: pre-wrap; word-break: break-all; }
1336}
13321337
13331338/* ---- repository facts ---- */
13341339.facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); margin: var(--sp-5) 0 var(--sp-4); max-width: 72rem; }
@@ -1341,12 +1346,10 @@ details.refmenu .refdrop a.allrefs {
13411346 color: var(--muted);
13421347}
13431348.clone { margin: 0 0 var(--sp-3); }
1344.facts .about { min-width: 0; }
1345.facts .about { margin-bottom: var(--sp-5); }
1349.facts .about { min-width: 0; margin-bottom: var(--sp-5); }
13461350.clone .fieldname { font-size: var(--fs-1); color: var(--muted); font-weight: 500; margin-bottom: 2px; }
13471351.clone pre { margin-bottom: var(--sp-3); user-select: all; }
13481352.factgrid { display: grid; grid-template-columns: repeat(4, auto); gap: var(--sp-2) var(--sp-4); font-size: var(--fs-2); margin-bottom: var(--sp-3); }
1349.overview.withfacts .facts .factgrid { grid-template-columns: repeat(2, auto); }
13501353.factgrid b { font-weight: 600; }
13511354.factgrid a { color: var(--fg); }
13521355.factgrid a:hover { color: var(--link); }
@@ -1466,8 +1469,6 @@ svg.icon { vertical-align: -0.125em; }
14661469 the activity feed, which reads after the queues */
14671470 .withaside .aside { order: -1; }
14681471 .withaside.feedlast .aside { order: 0; }
1469 .overview.withfacts { grid-template-columns: 1fr; }
1470 .overview.withfacts .facts { display: grid; grid-template-columns: 1fr 1fr; margin-top: var(--sp-5); }
14711472}
14721473
14731474@media (max-width: 52rem) {