[admin-reskin] Alignment issue in the upload plugin button

[audrasjb]

I spotted an alignment issue that occurs on trunk.
It is especially visible on fr_FR locale (see screenshots below).

I'm moving this ticket to 7.0, to see if we can fix it before beta 4.

[audrasjb]

Alignment issue on en_US

[audrasjb]

Alignment issue on fr_FR

Fix the Upload Plugin/theme upload layout alignment

Wrap file input and Install Now in wp-upload-form-box; style as flex row so the button stays in the same grey box (fixes fr_FR and
avoids absolute positioning with top: auto, dropping the submit below). Update themes.css and themes-rtl.css; stack on narrow viewports.

Trac ticket: https://core.trac.wordpress.org/ticket/64832

Before:

After:

[joedolson]

See also #64065.

@joedolson, please let me know if any changes are needed in this PR.

@PANawkar Unfortunately, it doesn't seem to me that these changes have solved anything. The drop area is still only the small file input. The goal of the prior change was to make the file input cover the entire form space, so that the drop area is easier to hit; but this doesn't do that.

I'll look at it and see if there are other options.

This is an alternate approach to ​https://github.com/WordPress/wordpress-develop/pull/11216 by @PANawkar

While it reduces the dropzone from the original commit, it still maintains a significantly larger and easier dropzone than existed previously.

Another alternative would be to simply give the button a non-transparent background, so that it covered the file upload hint. That's already truncated, so covering part of it is not necessarily a significant loss; the big problem right now is that with a transparent background, the text overlaps and becomes difficult to read.

Trac ticket:https://core.trac.wordpress.org/ticket/64832

## Use of AI Tools

None

[huzaifaalmesbah]

Patch Testing Report

Patch Tested: ​https://github.com/WordPress/wordpress-develop/pull/11241

Environment

• WordPress: 7.0-beta5-61991-src
• PHP: 8.3.30
• Server: nginx/1.29.6
• Database: mysqli (Server: 8.4.8 / Client: mysqlnd 8.3.30)
• Browser: Chrome 146.0.0.0
• OS: macOS
• Theme: Twenty Twenty-Five 1.4
• MU Plugins: None activated
• Plugins:

• Test Reports 1.2.1

Steps taken

1. Installed a fresh WordPress trunk environment (7.0-beta5-61991-src).
2. Navigated to Settings → General → Site Language.
3. Selected Français (fr_FR) from the language dropdown and saved the changes.
4. Navigated to Dashboard → Plugins → Add New → Upload Plugin.
5. Observed the layout before applying the patch — the Install Now button overlapped with the upload hint text and alignment appeared broken.
6. Applied the patch from PR.
7. Ran the build command to compile the updated assets: npm run build:dev
8. Reloaded the Upload Plugin screen.
9. Verified the alignment and layout of the file upload field and Install Now button.
10. ✅ Patch is solving the problem

Expected result

• The Upload Plugin form elements should be properly aligned inside the upload box.
• The Install Now button should not overlap with the upload instruction text.
• The interface should remain readable and consistent even when longer localized strings (such as French) are used.

Additional Notes

• Before applying the patch, the Install Now button had a transparent background which caused overlapping with the upload hint text, especially visible in the fr_FR locale.
• After applying the patch and rebuilding assets with npm run build:dev, the button layout and background prevent overlapping text and improve readability.
• The upload interface now appears consistent and properly aligned.

Screenshots/Screencast with results

Before Apply Patch	After Apply Patch ✅

[audrasjb]

#64885 was marked as a duplicate.

[noruzzaman]

Test Report

Patch tested: ​https://github.com/WordPress/wordpress-develop/pull/11241

Environment

• WordPress: 7.0-beta5-20260316.045922
• PHP: 7.4.33
• Server: PHP.wasm
• Database: WP_SQLite_Driver (Server: 8.0.38 / Client: 3.51.0)
• Browser: Chrome 146.0.0.0
• OS: Windows 10/11
• Theme: Twenty Twenty-Five 1.4
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.1

Actual Results

1. ✅ Issue resolved with patch.

Before	After

[joedolson]

In 62090:

Administration: Fix alignment in upload plugin/theme buttons.

Following [61598], the upload button for plugins and themes could cover the file information in the file input for longer internationalized strings due to absolute positioning.

Update layout to use remove absolute positioning while retaining the larger drop area.

Props audrasjb, pratiknawkar94, huzaifaalmesbah, noruzzaman, presskopp, joedolson.
Fixes #64832.