Monitor: a rung taller than one screen sizes rows to content, since the page scrolls there anyway and the cap only clipped cards

This commit is contained in:
Gmer4Lfe
2026-08-25 16:54:19 -04:00
parent f4adc31215
commit fb104bf05a
2 changed files with 28 additions and 4 deletions
+21
View File
@@ -164,6 +164,25 @@ function vv_mon_rung_rowdiv(int $cols): int {
return min(vv_mon_rung_rows($cols), VV_MON_ROWS_PER_SCREEN);
}
// Whether this rung is already taller than one screen. The row-height cap means "no card taller
// than 1/VV_MON_ROWS_PER_SCREEN of the screen", which is only worth paying for on a rung that
// fits a screen — there it is what keeps the board from scrolling. On a rung with more rows than
// the cap the page scrolls no matter what, so the cap buys nothing and only cuts each card's
// content off. At four columns this board is eight rows: an 11" tablet in landscape was being
// given 126px cards on a board two screens tall.
function vv_mon_rung_overflows(int $cols): bool {
return vv_mon_rung_rows($cols) > VV_MON_ROWS_PER_SCREEN;
}
// Rows sized by content instead of by the cap, for a rung that overflows the screen anyway.
// Mirrors the phone hatch in css/varaverk.css: the cards have to give up overflow:hidden too, or
// they keep clipping at a height nothing is constraining any more.
function vv_mon_autorows_css(): string {
return '#vv-monitor{grid-auto-rows:auto;}'
. '#vv-monitor .vv-card{overflow:visible;}'
. '#vv-monitor .vv-card>div{overflow-y:visible;min-height:auto;}';
}
// The class the page puts on #vv-monitor when a card is not rendered, so the generated absorb
// rules can fire. Derived from the id on both sides — PHP writes the rule, JS writes the class —
// so the two can never drift apart by a typo.
@@ -216,6 +235,7 @@ function vv_mon_board_css(): string {
$out = '';
$out .= "#vv-monitor{--vv-cols:$top;--vv-rowdiv:" . vv_mon_rung_rowdiv($top) . ";}\n";
if (vv_mon_rung_overflows($top)) $out .= vv_mon_autorows_css() . "\n";
$order = 0;
foreach ($cards as $card) {
@@ -245,6 +265,7 @@ function vv_mon_board_css(): string {
if ($wide) $out .= implode(',', $wide) . "{--vv-sp:$cols;}";
}
if (vv_mon_rung_overflows($cols)) $out .= vv_mon_autorows_css();
$out .= vv_mon_absorb_css($cols);
$out .= "}\n";
}