VersionControl:PRs/magenta/439: Difference between revisions
From PickiPedia: A knowledge base of bluegrass, old time psychedelic jams, and other public domain music
Jump to navigationJump to search
cryptograss/magenta#439, as GitHub has it |
cryptograss/magenta#439, as GitHub has it |
||
| Line 16: | Line 16: | ||
|deploy=redeploy maybelle (magenta) | |deploy=redeploy maybelle (magenta) | ||
}} | }} | ||
<pre class="pr-body">Skyler's iPhone showed the Mood slid sideways: the left of every message cut off, empty space on the right. The cause was a long `master.m3u8` address I'd put in inline code. Inline code and links never break, so the address ran past the edge of the screen, and iOS Safari let the whole page pan. | |||
**Change:** `.turn .body code` and `.turn .body a` get `overflow-wrap: anywhere`, so a long address breaks where it has to. Code blocks (`pre`) are unchanged and keep their own horizontal scroll. | |||
**Checked:** in Chromium at 390px on production, I added a paragraph to a turn with the address in code and as a link. Before: the code reached x=743 and the link x=737. After: 351 and 353. Chromium clips that overflow, so the page didn't visibly widen there; iOS Safari doesn't clip it, which is why the page slid on Skyler's phone. Not checked on a real iPhone. New test: `test_long_code_wraps.py`. | |||
Deploy: redeploy maybelle (magenta) | |||
Worked on by: magent and Skyler, in #uploads-and-embeds</pre> | |||
Revision as of 16:06, 9 November 2026
| State | 🟢 open |
|---|---|
| Worked on by | magent, skyler |
| Moods | #uploads-and-embeds |
| Deploy | redeploy maybelle (magenta) |
| Branch | magent/code-wraps → main, by magent-cryptograss
|
| Opened · last pushed | 2026-11-08 18:59:49 · 2026-11-08 18:59:45 |
Skyler's iPhone showed the Mood slid sideways: the left of every message cut off, empty space on the right. The cause was a long `master.m3u8` address I'd put in inline code. Inline code and links never break, so the address ran past the edge of the screen, and iOS Safari let the whole page pan. **Change:** `.turn .body code` and `.turn .body a` get `overflow-wrap: anywhere`, so a long address breaks where it has to. Code blocks (`pre`) are unchanged and keep their own horizontal scroll. **Checked:** in Chromium at 390px on production, I added a paragraph to a turn with the address in code and as a link. Before: the code reached x=743 and the link x=737. After: 351 and 353. Chromium clips that overflow, so the page didn't visibly widen there; iOS Safari doesn't clip it, which is why the page slid on Skyler's phone. Not checked on a real iPhone. New test: `test_long_code_wraps.py`. Deploy: redeploy maybelle (magenta) Worked on by: magent and Skyler, in #uploads-and-embeds