Page MenuHomePhabricator

Blockers for deploying mobile print styles
Closed, ResolvedPublic3 Estimate Story Points

Description

All issues can be seen when attempting to print the Edward Norton article

  • Hide .hatnote
  • Correct H2 vertical paddings
  • Images should be left aligned
  • Table and infoboxes are not behaving to spec (possibly related to media queries for tablet/desktop applying to print mode)
  • Optimise page paddings for A4/Letter
  • The print styles if possible should be limited to mobile devices using
@media print and (print and (max-device-width: 720px))

ie. if you print the page on a mobile device you should see the new styles but if you print on a desktop/tablet you shouldn't.

https://zpl.io/Z21SJUD

Details

Related Gerrit Patches:
mediawiki/extensions/MobileFrontend : masterUpdates to print styles

Event Timeline

Jdlrobson moved this task from Incoming to Upcoming on the Readers-Web-Backlog board.
MBinder_WMF set the point value for this task to 3.Apr 25 2017, 4:17 PM
ovasileva raised the priority of this task from Medium to High.May 4 2017, 5:40 PM

Change 353051 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Updates to print styles

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

Optimise page paddings for A4/Letter

I need help with this. The mocks are inconsistent. It seems the vertical margin needs to change but I'm not sure what to. I'm seeing 50px horizontal margins and 60-63px vertically. Please can you give me dimensions?

@Nirzar all other changes are live on reading web staging. Can you let me know if any adjustments are needed?

I've left some comments regarding code.

@Jdlrobson the padding seems still broken.

here's a simple view of looking at paddings


This is desired padding . 50px bleed around the edge. no matter what paper size. for all paper size. the bleed should be 50px. if that is not possible, we can do this bleed for A4 or letter and let printer software adapt to other sizes.

@Nirzar I've removed the size:legal rule and updated staging again and this is what I see when I print on Android:



Can you give me the design thumbs up?

Change 353051 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Updates to print styles

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

ovasileva closed this task as Resolved.May 15 2017, 9:28 AM

look good from over here!