WordPress.org

Make WordPress Core

Opened 6 months ago

Closed 6 months ago

#46939 closed defect (bug) (fixed)

Site Health: Passed tests button does not look good in small devices

Reported by: chetan200891 Owned by: afercia
Milestone: 5.2 Priority: normal
Severity: normal Version: 5.2
Component: Administration Keywords: has-screenshots
Focuses: ui, administration Cc:
PR Number:

Description

On Site Health Status page 'Passed tests' button does not look in small devices due to line-height CSS. I have attached screenshot.

Attachments (5)

passed-tests-button.png (55.4 KB) - added by chetan200891 6 months ago.
'Passed tests' button mobile view.
46939.diff (438 bytes) - added by chetan200891 6 months ago.
Created patch to add line-height for small devices.
passed-tests-button-patch.png (55.1 KB) - added by chetan200891 6 months ago.
Screenshot after applying patch.
46939.1.diff (509 bytes) - added by chetan200891 6 months ago.
Updated patch to fix spacing between accordion title and badge for small devices.
46939.2.diff (659 bytes) - added by afercia 6 months ago.

Download all attachments as: .zip

Change History (13)

@chetan200891
6 months ago

'Passed tests' button mobile view.

@chetan200891
6 months ago

Created patch to add line-height for small devices.

@chetan200891
6 months ago

Screenshot after applying patch.

#1 @melchoyce
6 months ago

Good catch. We'll need another ticket for fixing the accordion styles, too.

#2 @chetan200891
6 months ago

@melchoyce Thank you! Is that ticket created? I am preparing patch for it too! or Do I need to create new?

#3 @melchoyce
6 months ago

Not yet. Though we could probably widen the scope of this ticket to mobile style fixes in general, and you could add the patch here.

@chetan200891
6 months ago

Updated patch to fix spacing between accordion title and badge for small devices.

@afercia
6 months ago

#4 @afercia
6 months ago

  • Milestone changed from Awaiting Review to 5.2
  • Version set to trunk

Oh yes the button issue was my mistake in [45201]. Instead of using line-height we should just not reset the top and bottom padding to 0: the .button CSS class already takes care of the buttons size for small screens.

I guess the accordion styles will need some more adjustments.

#5 @SergeyBiryukov
6 months ago

  • Component changed from General to Administration

#6 @SergeyBiryukov
6 months ago

See #46949 for the accordion styles.

#7 @afercia
6 months ago

Let's fix only the button in this ticket. #46949 has some more ongoing feedback for the accordion styles.

#8 @afercia
6 months ago

  • Owner set to afercia
  • Resolution set to fixed
  • Status changed from new to closed

In 45217:

Administration: Improve the Site Health "Passed tests" button style for small screens.

Props chetan200891.
Fixes #46939.

Note: See TracTickets for help on using tickets.