Various improvements and fixes

* Consistent dark colours stolen from wikimediadc.org, probably stolen from
  that header template
* More consistent colours for headers
* Fixes for extension:templatesandbox
* pre and center rules, which for some reason aren't in core
* Fix for anchor offset issues caused by the fixed header
* Fixes for the personal dropdown menu
* Update font stack to use only ones with known consistent metrics

Change-Id: I88350e837b96de812c9d5f1308ae83703da6d0b4

resources/forms.less

@@ -189,6 +189,25 @@ div.editOptions {
 	label {
 		margin-right: 1.5em;
 	}
+
+	// For Extension:TemplateSandbox and the like
+	fieldset,
+	legend {
+		background: inherit;
+		border: none;
+		box-shadow: none;
+		padding: 0;
+		margin-top: 2em;
+	}
+}
+
+
+/* Extension:TemplateSandbox stuff */
+.mw-templatesandbox-page label {
+	padding: 0;
+}
+#wpTemplateSandboxPreview {
+	margin-left: .5em;
 }
 
 /* Recent changes and watchlist options */

resources/screen-common.less

@@ -82,7 +82,7 @@ a.new,
 	}
 
 	h1, h2 {
-		border-bottom: solid 2px @blue-bright;
+		border-bottom: solid 2px @blue;
 
 	}
 
@@ -120,6 +120,17 @@ a.new,
 	}
 }
 
+pre {
+	overflow: auto;
+	white-space: pre-wrap;
+}
+
+.center,
+.center * {
+	margin: auto;
+	text-align: center;
+}
+
 /* Thumbnails */
 .tright {
 	margin: 0 0 .5em .5em;

resources/screen-desktop.less

@@ -32,27 +32,36 @@
 	background: @background;
 	color: @text;
 	padding: 0.5em 0 0;
-	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.5);
+	box-shadow: 0 3px 3px 2px rgba(0, 0, 0, 0.075), 0 0 2px rgba(0, 0, 0, 0.2);
+	min-height: 2.85em;
+}
+
+/* Add offset to make anchor links work with the fixed header */
+:target:before {
+	content: "";
+	display: block;
+	height: 2.85em;
+	margin: -2.85em 0 0;
 }
 
 @color-height: 4px;
 .color-left {
 	float:left;
 	height: @color-height;
-	background: @red;
+	background: @red-dark;
 	width: 50%;
 }
 .color-right {
 	display: inline-block;
 	height: @color-height;
-	background: @green;
+	background: @green-dark;
 	width: 50%;
 	float:right;
 }
 .color-middle {
 	height: @color-height;
-	background: @blue;
-	margin-top: .3em;
+	background: @blue-dark;
+	margin-top: .4em;
 	margin-bottom: -@color-height;
 	position: relative;
 }
@@ -69,8 +78,8 @@
 	line-height: 1;
 }
 #p-personal h3 {
-	margin: 0;
-	padding: .7em 0 .55em 25px;
+	margin: 0 0 -1em;
+	padding: .7em 0 1.25em 25px;
 	font-family: @fonts-secondary;
 	font-weight: normal;
 	font-size: 1.1em;
@@ -158,7 +167,7 @@
 	position: absolute;
 	padding: 20px 2em 0;
 	min-width: 6em;
-	top: 2.45em;
+	top: 2.95em;
 	right: 0;
 	overflow: visible;
 	line-height: 1.1;

resources/variables.less

@@ -12,43 +12,44 @@
 @link: @blue;
 @link-red: @red;
 
-@grey: #ddd;
+@grey: #ccc;
 @grey-bright: #eee;
-@grey-dark: #aaa;
+@grey-dark: #666;
 
-@red: #b22;
-@red-bright: #f44;
-@red-dark: #800;
+@red: #d44;
+@red-bright: #f55;
+@red-dark: #900;
 
-@green: #194;
-@green-bright: #4c7;
-@green-dark: #071;
+@green: #3b7;
+@green-bright: #4c8;
+@green-dark: #396;
 
-@blue: #07c;
-@blue-bright: #08d;
-@blue-dark: #047;
+@blue: #08d;
+@blue-bright: #2af;
+@blue-dark: #069;
 
 @link: @blue;
 @link-red: @red;
 
 
-/* Flair */
-
-@fonts-secondary: 'Linux Libertine', 'Georgia', serif;
-@fonts: 'Open Sans', 'Helvetica Neue', 'Arial', sans-serif;
+// Flair
+// Fonts are chosen for consistent metrics, not necessarily overall prettiness.
+// This will NEED fixes for different languages.
+@fonts-secondary: 'Linux Libertine', 'Times New Roman', serif;
+@fonts: 'Helvetica Neue', 'Nimbus Sans L', 'Arial', sans-serif;
 @border: .2em;
 @radius: .2em;
 
 
 /* Misc */
 
-/* To hide objects, but keep them accessible for screen-readers */
+// To hide objects, but keep them accessible for screen-readers
 .hidden() {
 	position: absolute;
 	top: -9999px;
 }
 
-/* Icons - hides labels, but keep them accessible for screen-readers */
+// Icons - hides labels, but keep them accessible for screen-readers
 .icon() {
 	text-indent: -99999px;
 	border: none;