From a6cb847f2f49eca68d66b6265bdeba9a6d2931c0 Mon Sep 17 00:00:00 2001 From: ZDDC Date: Thu, 21 May 2026 12:27:49 -0500 Subject: [PATCH] fix(browse): YAML editor cut off at viewport bottom MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit .preview-pane__body was flex: 1 + display: flex; flex-direction: column but without min-height: 0. The flex item's default min-height is min-content (its natural content size), so when the YAML editor's CodeMirror viewport carried many lines, the body grew to fit the editor instead of letting the editor scroll internally. The chain ran out of viewport before reaching the editor's bottom edge; the body's own scroll bottomed out at a height that still cropped the last few lines. Adding min-height: 0 lets the body shrink to its flex-allocated size so CodeMirror's internal scroll takes over correctly. Same root cause as the standard flex+overflow papercut documented in half the CSS guides on the internet — fine to add unconditionally, no other consumers of .preview-pane__body care. Co-Authored-By: Claude Opus 4.7 (1M context) --- browse/css/tree.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/browse/css/tree.css b/browse/css/tree.css index ca5726d..ff2a29d 100644 --- a/browse/css/tree.css +++ b/browse/css/tree.css @@ -244,6 +244,11 @@ body { .preview-pane__body { flex: 1; + min-height: 0; /* critical: lets the flex child shrink to fit + the viewport instead of growing to its + content's natural size (which clips the + YAML editor's bottom when there are many + lines, even with the editor's own scroll) */ overflow: auto; display: flex; flex-direction: column;