From 5c8ba9ebf4d9864a412ea5cea9a2105b0d126ef9 Mon Sep 17 00:00:00 2001
From: Volker E <volker.e@wikimedia.org>
Date: Fri, 18 Jan 2019 18:24:21 -0800
Subject: [PATCH] Replace sorting classes with better naming convention

Improving CSS structure by removing code duplications.

Bug: T214218
Change-Id: I0501e1ab934aef3af289fee618b99578a1f0285c
---
 includes/pager/TablePager.php                 |  4 ++--
 .../TablePager.less                           | 22 +++++++++++--------
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/includes/pager/TablePager.php b/includes/pager/TablePager.php
index 8934fc2b79..fa0f4f543d 100644
--- a/includes/pager/TablePager.php
+++ b/includes/pager/TablePager.php
@@ -130,12 +130,12 @@ abstract class TablePager extends IndexPager {
 					// We don't actually know in which direction other fields will be sorted by default…
 					if ( $this->mDefaultDirection == IndexPager::DIR_DESCENDING ) {
 						$linkType = 'asc';
-						$class = "$sortClass TablePager_sort-descending";
+						$class = "$sortClass mw-datatable-is-sorted mw-datatable-is-descending";
 						$query['asc'] = '1';
 						$query['desc'] = '';
 					} else {
 						$linkType = 'desc';
-						$class = "$sortClass TablePager_sort-ascending";
+						$class = "$sortClass mw-datatable-is-sorted mw-datatable-is-ascending";
 						$query['asc'] = '';
 						$query['desc'] = '1';
 					}
diff --git a/resources/src/mediawiki.pager.tablePager/TablePager.less b/resources/src/mediawiki.pager.tablePager/TablePager.less
index bea197a2f9..f9dd642a00 100644
--- a/resources/src/mediawiki.pager.tablePager/TablePager.less
+++ b/resources/src/mediawiki.pager.tablePager/TablePager.less
@@ -9,16 +9,20 @@
 	min-width: 80%;
 }
 
-.TablePager .TablePager_sort-ascending a {
-	padding-left: 15px;
-	background: none left center no-repeat;
-	.background-image-svg('images/arrow-sort-ascending.svg', 'images/arrow-sort-ascending.png');
-}
+.mw-datatable {
+	&-is-sorted a {
+		background-position: left center;
+		background-repeat: no-repeat;
+		padding-left: 15px;
+	}
 
-.TablePager .TablePager_sort-descending a {
-	padding-left: 15px;
-	background: none left center no-repeat;
-	.background-image-svg('images/arrow-sort-descending.svg', 'images/arrow-sort-descending.png');
+	&-is-ascending a {
+		.background-image-svg( 'images/arrow-sort-ascending.svg', 'images/arrow-sort-ascending.png' );
+	}
+
+	&-is-descending a {
+		.background-image-svg( 'images/arrow-sort-descending.svg', 'images/arrow-sort-descending.png' );
+	}
 }
 
 .TablePager_nav {
-- 
2.20.1