WordPress.org

Make WordPress Core

Opened 7 months ago

Closed 6 months ago

Last modified 6 months ago

#49914 closed defect (bug) (fixed)

Plugin and Theme upload form input button alignment

Reported by: seedsca Owned by: SergeyBiryukov
Milestone: 5.5 Priority: normal
Severity: normal Version: 5.5
Component: Themes Keywords:
Focuses: ui, css, administration Cc:

Description

When installing new plugin/theme from file, the file upload form has it's input button misaligned. Seems it should be aligned with the install now button.

Verified with multiple browsers.

Attachments (13)

chrome - before.png (14.4 KB) - added by seedsca 7 months ago.
edge - before.png (3.8 KB) - added by seedsca 7 months ago.
firefox - before.png (13.2 KB) - added by seedsca 7 months ago.
firefox - before.2.png (13.2 KB) - added by seedsca 7 months ago.
ie11 - before.png (3.9 KB) - added by seedsca 7 months ago.
safari - before.png (8.7 KB) - added by seedsca 7 months ago.
49914.diff (721 bytes) - added by seedsca 7 months ago.
Looks like editing /wp-admin/css/themes.css to add justify-content: space-between; and removing some padding did the trick.
chrome -after.png (14.9 KB) - added by seedsca 7 months ago.
edge - after.png (3.8 KB) - added by seedsca 7 months ago.
firefox - after.png (13.6 KB) - added by seedsca 7 months ago.
ie11 - after.png (3.9 KB) - added by seedsca 7 months ago.
safari - after.png (8.9 KB) - added by seedsca 7 months ago.
chrome -after.2.png (14.9 KB) - added by piyushmca 6 months ago.
Please Check

Download all attachments as: .zip

Change History (17)

@seedsca
7 months ago

Looks like editing /wp-admin/css/themes.css to add justify-content: space-between; and removing some padding did the trick.

@seedsca
7 months ago

@seedsca
7 months ago

#1 @SergeyBiryukov
7 months ago

  • Component changed from General to Themes
  • Milestone changed from Awaiting Review to 5.5
  • Owner set to SergeyBiryukov
  • Status changed from new to reviewing

@piyushmca
6 months ago

Please Check

#2 @seedsca
6 months ago

Good point @piyushmca, both Chrome and Safari seem to add some padding to their buttons on the bottom. I see no way to make this work universally. But my patch gets most of the browsers nearly there.Since if you look, the only browser currently having it's button aligned is Safari. All of the rest are off.

#3 @SergeyBiryukov
6 months ago

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

In 47599:

Upload: Better align file input and buttons in plugin/theme upload form.

Follow-up to [47271].

Props seedsca, piyushmca.
Fixes #49914.

#4 @afercia
6 months ago

In 47750:

Upload: Improve file input and button alignment in plugin/theme upload form.

Resets flexbox on smaller screens. Improves vertical alignment on large screens.
Follow-up to [47599] and [47271].

Props mukesh27, DarkoG.
See #48859, #49914.
Fixes #49951.

Note: See TracTickets for help on using tickets.