Page MenuHomePhabricator

'All notifications' and 'Preferences' buttons shoud fill their containers properly
Closed, ResolvedPublic

Description

Currently only the area in blue is clickable but the design makes it look like the whole white area is the button, so the whole area should be clickable

Compare with MessageDialog:

Details

Related Gerrit Patches:
mediawiki/extensions/Echo : masterLet action buttons center align
mediawiki/extensions/Echo : masterRestyle buttons to be fully clickable
mediawiki/extensions/Echo : masterFooter buttons should fill their footer containers

Event Timeline

Esanders created this task.Sep 10 2015, 9:46 PM
Esanders raised the priority of this task from to Needs Triage.
Esanders updated the task description. (Show Details)
Esanders added subscribers: Esanders, Aklapper.

Change 237517 had a related patch set uploaded (by Esanders):
Restyle buttons to be fully clickable

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

Change 237525 had a related patch set uploaded (by Mooeypoo):
Footer buttons should fill their footer containers

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

Change 237525 abandoned by Mooeypoo:
Footer buttons should fill their footer containers

Reason:
Already covered in I750a18a90c655

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

Mooeypoo set Security to None.

Change 237517 merged by jenkins-bot:
Restyle buttons to be fully clickable

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

Any reason why these buttons aren't centered like MessageDialog?

After I converted to framed buttons I had to override the alignment, as framed buttons use text-align:center.

I created that mockup on top of a screenshot of the current status at that time (adding the icon in the header and showing how it fitted with the new badges). It was not intended to describe any change for the rest of the elements.

I agree with @Esanders in making the whole area clickable to match expectations and require less precision to access it. Having the labels centered in that space seems good to me. It can be argued that keeping "All notifications" action aligned with the rest of the elements above it facilitates the scan line, but it also makes the margins to become unbalanced. So overall, I'd expect centered actions to work better.

Change 237628 had a related patch set uploaded (by Esanders):
Let action buttons center align

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

Change 237628 merged by jenkins-bot:
Let action buttons center align

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

Legoktm closed this task as Resolved.Sep 11 2015, 6:25 PM
Legoktm added a subscriber: Legoktm.

Checked in betalabs

  • the area around labels is fully clickable
  • the labels(action buttons) are centered