See screenshot.
The notification divs don't properly fit on the screen and the content overflows them, causing them to have horizontal scrolling. Also there's a white margin on the left side that obscures any content behind it.
Description
Description
Details
Details
Related Objects
Related Objects
- Mentioned In
- T132393: [iOS mobile] Notification overlay: the dotdotdot menu does not work properly
T131498: Secondary links overflow the width on mobile
T140687: Make Notification page on mobile usable by suppressing the left, filtering nav (for now) - Mentioned Here
- T132393: [iOS mobile] Notification overlay: the dotdotdot menu does not work properly
T141949: [mobile] Special:Notification page has horizontal scrolling
T131498: Secondary links overflow the width on mobile
Event Timeline
Comment Actions
I think this is another case where the bottom "action" line is pushing outwards, making the div too wide and ending up pushing the notification sideways.
We are having a lot of issues (browser bug combined with some other technical stuff) limiting the width of the action line, and it shows most on smaller screens.
My current recommendation is to consider maybe putting all secondary actions inside the dotdotdot menu in mobile. This will make all lines equal and "compressed", it fits the mobile experience mostly, and it will most likely fix this bug too.
Pinging @jmatazzoni @Pginer-WMF and @Catrope for input.
Comment Actions
Or just get rid of the secondary actions and use links in the notification text :P But I guess that ship has sailed.
Comment Actions
I actually don't think that would've made the mobile experience better; links are smaller to click on and having multiple links can be annoying to click specifically, especially in small screens.
But anyways, as you say, the ship sailed on that one...
Comment Actions
There's definitely funny business going on in Kaldari's screenshot beyond the overflowing secondary actions. Look at the second second: the header is cut off on the left side, and the notifications' width is smaller. I just played with the special page on Joe's iPhone and I noticed that the second section (and only that one) is horizontally scrollable.
I agree that we should do something about the too-wide secondary links, and that's already captured at T131498: Secondary links overflow the width on mobile. But I feel like there's more to this bug than just that.
Comment Actions
I'm seeing that the page doesn't fit on my iphone 5 screen. (See the screenshot below.) This may be because the dotdotdot menus don't fit within the page frame when the links are longish? (See the second screenshot below.)
I see it also happens, though to a lesser degree, on the Notifications panel, which fits better but still has the dotdotdot problem, as you can see in the third screenshot (first message missing dotdot).
Comment Actions
Change 302369 had a related patch set uploaded (by Mooeypoo):
Reduce number of prioritized actions in mobile
Comment Actions
Change 302370 had a related patch set uploaded (by Mooeypoo):
Reduce notification items' prioritized actions in mobile popup
Comment Actions
Change 302370 merged by jenkins-bot:
Reduce notification items' prioritized actions in mobile popup
Comment Actions
Checked in betalabs - 'View changes' option has been moved inside the dotdotdot menu; the problem with overflowing the screen is solved
Notifications overlay:
Special:Notifications page
The Special:Notification page still has unnecessary scrollable horizontal action - filed it as a separate issue T141949: [mobile] Special:Notification page has horizontal scrolling
The usability of the dotdotdot menu on the Notifications overlay is severely impacted - see the task filed previously as T132393: [iOS mobile] Notification overlay: the dotdotdot menu does not work properly