From 0b89c27678a2bff7c8f86ea2907120a230b77f73 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niklas=20Laxstr=C3=B6m?= <niklas.laxstrom@gmail.com>
Date: Thu, 26 May 2016 09:53:38 +0200
Subject: [PATCH] Give language selection buttons more space

Let them assume normal size with regular padding. In the case that
the buttons do not fit one line, some will overflow to the second
line. In my opinion that looks less ugly than irregular padding
and truncated language names.

Bug: T136273
Change-Id: I26dd7745ac03e1b940348b318d74d0a2bd27e1a3
---
 resources/css/ext.uls.css               | 9 +--------
 resources/js/ext.uls.displaysettings.js | 6 +++---
 resources/js/ext.uls.inputsettings.js   | 8 ++++----
 3 files changed, 8 insertions(+), 15 deletions(-)

diff --git a/resources/css/ext.uls.css b/resources/css/ext.uls.css
index 25eea14b..7e3c988a 100644
--- a/resources/css/ext.uls.css
+++ b/resources/css/ext.uls.css
@@ -39,16 +39,9 @@
 }
 
 .uls-ui-languages button {
-	width: 22%;
-	text-overflow: ellipsis;
-	margin-right: 2%;
+	margin: 5px 15px 5px 0;
 	white-space: nowrap;
 	overflow: hidden;
-	padding: 0.5em 0;
-}
-
-button.uls-more-languages {
-	width: auto;
 }
 
 .uls-search-wrapper-wrapper {
diff --git a/resources/js/ext.uls.displaysettings.js b/resources/js/ext.uls.displaysettings.js
index 494f854e..1940084e 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -38,14 +38,14 @@
 
 		// "Display language", title above the buttons row
 		'<div class="row">' +
-		'<div class="eleven columns">' +
+		'<div class="twelve columns">' +
 		'<h4 data-i18n="ext-uls-display-settings-ui-language"></h4>' +
 		'</div>' +
 		'</div>' +
 
 		// UI languages buttons row
 		'<div class="row">' +
-		'<div class="uls-ui-languages eleven columns">' +
+		'<div class="uls-ui-languages twelve columns">' +
 		'<p data-i18n="ext-uls-language-buttons-help"></p>' +
 		'</div>' +
 		'</div>' +
@@ -86,7 +86,7 @@
 
 		// Webfonts enabling checkbox with label
 		'<div class="row">' +
-		'<div class="eleven columns">' +
+		'<div class="twelve columns">' +
 		'<div class="mw-ui-checkbox">' +
 		'<input type="checkbox" id="webfonts-enable-checkbox" />' +
 		'<label class="checkbox" for="webfonts-enable-checkbox" >' +
diff --git a/resources/js/ext.uls.inputsettings.js b/resources/js/ext.uls.inputsettings.js
index d303a6bd..8aaa4c5d 100644
--- a/resources/js/ext.uls.inputsettings.js
+++ b/resources/js/ext.uls.inputsettings.js
@@ -30,19 +30,19 @@
 
 		// "Language for ime", title above the buttons row
 		'<div class="row enabled-only uls-input-settings-languages-title">' +
-		'<div class="eleven columns">' +
+		'<div class="twelve columns">' +
 		'<h4 data-i18n="ext-uls-input-settings-ui-language"></h4>' +
 		'</div>' +
 		'</div>' +
 
 		// UI languages buttons row
 		'<div class="row enabled-only">' +
-		'<div class="uls-ui-languages eleven columns"></div>' +
+		'<div class="uls-ui-languages twelve columns"></div>' +
 		'</div>' +
 
 		// Web IMEs enabling chechbox with label
 		'<div class="row enabled-only">' +
-		'<div class="eleven columns uls-input-settings-inputmethods-list">' +
+		'<div class="twelve columns uls-input-settings-inputmethods-list">' +
 		// "Input settings for language xyz" title
 		'<h4 class="ext-uls-input-settings-imes-title"></h4>' +
 		'</div>' +
@@ -50,7 +50,7 @@
 
 		// Disable IME system button
 		'<div class="row">' +
-		'<div class="eleven columns uls-input-settings-disable-info"></div>' +
+		'<div class="twelve columns uls-input-settings-disable-info"></div>' +
 		'<div class="ten columns uls-input-settings-toggle">' +
 		'<button class="active mw-ui-constructive mw-ui-button uls-input-toggle-button"></button>' +
 		'</div>' +