[wp-trac] [WordPress Trac] #30618: Media in the Customizer design bugs

[WordPress Trac]

#30618: Media in the Customizer design bugs
------------------------------+-----------------------------
 Reporter:  celloexpressions  |      Owner:
     Type:  defect (bug)      |     Status:  new
 Priority:  normal            |  Milestone:  Awaiting Review
Component:  Customize         |    Version:  trunk
 Severity:  normal            |   Keywords:  needs-patch
  Focuses:  ui                |
------------------------------+-----------------------------
 Following up on #21483, the new media controls in 4.1 should have
 introduced an improved UI rather than being based on the headers design,
 which is a completely different codebase that should eventually leverage
 the new controls, and has several UI problems. Let's fix that.

 Specifically:
 - Why do we need four directly nested wrapper divs around the attachment
 preview? That looks like legacy code that shouldn't have been copied into
 a new feature and we should remove it.
 - Can we please drop the extra border, and the border radius around
 attachment preview? Why add extra UI clutter when there's already a clear
 separation of items?
 - The change/select button should have different visual hierarchy than the
 default/remove button. I would suggest link/button instead of
 button/button.
 - Image previews should not have a border radius applied. It also applies
 to the filetype icons in the preview, which those icons were not designed
 for.
 - There should be no `min-height` set on media items that aren't headers -
 combined with the border this looks super unpolished, and there's no
 reason to have a minimum height here since the actual image is not part of
 the UI.

 Relevant code is in `wp-includes/class-wp-customize-control.php:733` for
 the structure and `wp-admin/css/customize-controls.css` for the css.

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