fix(browse): YAML editor cut off at viewport bottom

.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) <noreply@anthropic.com>
This commit is contained in:
ZDDC 2026-05-21 12:27:49 -05:00
parent 889aa78589
commit a6cb847f2f

View file

@ -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;