A wiki article's "See it as…" menu hangs off the left of a phone screen #1029

Closed
opened 2026-10-02 03:39:50 +00:00 by claude-bot · 1 comment
Collaborator

Seen in the browser check of #1023's fixes (2 October). At 390px, as a GM on a wiki article, the "See it as…" menu's rect is −30…242: it hangs from its trigger and runs 30px off the left edge, so its text is cut ("ssian Vale", "riya Raghunathan"). At 1440 it is fine.

The same family as the bell's panel (#1024) and the wiki front page's search panel (#1026): a .menu hung from an anchor that is not at the edge its alignment assumes. Menu has an align="left" option (.menu--left); this trigger wants the menu kept inside the page's gutters at narrow widths.

Worth a sweep while there: every Menu/.menu whose trigger can sit near the left edge on a phone (the article's "More", the session and card menus), measured at 390.

Refs #1023.

Seen in the browser check of #1023's fixes (2 October). At 390px, as a GM on a wiki article, the "See it as…" menu's rect is −30…242: it hangs from its trigger and runs 30px off the left edge, so its text is cut ("ssian Vale", "riya Raghunathan"). At 1440 it is fine. The same family as the bell's panel (#1024) and the wiki front page's search panel (#1026): a `.menu` hung from an anchor that is not at the edge its alignment assumes. `Menu` has an `align="left"` option (`.menu--left`); this trigger wants the menu kept inside the page's gutters at narrow widths. Worth a sweep while there: every `Menu`/`.menu` whose trigger can sit near the left edge on a phone (the article's "More", the session and card menus), measured at 390. Refs #1023.
Author
Collaborator

Done in PR #1032, merged to main as 35cbc348 (head 1512a6cc verified on main, CI green).

Menu measures its open panel before paint and moves it sideways by whatever it is off by. The limit is the nearest box around it that clips its contents, and the window; it keeps a 16px gutter from that, but never more than its own button keeps. The panel is never wider than the screen.

The sweep this issue asked for, measured at 390×844 (touch) and 1440×900:

Menu Before After
Wiki article "See it as…", 390 −30…242 16…288
Post "Moderate this post", 390 −94…178 16…288
Character sheet "Export…", 390 −153…119 16…288
Table, first card's menu, 1440 0…272, cut by the shelf board 40…312, whole
Bell, account, wiki More, session Manage, Add to your calendar, thread More, File in a scene, table Add a card and Shelf menu on screen unchanged

Not measured: "Add to a sheet" (the seed has no page that offers it). The Shelf menu's final position rests on a unit test built from the measured rects, not a third browser pass.

Done in PR #1032, merged to main as 35cbc348 (head 1512a6cc verified on main, CI green). `Menu` measures its open panel before paint and moves it sideways by whatever it is off by. The limit is the nearest box around it that clips its contents, and the window; it keeps a 16px gutter from that, but never more than its own button keeps. The panel is never wider than the screen. The sweep this issue asked for, measured at 390×844 (touch) and 1440×900: | Menu | Before | After | |---|---|---| | Wiki article "See it as…", 390 | −30…242 | 16…288 | | Post "Moderate this post", 390 | −94…178 | 16…288 | | Character sheet "Export…", 390 | −153…119 | 16…288 | | Table, first card's menu, 1440 | 0…272, cut by the shelf board | 40…312, whole | | Bell, account, wiki More, session Manage, Add to your calendar, thread More, File in a scene, table Add a card and Shelf menu | on screen | unchanged | Not measured: "Add to a sheet" (the seed has no page that offers it). The Shelf menu's final position rests on a unit test built from the measured rects, not a third browser pass.
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
rbrooks/Quest-Board#1029
No description provided.