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

[chetan200891]

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

[chetan200891]

'Passed tests' button mobile view.

[chetan200891]

Created patch to add line-height for small devices.

[chetan200891]

Screenshot after applying patch.

[melchoyce]

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

[chetan200891]

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

[melchoyce]

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]

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

[afercia]

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.

[SergeyBiryukov]

See #46949 for the accordion styles.

[afercia]

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

[afercia]

In 45217:

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

Props chetan200891.
Fixes #46939.