Make site title overflow less; add option to just change it for the skin

Just makes the font smaller if over a certain length. Not actually
smart. Will later add an option to replace it entirely with an image.

Change-Id: I7157c80132330c525ac2cb2027307550cee282b4

TimelessTemplate.php

@@ -247,9 +247,15 @@ class TimelessTemplate extends BaseTemplate {
 				<?php
 			}
 			if ( $part !== 'image' ) {
+				$titleClass = '';
+				$siteTitle = $this->getMsg( 'timeless-sitetitle' )->escaped();
+				// width is 11em; 13 characters will probably fit?
+				if ( mb_strlen( $siteTitle ) > 13 ) {
+					$titleClass = 'long';
+				}
 				?>
-				<a id="p-banner" class="mw-wiki-title" href="<?php echo htmlspecialchars( $this->data['nav_urls']['mainpage']['href'] ) ?>">
-					<?php echo $this->getMsg( 'sitetitle' )->escaped() ?>
+				<a id="p-banner" class="mw-wiki-title <?php echo $titleClass ?>" href="<?php echo htmlspecialchars( $this->data['nav_urls']['mainpage']['href'] ) ?>">
+					<?php echo $siteTitle ?>
 				</a>
 				<?php
 			}
@@ -323,7 +329,7 @@ class TimelessTemplate extends BaseTemplate {
 			if ( $user->isLoggedIn() ) {
 				$userName = $user->getName();
 				// Make sure it fit firsts
-				if ( strlen( $userName ) < 12 ) {
+				if ( mb_strlen( $userName ) < 12 ) {
 					echo htmlspecialchars( $userName, ENT_QUOTES );
 				} else {
 					echo wfMessage( 'timeless-loggedin' )->escaped();

i18n/en.json

@@ -15,6 +15,7 @@
 	"timeless-userpagetools": "User tools",
 	"timeless-pagemisc": "More",
 	"timeless-namespaces": "Namespaces",
-	"timeless-pagetools": "Page actions"
+	"timeless-pagetools": "Page actions",
+	"timeless-sitetitle": "{{MediaWiki:Sitetitle}}"
 }
 

i18n/qqq.json

@@ -17,6 +17,7 @@
 	"timeless-pageactions": "Label for some page actions",
 	"timeless-userpagetools": "Label for actions associated with a userpage",
 	"timeless-pagemisc": "Label for more tools\n{{Identical|More}}",
-	"timeless-namespaces": "Label for page namespaces and watch tool\n{{Identical|Namespace}}",
-	"timeless-pagetools": "Label for some other page tools"
+	"timeless-namespaces": "Label for page namespaces and watch tools\n{{Identical|Namespace}}",
+	"timeless-pagetools": "Label for other page tools",
+	"timeless-sitetitle": "{{ignore}}\nSite title for site banner"
 }

resources/screen-desktop.less

@@ -52,7 +52,7 @@
 .color-middle {
 	height: @color-height;
 	background: @blue;
-	margin-top: .25em;
+	margin-top: .3em;
 	margin-bottom: -@color-height;
 	position: relative;
 }
@@ -104,6 +104,13 @@
 		font-variant: small-caps;
 		font-size: 1.75em;
 		display: block;
+
+		/* 13+ character names */
+		&.long {
+			font-size: 1.45em;
+			padding: 0;
+			line-height: .8;
+		}
 	}
 }