WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

#34556 closed defect (bug) (fixed)

Visual issues with form fields in edit attachment modal

Reported by: tyxla Owned by: obenland
Milestone: 4.4 Priority: normal
Severity: normal Version:
Component: Media Keywords: has-patch has-screenshots
Focuses: ui, administration Cc:

Description

There is a minor issue with the form fields in the edit attachment modal - their box-sizing is content-box (as inherited from .media-modal *), which makes them look awkward in some locations.

Steps to reproduce:

  1. Go to Media
  2. Click on an image attachment.
  3. In the popup, below the image, click on the "Edit Image" button.
  4. Take a look at all of the fields - they are larger than they should be (compared to the other media modals).

The issue can be observed best with the Apply changes to: radio buttons, where the checked circle is not in the middle, but a little off to the top & left.

As a solution we have to make sure that the box-sizing of the edit attachment modal input, select, media is border-box instead of content-box. This will fix the issue on both desktop and mobile devices.

Attachments (3)

34556.patch (513 bytes) - added by tyxla 3 years ago.
Fix the box-sizing of the input, textarea and select fields in the edit attachment frame.
34556-before-after.jpg (92.4 KB) - added by tyxla 3 years ago.
Screenshot of the issue - before & after the patch
34556.2.patch (607 bytes) - added by obenland 3 years ago.

Download all attachments as: .zip

Change History (9)

@tyxla
3 years ago

Fix the box-sizing of the input, textarea and select fields in the edit attachment frame.

@tyxla
3 years ago

Screenshot of the issue - before & after the patch

#1 @tyxla
3 years ago

  • Keywords has-patch has-screenshots added

#2 @kalina_dimitrova89
3 years ago

+1. I think this one should be included in 4.4. The current radio buttons (and checkboxes - if any) look awkward.

#3 @obenland
3 years ago

  • Milestone changed from Awaiting Review to 4.4
  • Owner set to obenland
  • Status changed from new to accepted
  • Version trunk deleted

@obenland
3 years ago

#4 @obenland
3 years ago

It looks like [29727] tried to fix that before. Not sure whether it broke again or if it was an oversight in the previous fix.

This ticket was mentioned in Slack in #core by obenland. View the logs.


3 years ago

#6 @obenland
3 years ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 35699:

Media: Reset box-sizing for input elements in the entire media modal.

See [29727].

Props tyxla for initial patch.
Fixes #34556.

Note: See TracTickets for help on using tickets.