Changeset 59859

Timestamp:

02/22/2025 12:10:50 PM (18 months ago)

Author:

audrasjb

Message:

Site Health: Improve HTML semantics for tables used in Site Health debug tab.

This changeset removes the presentation role from the Site Health debug tab tables to switch them into regular data tables, and updates the related stylesheet to keep the previously used styles.

Props audrasjb, hbhalodia, rvouill, mukesh27, sabernhardt, joedolson, alexstine.
Fixes #62880.

Location:

trunk/src/wp-admin

Files:

• css/site-health.css (modified) (3 diffs)
• site-health-info.php (modified) (2 diffs)

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

@@ -167 +167 @@
 }
 
+.widefat.health-check-table th {
+        font-size: 13px;
+}
+
 .health-check-table td:first-child {
         width: 30%;
@@ -338 +342 @@
         }
 
+        .health-check-table th,
         .health-check-table td {
                 box-sizing: border-box;
@@ -345 +350 @@
         }
 
+        .widefat.health-check-table th,
         .health-check-table td:first-child {
                 width: 100%;

trunk/src/wp-admin/site-health-info.php

@@ -109 +109 @@
 
                                 ?>
-                                <table class="widefat striped health-check-table" role="presentation">
+                                <table class="widefat striped health-check-table">
                                         <tbody>
                                         <?php
@@ -127 +127 @@
 
                                                 if ( in_array( $field_name, $sizes_fields, true ) ) {
-                                                        printf( '<tr><td>%s</td><td class="%s">%s</td></tr>', esc_html( $field['label'] ), esc_attr( $field_name ), $values );
+                                                        printf( '<tr><th scope="row">%s</th><td class="%s">%s</td></tr>', esc_html( $field['label'] ), esc_attr( $field_name ), $values );
                                                 } else {
-                                                        printf( '<tr><td>%s</td><td>%s</td></tr>', esc_html( $field['label'] ), $values );
+                                                        printf( '<tr><th scope="row">%s</th><td>%s</td></tr>', esc_html( $field['label'] ), $values );
                                                 }
                                         }