Page MenuHomePhabricator

Notification group has a redundant separator
Closed, ResolvedPublic

Description

pasted_file (251×528 px, 27 KB)

It also isn't necessary when the group is expanded

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript

I think this is how it was originally designed. @Pginer-WMF is on vacation for a few more days but should hopefully be able to respond to this once he gets back.

Expanded:

pasted_file (358×522 px, 37 KB)

This one is definitely wrong.

The visual metaphor used for bundles was about notifications being stacked on top of each other. The line is a subtle indicator that these are not a single notification but a stack of many.

When expanded, it seems that the additional line is still visible, and as noted by @Esanders, it should not be the case.

The visual metaphor used for bundles was about notifications being stacked on top of each other. The line is a subtle indicator that these are not a single notification but a stack of many.

I'm not sure that reads. Does it need to be multiple lines or something else?

That line generates a separation which is intended to be consistent with how the notification opens (notice in your example of F4339766 the bottom white element that helps separate what's inside the notification from what is outside, especially when the next one is a read one).

We can explore other options, but I'd keep it in the subtle side since the "expand" label and icon already communicate clearly the functionality.

The visual metaphor used for bundles was about notifications being stacked on top of each other. The line is a subtle indicator that these are not a single notification but a stack of many.

When expanded, it seems that the additional line is still visible, and as noted by @Esanders, it should not be the case.

Sorry, I'm a little confused, which of the lines should not be visible when expanded?

The visual metaphor used for bundles was about notifications being stacked on top of each other. The line is a subtle indicator that these are not a single notification but a stack of many.

When expanded, it seems that the additional line is still visible, and as noted by @Esanders, it should not be the case.

Sorry, I'm a little confused, which of the lines should not be visible when expanded?

It is a light grey line on a lighter grey background, so it may not be easy to notice depending on the contrast settings of your screen. I tried to zoom it below to clarify:

line-to-remove.png (1×2 px, 213 KB)

If my DOM inspection is correct, it is the "mw-echo-ui-crossWikiNotificationItemWidget-separator" element which should be visible when the bundle is collapsed but hidden when expanded.

Change 308001 had a related patch set uploaded (by Mooeypoo):
Hide xwiki widget separator when widget is expanded

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

Awesome, thank you!

I added a class for the expanded widget and I'm using that to hide that separator when the widget is expanded in this patch.

Change 308001 merged by jenkins-bot:
Hide xwiki widget separator when widget is expanded

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

Checked in betalabs

  • "mw-echo-ui-crossWikiNotificationItemWidget-separator" is gone

Screen Shot 2016-09-07 at 12.52.43 PM.png (456×623 px, 51 KB)

@Pginer-WMF and @Mooeypoo - for bundled notifications the grey additional line should be removed too?
Screen Shot 2016-09-07 at 12.42.19 PM.png (402×672 px, 50 KB)

Change 309205 had a related patch set uploaded (by Mooeypoo):
Hide separator when bundled item is expanded

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

Whoops, my bad. Fix on the way.

Change 309205 merged by jenkins-bot:
Hide separator when bundled item is expanded

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

For both bundled cases - cross-wiki and local bundles - the additional grey line is removed.

Screen Shot 2016-09-12 at 12.19.16 PM.png (565×601 px, 67 KB)