PageShell drops the bottom-right drag handle and its pointer/touch
tracking entirely, and adds a small header button (ArrowsOutLineHorizontal)
that opens a menu with five discrete widths: XS 340 · S 440 · M 540 ·
L 720 · XL 960. Each entry shows its label and pixel value and
highlights whichever one is currently closest to the persisted
widthPx — so legacy freehand values (e.g. 823) still light up the
nearest entry when the menu first opens.
New module width-presets.ts holds the preset array and a
nearestPresetIndex() helper so the same snapping logic isn't
duplicated between PageShell and the store.
Also drops the .page-shell.resizing style (and the `resizing`
state, the shellEl ref, and the MIN/MAX width/height constants)
that only existed to colour the shell while a drag was active.
The five presets cover the useful width range without wasting
space on tiny viewport-sized differences; anyone wanting an
uncommon width can adjust widthPx directly in Dexie for now.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
8b6b73627c