[wp-trac] [WordPress Trac] #30154: Improve Media Modal UI at small-screen sizes: Redux

[WordPress Trac]

#30154: Improve Media Modal UI at small-screen sizes: Redux
----------------------------+-----------------------------
 Reporter:  mor10           |      Owner:
     Type:  defect (bug)    |     Status:  new
 Priority:  normal          |  Milestone:  Awaiting Review
Component:  Media           |    Version:  trunk
 Severity:  normal          |   Keywords:
  Focuses:  ui, javascript  |
----------------------------+-----------------------------
 Whereas various issues were resolved in #27423, the Image Flow group
 proposes a realignment of the approach regarding the Media Modal UI, and
 in particular the Edit Image modal on small screen sizes.

 The following relates to current behaviour in 4.1-alpha-30080 as it
 appears in the flow on small screens (tested on vertical Nexus 4 and
 iPhone 5):

 The Edit Image modal is by and large not functional on small screens. The
 crop function does not work and the remaining buttons (rotate, flip, etc)
 as well as the preview image are largely covered by the right-hand tool
 panel.

 Considering the current work being done on Image Flow and the fact that
 the cropping will not work in mobile our proposal is to make the Edit
 Image function unavailable on smaller screens by hiding the link / button
 that takes the user to the modal. The guiding philosophy here is that we
 provide only tools that can actually be used to the user. Since editing
 for all practical purposes is non-functional it is disabled when
 appropriate.

 Alternatively the design pattern from the Image Details modal can be
 carried over: Leave the button row and image preview at the top (image
 scaled to fit available screen space, crop button removed) and move the
 right-hand panel down below.

 In relation to other issues referenced in #27423 on single-image selection
 from the library:

 - On selecting an image to add the metadata panel slides in from the
 right. Once the panel is visible it cannot be collapsed making the images
 on right hand column unavailable.
 - When closing and re-opening the modal the pane remains extended.
 - To regain access to the full grid the post must be closed and reopened.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/30154>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform