[wp-trac] [WordPress Trac] #60141: Proximity of controls: Upload New Media multi-file uploader

[WordPress Trac]

#60141: Proximity of controls: Upload New Media multi-file uploader
---------------------------+-----------------------------
 Reporter:  afercia        |      Owner:  (none)
     Type:  defect (bug)   |     Status:  new
 Priority:  normal         |  Milestone:  Awaiting Review
Component:  Media          |    Version:
 Severity:  normal         |   Keywords:  has-screenshots
  Focuses:  accessibility  |
---------------------------+-----------------------------
 See #40822
 See #51754

 When uploading media files in the Upload New Media > multi-file uploader
 page, newly added files are listed within rows after the uploader.

 The rows contain:
 - The attachment details, on the left.
 - Additional tools, on the right.

 There's a couple problems with that.

 == Proximity of controls
 The tools are displayed too far to the right, way far from the details.
 This is a problem, for example, for low vision users and users who use
 screen magnifiers, as the tools may be out of their vision field.
 Controls should be displayed visually grouped so that they can be easily
 discovered by all users. I'm not sure there's a good reason to have all
 that spacing between details and tools in the first place.

 == The Copy button shifts to the left when copying
 There's a few Copy buttons in use in the admin pages. Most of them are
 aligned to the left and there's a good reason for that: The UI must
 provide space for the 'Copied!' confirmation text.
 However, on this page the Copy button is aligned to the right. After a
 copy operation, the 'Copied!' text appears on the right of the button thus
 making the button itself shift to the left. I'm not sure having moving
 interactive controls on the screen is a good user experience. Instead, the
 Copy button should be placed in a way to reserve some space for the
 'Copied!' text to appear without triggering a shift of other content.

 See screenshots and animated GIF below.

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