On WP 5.8-beta4-51243 Site Health Status screen elements cannot be collapsed!

[alanjacobmathew]

v 5.8 beta4 Theme: Twenty Twenty One. Fresh install. No plugins

The Site Health Status screen elements cannot be minimized in the latest version.

Steps to reproduce:

1: Dashboard -> Home
2: click on site health status element collapse button

[desrosj]

Thanks @alanjacobmathew, moving to investigate.

[Clorith]

Appears this is caused by the new grid-style layout of the Site Health widget content, the CSS rule for #dashboard_site_health .inside is more specific than the .js .closed .inside (id takes priority over classes).

A specific rule for the Site Health CSS will probably need to be made here to account for #dashboard_site_health.closed .inside to apply the display: none here as well.

[sabernhardt]

Yes, the grid layout competes with display: none and wins.

Another option is editing the two selectors that specify grid layout to
#dashboard_site_health:not(.closed) .inside

Create a wrapper around site health widget content that handles the css grid.

This fixes a problem with open/closing the widget because .inside is used to close the widget, but the site health css overwrote the css used to hide it.

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

[Clorith]

In 51247:

Site Health: Add a unique wrapper for dashboard widget content.

This wraps the inner-content of the Site Health dashboard widget to give a unique target for CSS selectors, restoring the ability to collapse the widget.

The initial implementation targeted the .inside class used by all widgets to apply styling to the widget content, but this prevented the widget from being collapsed, as it added grid-styles which other widgets do not use, overriding the usual behavior when toggling widget visibility.

Follow-up to [50833].

Props alanjacobmathew, walbo.
Fixes #53521.

Merged in [51247].