From 8e648dc304b155495f16c527cd78195aeca49c29 Mon Sep 17 00:00:00 2001 From: Asger Geel Weirsoee Date: Tue, 20 Oct 2026 17:41:36 +0200 Subject: [PATCH] Layout helpers: keep wide children inside the page, plain row links A .wt-pre inside .wt-stack widened the grid column past the viewport on phones. Rows used as links now inherit the text colour instead of being underlined. Claude-Session: https://claude.ai/code/session_01QhLkBGEip8wQdaZ54z4AqJ --- weirsoe-theme.css | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/weirsoe-theme.css b/weirsoe-theme.css index 8d83aa9..aec1047 100644 --- a/weirsoe-theme.css +++ b/weirsoe-theme.css @@ -236,9 +236,12 @@ body::before { .wt-tag--warn { --wt-tag-tone: var(--color-warn); } .wt-tag--bad { --wt-tag-tone: var(--color-bad); } /* layout helpers: a wrapping row and a vertical stack with the theme gap */ -.wt-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; } +.wt-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; min-width: 0; } .wt-row--between { justify-content: space-between; } -.wt-stack { display: grid; gap: 0.75rem; } +a.wt-row { color: inherit; text-decoration: none; } +a.wt-row:hover { color: var(--color-accent); } +/* minmax(0,1fr): a wide child (e.g. .wt-pre) scrolls instead of widening the page */ +.wt-stack { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.75rem; min-width: 0; } /* monospace output box (logs, terminal captures); keeps columns, scrolls sideways */ .wt-pre { margin: 0; padding: 0.75rem 0.9rem; overflow-x: auto; white-space: pre;