| Jdrewniak | |
| Sep 13 2019, 1:41 PM |
| F30764630: Screen Shot 2019-10-16 at 1.08.46 PM.png | |
| Oct 16 2019, 5:10 PM |
| F30580680: Screen Shot 2019-10-07 at 8.56.54 AM.png | |
| Oct 7 2019, 1:00 PM |
| F30580679: Screen Shot 2019-10-07 at 8.57.24 AM.png | |
| Oct 7 2019, 1:00 PM |
| F30543798: Screen Shot 2019-10-04 at 12.17.00 PM.png | |
| Oct 4 2019, 4:21 PM |
| F30382168: Screen Shot 2019-09-17 at 4.45.25 PM.png | |
| Sep 17 2019, 10:35 PM |
| F30381525: Screenshot 2019-09-17 at 11.04.23 AM.png | |
| Sep 17 2019, 6:12 PM |
| F30381108: T229440-8.png | |
| Sep 17 2019, 6:12 PM |
| F30381461: image.png | |
| Sep 17 2019, 5:35 PM |
The vertical alignment issue impacts the BlockMessageDrawer:
Search within pages is also flushed incorrectly:
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | ovasileva | T226562 AMC - display labels for toolbar actions on larger screens | |||
| Resolved | • alexhollender_WMF | T229440 [EPIC] Refactor icon sizing in MF/Minerva to achieve consistency | |||
| Resolved | ovasileva | T232837 Use mw-ui-icon-flush- classes on various icons to fix alignment: search within pages and block drawer icons |
Change 536594 had a related patch set uploaded (by Jdrewniak; owner: Jdrewniak):
[mediawiki/skins/MinervaNeue@master] [ICONS] Fix icon positions in page-issues, inline and overlay
Code review for https://gerrit.wikimedia.org/r/#/c/mediawiki/skins/MinervaNeue/+/536380/:
Change 536594 merged by jenkins-bot:
[mediawiki/skins/MinervaNeue@master] [ICONS] Fix icon positions in page-issues, inline and overlay
On Slack we discussed the need for a flush-top class to fix this, which also seems to be the issue with the reference drawer alignment
Change 537500 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Fix alignment of block drawer stop icon (mw-ui-icon-flush)
Change 537529 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/skins/MinervaNeue@master] Add the mw-ui-icon-flush-top class
Change 537500 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Fix alignment of block drawer stop icon (mw-ui-icon-flush)
Change 537726 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Flush search-content icon to left so it matches search input
The page issues one is a little tricker - as page issues has a line height of 1.65 so I can't see a way to adjust this icon's position without an arbitrary non-variable based value. Pausing working on this until the other icons are taken care of.
Change 537726 merged by Jdlrobson:
[mediawiki/extensions/MobileFrontend@master] Flush search-content icon to left so it matches search input
Change 537529 merged by Jdlrobson:
[mediawiki/skins/MinervaNeue@master] Add the mw-ui-icon-flush-top class
Change 538710 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/skins/MinervaNeue@master] Vertically align the page issues icon with the text
There is no non-hacky way to do this because we are wrestling with template inline styles that we do not control. I suggest we fix T230033 and then hardcode the top value here as before.
I've split out the page issues problem into T234254 as the scope has grown here. The other two issues with BlockDrawer and search within pages can be QAed/design reviewed and signed off.
Search within page alignment is fixed:
@Jdlrobson can you post a screenshot of the block drawer? Not sure how to trigger that on Beta.
@alexhollender all UI elements are documented on storybook
https://doc.wikimedia.org/MobileFrontend/master/js/ui/?path=/story/drawer--blockmessagedrawer
This is the best and easiest way to check UI that's rarely seen.
@Jdlrobson even with flush-top the block hand icon is still too low. Since this UI is infrequently seen I don't think it's worth more work here and would be fine moving forward as-is.
| current | correct |
 |  |
Change 541570 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Heading line height should match icon height
Change 541570 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Heading line height should match icon height
