Make WordPress Core

Opened 2 months ago

Closed 8 weeks ago

#64337 closed defect (bug) (fixed)

Broken styling on "Add Plugins" screen

Reported by: tobiasbg's profile TobiasBg Owned by: westonruter's profile westonruter
Milestone: 6.9.1 Priority: normal
Severity: normal Version: 6.9
Component: Plugins Keywords: has-patch has-test-info fixed-major dev-reviewed
Focuses: ui, administration Cc:

Description

A fresh install of WP 6.9 has broken styling on the "Add Plugins" screen (/wp-admin/plugin-install.php).

There is no spacing between the tabs bar (Featured/Popular/Recommended/Favorites) and the plugin cards anymore.

See attached screenshot.

Attachments (2)

add-plugins-missing-spacing.png (152.0 KB) - added by TobiasBg 2 months ago.
Add-Plugins-—-WordPress.png (246.4 KB) - added by sajib1223 2 months ago.
After adding a 1rem bottom margin to the .wp-filter element

Download all attachments as: .zip

Change History (13)

This ticket was mentioned in PR #10586 on WordPress/wordpress-develop by @sajib1223.


2 months ago
#1

  • Keywords has-patch added; needs-patch removed

Set the plugins tab bottom margin to 1rem, matching the old description margin.

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

@sajib1223
2 months ago

After adding a 1rem bottom margin to the .wp-filter element

#2 @sabernhardt
2 months ago

  • Component changed from Administration to Plugins
  • Focuses administration added

If the bottom margin is added to .wp-filter, the .table-nav.top page navigation probably should not have the 5 pixels of top padding when visiting the 'Popular' tab (and possibly other tabs).

[60528] added a line break to fix the lack of space on the Features tab, which worked in development when 'Beta testing' was the first tab. Now 'Features' is usually the first tab, and the featured plugins display—without the space—when the URL does not include a tab parameter.

For another option, I think the <br /> could work earlier, instead of using $_GET['tab']:

case 'install_plugins_featured':
	echo '<br />';
	break;

@mukesh27 commented on PR #10587:


2 months ago
#4

After PR:

https://github.com/user-attachments/assets/9a4b7889-cdca-4aff-bbe9-04c89512c346

@mukesh27 commented on PR #10587:


2 months ago
#5

I agree with @sabernhardt’s comment here https://core.trac.wordpress.org/ticket/64337#comment:2, and it would be better to add a generic solution instead of adding additional CSS.

#6 @narenin
2 months ago

  • Keywords has-test-info added

Test Report

I have tested latest patch and it is working as expected. https://github.com/WordPress/wordpress-develop/pull/10587

Environment

WordPress: 6.9
PHP: 8.1.23
Server: nginx/1.16.0
Database: mysqli (Server: 8.0.16 / Client: mysqlnd 8.1.23)
Browser: Chrome 126.0.0.0 (macOS)
Theme: Twenty TwentyVersion: 2.7

Expected Results

The spacing issue between the tabs bar (Featured/Popular/Recommended/Favorites) and the plugin cards has been fixed.

Version 0, edited 2 months ago by narenin (next)

#7 @westonruter
2 months ago

  • Owner set to westonruter
  • Status changed from new to reviewing

#8 @westonruter
2 months ago

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

In 61353:

Plugins: Restore line break between the filter links row and the plugin cards in the Featured view.

Follow-up to [60528].

Props mukesh27, sajib1223, TobiasBg, narenin, sabernhardt, westonruter.
See #63723.
Fixes #64337.

#9 @westonruter
2 months ago

  • Keywords fixed-major added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Re-opening for 6.9.1 backport consideration.

#10 @wildworks
2 months ago

  • Keywords dev-reviewed added

Re-opening for 6.9.1 backport consideration.

Approved ✅

#11 @peterwilsoncc
8 weeks ago

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

In 61382:

Plugins: Restore line break between the filter links row and the plugin cards in the Featured view.

Follow-up to [60528].

Reviewed by wildworks.
Merges [61353] to the 6.9 branch.

Props mukesh27, sajib1223, TobiasBg, narenin, sabernhardt, westonruter.
See #63723.
Fixes #64337.

Note: See TracTickets for help on using tickets.