Site Health: Improve vertical alignment of icons in test result descr…

…iptions.

This change removes redundant CSS properties for different health check statuses in favor of utilizing the `.dashicons` class already in Core to define them more consistently. This also fixes the vertical alignment issues.

Merges [45309] to the 5.2 branch.

Props chetan200891, Clorith, desrosj.
Fixes #46940.

git-svn-id: https://develop.svn.wordpress.org/branches/5.2@45314 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-admin/css/site-health.css

@@ -153,32 +153,23 @@
 .health-check-body .pass::before,
 .health-check-body .good::before {
 	content: "\f147";
-	display: inline-block;
 	color: #46b450;
-	font-family: dashicons;
-	vertical-align: top;
 }
 
 .health-check-body .warning::before {
 	content: "\f460";
-	display: inline-block;
 	color: #ffb900;
-	font-family: dashicons;
 }
 
 .health-check-body .info::before {
 	content: "\f348";
-	display: inline-block;
 	color: #00a0d2;
-	font-family: dashicons;
 }
 
 .health-check-body .fail::before,
 .health-check-body .error::before {
 	content: "\f335";
-	display: inline-block;
 	color: #dc3232;
-	font-family: dashicons;
 }
 
 .site-health-copy-buttons {

src/wp-admin/includes/class-wp-site-health.php

@@ -889,7 +889,7 @@ public function get_test_php_extensions() {
 					$result['status'] = 'recommended';
 				}
 
-				$failures[ $library ] = "<span class='$class'><span class='screen-reader-text'>$screen_reader</span></span> $message";
+				$failures[ $library ] = "<span class='dashicons $class'><span class='screen-reader-text'>$screen_reader</span></span> $message";
 			}
 		}
 
@@ -1487,7 +1487,7 @@ public function get_test_background_updates() {
 			}
 
 			$output .= sprintf(
-				'<li><span class="%s"><span class="screen-reader-text">%s</span></span> %s</li>',
+				'<li><span class="dashicons %s"><span class="screen-reader-text">%s</span></span> %s</li>',
 				esc_attr( $test->severity ),
 				$severity_string,
 				$test->description