Make WordPress Core

Opened 4 years ago

Closed 4 years ago

Last modified 4 years ago

#49914 closed defect (bug) (fixed)

Plugin and Theme upload form input button alignment

Reported by: seedsca's profile seedsca Owned by: sergeybiryukov's profile 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 4 years ago.
edge - before.png (3.8 KB) - added by seedsca 4 years ago.
firefox - before.png (13.2 KB) - added by seedsca 4 years ago.
firefox - before.2.png (13.2 KB) - added by seedsca 4 years ago.
ie11 - before.png (3.9 KB) - added by seedsca 4 years ago.
safari - before.png (8.7 KB) - added by seedsca 4 years ago.
49914.diff (721 bytes) - added by seedsca 4 years 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 4 years ago.
edge - after.png (3.8 KB) - added by seedsca 4 years ago.
firefox - after.png (13.6 KB) - added by seedsca 4 years ago.
ie11 - after.png (3.9 KB) - added by seedsca 4 years ago.
safari - after.png (8.9 KB) - added by seedsca 4 years ago.
chrome -after.2.png (14.9 KB) - added by piyushmca 4 years ago.
Please Check

Download all attachments as: .zip

Change History (17)

@seedsca
4 years ago

@seedsca
4 years ago

@seedsca
4 years ago

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

@seedsca
4 years ago

@seedsca
4 years ago

@seedsca
4 years ago

#1 @SergeyBiryukov
4 years 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
4 years ago

Please Check

#2 @seedsca
4 years 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
4 years 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
4 years 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.