Page MenuHomePhabricator

Make Notification page on mobile usable by suppressing the left, filtering nav (for now)
Closed, ResolvedPublic

Description

To make the notifications page usable on mobile, we will (at first) supporess the left nav. (A plan for making the nav mobile friendly is described in a separate ticket, T139525.)

Details

Related Gerrit Patches:
mediawiki/extensions/Echo : masterMake Special:Notifications responsive

Event Timeline

Restricted Application added subscribers: Zppix, Aklapper. · View Herald TranscriptJul 18 2016, 8:45 PM
jmatazzoni renamed this task from Make mobile-friendly version of the Notifications page left nav to Make Notification page on mobile usable by suppressing the left, filtering nav (for now).Jul 18 2016, 8:51 PM
jmatazzoni assigned this task to Mooeypoo.
jmatazzoni updated the task description. (Show Details)
jmatazzoni added subscribers: Mooeypoo, Pginer-WMF.
Catrope triaged this task as High priority.Jul 18 2016, 9:57 PM

Change 299868 had a related patch set uploaded (by Mooeypoo):
[wip] Make Special:Notifications responsive

https://gerrit.wikimedia.org/r/299868

Change 299868 merged by jenkins-bot:
Make Special:Notifications responsive

https://gerrit.wikimedia.org/r/299868

Checked in betalabs - the sidebar is suppressed; the page is usable, in terms of displaying and functionality. Checked with iPhone and Chrome mobile emulator (screenshots are below).

In iOS 9.3.2 (6s iPhone)
Notice that 'Preference' link is present (it's absent from desktop version).

Chrome mobile emulator presents the view without 'Preferences' link

But when a link is http://en.m.wikipedia.beta.wmflabs.org/wiki/Special:Notifications, 'Preferences' link is displayed (the same as on a real device).

jmatazzoni added a comment.EditedJul 25 2016, 3:21 PM

Thanks @Mooeypoo, can we make some adjustments here? I.e.,

  • is there a reason we can't suppress the preferences link? Also
  • When you and I went over the mobile layout, you hadn't added the cog in yet. Now it's floating on its own line. Would it be possible to move the cog up to be on the same line with the Read/Unread filters? Or on the line with the page title?
  • (If you can do that, then close up the space where the cog was about halfway after.)

Thanks!

Those were fixed up in the follow up commit -- https://gerrit.wikimedia.org/r/#/c/300687/

It's merged now, it should work in beta.

Preference link is gone
The cog icon is displayed under the Read/Unread filters (makes sense since it's logically grouped together with pagination controls)
Without pagination


With pagination

The timestamps with weekdays are displayed now as e.g. 'Yesterday' or 'Friday' - filed as T141466: [betalabs] Mobile Special:Notifications page displays only weekday names

jmatazzoni added a comment.EditedJul 27 2016, 8:19 PM

I'm seeing that the page doesn't fit on my iphone 5 screen. (See the screenshot below—as well as Elena's screnshots above.) 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).

I don't know if it's worth the trouble to fix this; the page is usable, though ugly. @Mooeypoo, what do you think? What type of adjustments would be available and how much effort are they?

jmatazzoni closed this task as Resolved.Aug 1 2016, 9:31 PM

Resolving this, but moved the comment above to T141788