From 0e0ec99c81a6b200e4884c1b942ea8a361fb8024 Mon Sep 17 00:00:00 2001
From: jdlrobson <jdlrobson@gmail.com>
Date: Thu, 4 Feb 2021 18:14:21 -0800
Subject: [PATCH] Language button - design fixes

* change color to #202122 (currently it's #54595d)
* padding-right for button text should be 30px (currently it's 40px)
* language icon seems to be displaying at 21x21px (should be 20x20px)
* language icon's margin-right should be 7px (currently is 14px)
* the down arrow should be 10px from the right edge of the button (currently it's 8px)
(requires core change in 661497 to apply)
* increase font-size to 16px (currently it's 13px)
* add a max-height of ~65vh (or something similar)
* add overflow: scroll
* add a border-top (since the menu is wider than the button)

Bug: T268241#6805123
Change-Id: I8891556cb82450db77b90837eeeb72ac78926e29
---
 resources/skins.vector.styles/LanguageButton.less | 12 ++++++++++--
 skinStyles/mediawiki.ui.icon.less                 |  3 +++
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/resources/skins.vector.styles/LanguageButton.less b/resources/skins.vector.styles/LanguageButton.less
index 046bb72..283c46b 100644
--- a/resources/skins.vector.styles/LanguageButton.less
+++ b/resources/skins.vector.styles/LanguageButton.less
@@ -6,9 +6,10 @@
 	.mw-ui-button-states();
 
 	.vector-menu-heading {
+		color: inherit;
 		// In future this should use wvui
 		.mw-ui-button();
-		padding-right: 40px;
+		padding-right: 30px;
 		// make sure label is center aligned.
 		display: flex;
 		align-items: center;
@@ -23,11 +24,18 @@
 		right: 0;
 		// align borders of open menu align with button
 		box-sizing: border-box;
+		max-height: 65vh;
+		overflow: scroll;
+		border-top-width: 1px;
+
+		li a {
+			font-size: inherit;
+		}
 	}
 
 	.after-portlet {
 		// ensure there is a visual separation between the language links and additional links.
-		margin-top: 8px;
+		margin-top: 10px;
 	}
 }
 
diff --git a/skinStyles/mediawiki.ui.icon.less b/skinStyles/mediawiki.ui.icon.less
index 9fb3bef..41762ab 100644
--- a/skinStyles/mediawiki.ui.icon.less
+++ b/skinStyles/mediawiki.ui.icon.less
@@ -3,4 +3,7 @@
 .mw-page-container .mw-ui-icon:before {
 	// mw-ui-icon in core defaults to 24x24. The style guide now requests 20x20.
 	background-size: 20px auto;
+	width: 20px;
+	height: 20px;
+	min-height: 20px;
 }