From 8b823b080a782ef1d794abeb318ea7eb581273db Mon Sep 17 00:00:00 2001
From: jdlrobson <jdlrobson@gmail.com>
Date: Thu, 17 Aug 2017 16:42:00 -0500
Subject: [PATCH] Give the Special:preferences page on desktop some love

The preferences page is accessible if a user opts into the Minerva
desktop experience. It's not a great first experience.

These changes make the page usable.

* Provide styling for tabs
* Provide padding/borders for unstyled button elements

Change-Id: I107ed3c685910a5e9502b25d22ef7cc489ce3c34
---
 skin.json                                     |  3 ++
 .../styles.less                               | 49 +++++++++++++++++++
 2 files changed, 52 insertions(+)
 create mode 100644 skinStyles/mediawiki.special.preferences.styles/styles.less

diff --git a/skin.json b/skin.json
index 4e54d71..54548c2 100644
--- a/skin.json
+++ b/skin.json
@@ -59,6 +59,9 @@
 			"mediawiki.action.edit.styles": [
 				"skinStyles/mediawiki.action.edit.styles/minerva.less"
 			],
+			"mediawiki.special.preferences.styles": [
+				"skinStyles/mediawiki.special.preferences.styles/styles.less"
+			],
 			"mobile.pointerOverlay": [
 				"skinStyles/mobile.pointerOverlay/minerva.less"
 			],
diff --git a/skinStyles/mediawiki.special.preferences.styles/styles.less b/skinStyles/mediawiki.special.preferences.styles/styles.less
new file mode 100644
index 0000000..2e6814d
--- /dev/null
+++ b/skinStyles/mediawiki.special.preferences.styles/styles.less
@@ -0,0 +1,49 @@
+@import 'minerva.variables';
+
+// FIXME: All this code can be removed when T117781/T171238 is resolved.
+#preftoc {
+	text-align: center;
+
+	li {
+		display: inline-block;
+		color: @colorGray2;
+		border: 1px solid @colorFieldBorder;
+		border-radius: 0;
+
+		&:first-child {
+			border-top-left-radius: 2px;
+			border-bottom-left-radius: 2px;
+		}
+
+		&:last-child {
+			border-top-right-radius: 2px;
+			border-bottom-right-radius: 2px;
+		}
+
+		&:not( :first-child ) {
+			border-left: 0;
+		}
+
+		&.selected {
+			background-color: @colorProgressiveActive;
+			border-color: @colorProgressiveActive;
+			color: #fff;
+			box-shadow: none;
+		}
+
+		a {
+			padding: 0.5em 1em;
+			color: inherit;
+			display: block;
+		}
+	}
+}
+
+.mw-htmlform-submit-buttons,
+.mw-input {
+	select,
+	input {
+		border: solid 1px @colorFieldBorder;
+		padding: 8px;
+	}
+}
\ No newline at end of file