Special:AllMessages: Improve zebra striping on hover

Previously, the full row (spanning two sub-rows) would not
get the hover effect when hovering over the second sub-row.

Inspired by <https://stackoverflow.com/a/15465002>.

Change-Id: Id698516da4fbe01f90cbe1499fb81721642a4dfd

diff --git a/includes/specials/pagers/AllMessagesTablePager.php b/includes/specials/pagers/AllMessagesTablePager.php
index 18c1d70..8363e56 100644 (file)
--- a/includes/specials/pagers/AllMessagesTablePager.php
+++ b/includes/specials/pagers/AllMessagesTablePager.php
@@ -295,7 +295,11 @@ class AllMessagesTablePager extends TablePager {
                                <th>" .
                $this->msg( 'allmessagescurrent' )->escaped() .
                "</th>
-                       </tr></thead><tbody>\n";
+                       </tr></thead>\n";
+       }
+
+       function getEndBody() {
+               return Html::closeElement( 'table' );
        }
 
        function formatValue( $field, $value ) {
@@ -352,18 +356,18 @@ class AllMessagesTablePager extends TablePager {
 
                // But if there's a customised message, add that too.
                if ( $row->am_customised ) {
-                       $s .= Xml::openElement( 'tr', $this->getRowAttrs( $row, true ) );
+                       $s .= Html::openElement( 'tr', $this->getRowAttrs( $row, true ) );
                        $formatted = strval( $this->formatValue( 'am_actual', $row->am_actual ) );
 
                        if ( $formatted === '' ) {
                                $formatted = "\u{00A0}";
                        }
 
-                       $s .= Xml::tags( 'td', $this->getCellAttrs( 'am_actual', $row->am_actual ), $formatted )
-                               . "</tr>\n";
+                       $s .= Html::element( 'td', $this->getCellAttrs( 'am_actual', $row->am_actual ), $formatted )
+                               . Html::closeElement( 'tr' );
                }
 
-               return $s;
+               return Html::rawElement( 'tbody', [], $s );
        }
 
        function getRowAttrs( $row ) {

diff --git a/resources/src/mediawiki.special/special.css b/resources/src/mediawiki.special/special.css
index cb05793..cb996f3 100644 (file)
--- a/resources/src/mediawiki.special/special.css
+++ b/resources/src/mediawiki.special/special.css
@@ -1,9 +1,16 @@
 /* Special:AllMessages */
+#mw-allmessagestable tbody:hover td {
+       /* Duplicate of `.mw-datatable tr:hover td` from shared.css,
+        * so that it also applies when hovering a lower cell
+        * within the same rowspan */
+       background-color: #eaf3ff;
+}
+
 #mw-allmessagestable .am_default {
        background-color: #fcffc4;
 }
 
-#mw-allmessagestable tr:hover .am_default {
+#mw-allmessagestable tbody:hover .am_default {
        background-color: #faff90;
 }
 
@@ -11,7 +18,7 @@
        background-color: #e2ffe2;
 }
 
-#mw-allmessagestable tr:hover + tr .am_actual {
+#mw-allmessagestable tbody:hover .am_actual {
        background-color: #b1ffb1;
 }