From bf100775376842a701fcad7a455701e395f343a2 Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Fri, 16 Oct 2026 22:35:29 -0700 Subject: The view strip scrolls sideways; the page can never be wider than the screen. MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Five chips (Notes, Conversations, Images, Videos, Articles — Conversations joined them today) no longer fit a phone, and the strip was a flex row that neither wrapped nor scrolled: the page was 42px wider than a 390px screen, which on an iPhone is a page you can pinch out of and pan, a blank strip down the right (Adam, 2026-10-16: "I can kinda zoom out and pan around a bit on my phone"). The strip now scrolls sideways like the feed chips above it, and the root element clips sideways overflow outright so no stray wide row can do this again (on the root, not body: a body that clips becomes the scroll container a sticky rail measures against). feed-media-views-test: the strip scrolls sideways and the page is no wider than the window. Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_01J1Kon8bxJoHRpJdSzshCkp --- tools/feed-media-views-test.js | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'tools') diff --git a/tools/feed-media-views-test.js b/tools/feed-media-views-test.js index 14a9803..fe62413 100644 --- a/tools/feed-media-views-test.js +++ b/tools/feed-media-views-test.js @@ -128,6 +128,11 @@ try { console.log('\n[the switch]'); check('Notes / Conversations / Images / Videos / Articles sit under the chips, Notes on', await page.evaluate(() => [...document.querySelectorAll('.media-mode')].map((b) => b.textContent + (b.classList.contains('on') ? '*' : '')).join(',') === 'Notes*,Conversations,Images,Videos,Articles')); + // five chips are wider than a phone: the strip scrolls sideways, the page does not get wider + check('…the strip scrolls sideways rather than widening the page', await page.evaluate(() => { + const s = document.querySelector('.media-modes'); + return s.scrollWidth > s.clientWidth && getComputedStyle(s).overflowX === 'auto' && document.documentElement.scrollWidth <= innerWidth; + }), await page.evaluate(() => 'page ' + document.documentElement.scrollWidth + ' of ' + innerWidth)); console.log('\n[Images: a grid]'); await mode('images'); -- cgit v1.2.3