From 525bf7c15ca939b3735b2dcbd1a7b96aa85a327e Mon Sep 17 00:00:00 2001 From: mattshax Date: Tue, 8 Sep 2026 04:00:46 +0000 Subject: [PATCH] fix(mobile): the element between the app and the views can shrink, so pages scroll Measured in a headless browser at phone size rather than guessed: the main element that holds the views is a flex item whose default min-height is auto, which refuses to shrink below its content. In the phone's column that let a tall page grow the layout past the viewport, Settings measured 2102px inside an 844px app, which carried the navigation bar off-screen and left nothing able to scroll, because the scrolling containers inside each view never got a bounded height to work against. With min-height zero every view now fits the viewport and its own scroller does the work: verified across chat, settings, help, library, stats, agents, search, and query, each reporting an app that fits and a navigation bar on the bottom edge. --- web/src/styles.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/web/src/styles.css b/web/src/styles.css index 3cfda57..0ba7e88 100644 --- a/web/src/styles.css +++ b/web/src/styles.css @@ -121,6 +121,14 @@ button { font-family: inherit; } .app { display: flex; flex-direction: column; height: 100%; } .app-body { display: flex; flex: 1; min-height: 0; } +/* The element between the app body and the views. A flex item's default + min-height is auto, which refuses to shrink below its content: in the + phone's column that let a tall page (Settings, measured at 2102px in an + 844px app) push the whole layout past the viewport, carrying the + navigation bar off-screen and leaving nothing able to scroll, since the + scrolling containers below it never got a bounded height to work + against. Zero here is what lets every view's own scroller do its job. */ +main.content { min-height: 0; min-width: 0; } /* Classification banner: full width above everything, in the platform's style. Sized so it reads as chrome and not as content. */