From: Volker E <volker.e@wikimedia.org>
Date: Fri, 18 Jan 2019 00:04:30 +0000 (-0800)
Subject: TablePager: Reduce pagination button in visual strength
X-Git-Tag: 1.34.0-rc.0~3053^2
X-Git-Url: https://git.cyclocoop.org/%7B%24admin_url%7Dmembres/supprimer.php?a=commitdiff_plain;h=36263dd18cf0b980d5cbd3f9fee0766100f6b288;p=lhc%2Fweb%2Fwiklou.git

TablePager: Reduce pagination button in visual strength

Reducing buttons to `frameless` buttons and reposition icons of
next and last page button to be symmetrically harmonious.

Bug: T214128
Change-Id: I1c0a621d7699b5fadc2559abdf6003a0db0aabae
---

diff --git a/includes/pager/TablePager.php b/includes/pager/TablePager.php
index e99c33b3a4..8934fc2b79 100644
--- a/includes/pager/TablePager.php
+++ b/includes/pager/TablePager.php
@@ -310,6 +310,9 @@ abstract class TablePager extends IndexPager {
 				// * table_pager_prev
 				// * table_pager_next
 				// * table_pager_last
+				'classes' => [ 'TablePager-button-' . $type ],
+				'flags' => [ 'progressive' ],
+				'framed' => false,
 				'label' => $this->msg( 'table_pager_' . $type )->text(),
 				'href' => $queries[ $type ] ?
 					$title->getLinkURL( $queries[ $type ] + $this->getDefaultQuery() ) :
diff --git a/resources/src/mediawiki.pager.tablePager/TablePager.less b/resources/src/mediawiki.pager.tablePager/TablePager.less
index 5b3519e5c8..bea197a2f9 100644
--- a/resources/src/mediawiki.pager.tablePager/TablePager.less
+++ b/resources/src/mediawiki.pager.tablePager/TablePager.less
@@ -21,8 +21,34 @@
 	.background-image-svg('images/arrow-sort-descending.svg', 'images/arrow-sort-descending.png');
 }
 
-.TablePager_nav.oo-ui-buttonGroupWidget {
-	display: block;
-	text-align: center;
-	margin: 1em;
+.TablePager_nav {
+	&.oo-ui-buttonGroupWidget {
+		display: block;
+		margin: 1em;
+		text-align: center;
+	}
+
+	// Overrule default OOUI frameless special treatment for left-aligned widgets
+	& .oo-ui-buttonElement-frameless {
+		&.oo-ui-labelElement > .oo-ui-buttonElement-button {
+			padding-right: 0.5em;
+		}
+
+		&.oo-ui-labelElement.oo-ui-iconElement:first-child {
+			margin-left: 0;
+		}
+	}
+
+	.TablePager-button-next,
+	.TablePager-button-last {
+		&.oo-ui-buttonElement-frameless.oo-ui-iconElement > .oo-ui-buttonElement-button {
+			padding-left: 0.5em;
+			padding-right: 2.14285714em;
+
+			> .oo-ui-iconElement-icon {
+				left: auto;
+				right: 0.35714286em;
+			}
+		}
+	}
 }