From d01aefbc70ab3191257ceafba538a03f66e971d6 Mon Sep 17 00:00:00 2001 From: jolavillette Date: Thu, 10 Sep 2026 22:01:10 +0200 Subject: [PATCH] webui: the dialog auto-close queries the same media condition as the CSS min-width: 701px is not the complement of the stylesheet's max-width: 700px: at fractional viewport widths between the two (normal at desktop zoom levels) the sheet was CSS-hidden but still modal -- the inert-lock this fix exists to remove, surviving in a crack. The JS now watches max-width: 700px, the exact condition that shows the sheet, and closes when it stops matching. Co-Authored-By: Claude Fable 5 --- webui-src/app/dialog.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/webui-src/app/dialog.js b/webui-src/app/dialog.js index 756bc68..00cb9cb 100644 --- a/webui-src/app/dialog.js +++ b/webui-src/app/dialog.js @@ -15,9 +15,14 @@ const Dialog = () => { // but showModal() keeps the whole page inert regardless -- rotating to // landscape with a sheet open left the UI untappable with no visible // way out. Crossing into the desktop layout closes the sheet instead. - desktopQuery = window.matchMedia('(min-width: 701px)'); + // The SAME condition the stylesheet uses to show the sheet + // (max-width: 700px), so JS and CSS agree at every width -- a + // min-width: 701px mirror leaves a fractional crack (700 < w < 701, + // common at desktop zoom levels) where the sheet is hidden but still + // modal. + desktopQuery = window.matchMedia('(max-width: 700px)'); onLayoutChange = (event) => { - if (event.matches) { + if (!event.matches) { onclose(); m.redraw(); }