Merge changes Ib0b3539e,I2082cec1

* changes:
  Make dark footer
  Change searchInput placeholder (i18n message example)

TimelessTemplate.php

@@ -24,8 +24,8 @@ class TimelessTemplate extends BaseTemplate {
 			</div>
 			</div>
 
-			<div id="content-container" class="ts-container">
-			<div id="content-block" class="ts-inner">
+			<div id="mw-content-container" class="ts-container">
+			<div id="mw-content-block" class="ts-inner">
 				<div id="mw-site-navigation">
 					<h2><?php echo $this->getMsg( 'navigation-heading' )->parse() ?></h2>
 					<?php
@@ -39,7 +39,7 @@ class TimelessTemplate extends BaseTemplate {
 				</div>
 				<div id="mw-related-navigation">
 				</div>
-				<div id="content">
+				<div id="mw-content">
 				<div class="mw-body" role="main">
 					<?php
 					if ( $this->data['sitenotice'] ) {
@@ -76,12 +76,16 @@ class TimelessTemplate extends BaseTemplate {
 
 						<?php
 						$this->html( 'bodytext' );
+						?>
+						<div class="visual-clear"></div>
+						<?php
 						$this->html( 'catlinks' );
 						$this->html( 'dataAfterContent' );
 						?>
 					</div>
 				</div>
 				</div>
+			<div class="visual-clear"></div>
 			</div>
 			</div>
 
@@ -203,12 +207,17 @@ class TimelessTemplate extends BaseTemplate {
 		?>
 		<div class="mw-portlet" id="p-search">
 			<h3<?php $this->html( 'userlangattributes' ) ?>>
-				<label for="searchInput"><?php $this->msg( 'search' ) ?></label>
+				<label for="searchInput"><?php echo $this->getMsg( 'search' )->parse() ?></label>
 			</h3>
 			<form action="<?php $this->text( 'wgScript' ) ?>" id="searchform">
 				<div id="simpleSearch">
 				<div id="searchInput-container">
-					<?php echo $this->makeSearchInput( array( 'id' => 'searchInput' ) ); ?>
+					<?php
+					echo $this->makeSearchInput( array(
+						'id' => 'searchInput',
+						'placeholder' => $this->getMsg( 'timeless-search-placeholder' )->escaped(),
+					) );
+					?>
 				</div>
 				<?php
 				echo Html::hidden( 'title', $this->get( 'searchtitle' ) );

i18n/en.json

@@ -3,5 +3,6 @@
 		"authors": [ "Isarra" ]
 	},
 	"skinname-timeless": "Timeless",
-	"timeless-desc": "A timeless skin designed after the Winter prototype by Brandon Harris."
+	"timeless-desc": "A timeless skin designed after the Winter prototype by Brandon Harris.",
+	"timeless-search-placeholder": "Search approximately {{NUMBEROFPAGES}} pages"
 }

i18n/qqq.json

@@ -5,5 +5,6 @@
 		]
 	},
 	"skinname-timeless": "{{optional}}",
-	"timeless-desc": "{{desc|what=skin|name=Timeless|url=https://www.mediawiki.org/wiki/Skin:Timeless}}"
+	"timeless-desc": "{{desc|what=skin|name=Timeless|url=https://www.mediawiki.org/wiki/Skin:Timeless}}",
+	"timeless-search-placeholder": "Main search input placeholder text"
 }

resources/screen-common.less

@@ -8,13 +8,38 @@ body {
 	margin: 0;
 	padding: 0;
 	color: @text;
-	background: @background2;
+	background: @background-dark;
 	font-size: 1em;
 	line-height: 1.3;
 }
-#content {
+#mw-content {
 	background: @background;
 }
+#mw-content-container {
+	background: @background2;
+}
+#mw-footer-container {
+	border-top: solid 1px @background-dark2;
+	box-shadow: inset 0 7px 2px -4px rgba(0, 0, 0, .1);
+
+	ul {
+		margin: 0;
+	}
+}
+
+#p-logo {
+	text-align: center;
+	width: 10em;
+
+	a.mw-wiki-logo {
+		display: block;
+		content: '';
+		width: 10em;
+		height: 10em;
+		background-repeat: no-repeat;
+		background-position: 50% 50%;
+	}
+}
 
 /* Misc */
 
@@ -34,19 +59,14 @@ a {
 	}
 }
 
-#p-logo {
-	text-align: center;
-	width: 10em;
-
-	a.mw-wiki-logo {
-		display: block;
-		content: '';
-		width: 10em;
-		height: 10em;
-		background-repeat: no-repeat;
-		background-position: 50% 50%;
-	}
+.mw-editsection-bracket {
+	display: none;
 }
+.visual-clear {
+	clear: both;
+}
+
+/* Hidden stuff */
 
 #mw-site-navigation h2,
 #p-search h3,

resources/screen-desktop.less

@@ -11,7 +11,7 @@
 	float: left;
 }
 #p-search,
-#content {
+#mw-content {
 	margin-left: 12em;
 	margin-right: 12em;
 }
@@ -25,10 +25,10 @@
 	position: fixed;
 	top: 0;
 	width: 100%;
-	background: @foreground;
+	background: @background-dark;
 	color: @text-inverse;
 	height: 3em;
-	border-bottom: solid 1px @foreground2;
+	border-bottom: solid 1px @background-dark2;
 	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
 }
 
@@ -38,7 +38,7 @@
 #p-logo-text {
 	width: 10em;
 	text-align: center;
-	text-shadow: 0 -1px 0 @foreground2;
+	text-shadow: 0 -1px 0 @background-dark2;
 
 	a {
 		color: @text-inverse;
@@ -57,7 +57,7 @@
 	background: @background;
 	margin: .5em 0 0 0;
 	position: relative;
-	border-top: solid 1px @foreground2;
+	border-top: solid 1px @background-dark2;
 }
 #searchInput {
 	border: none;
@@ -86,15 +86,16 @@
 
 /* CONTENT */
 
-#content-container {
+#mw-content-container {
 	margin-top: 3em;
+	padding-bottom: 1em;
 }
-#content {
+#mw-content {
 	background: @background;
 	padding-top: 1em;
 	border: 1px @grey-bright;
-	border-style: none solid;
-	box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.02);
+	border-style: none solid solid;
+	box-shadow: 0 1px 2px 1px rgba(0, 0, 0, 0.02);
 	overflow: hidden;
 	padding-right: 2em;
 	padding-left: 2em;

resources/variables.less

@@ -4,8 +4,8 @@
 @background: #fff;
 @background2: #f3f3f3;
 
-@foreground: #777;
-@foreground2: #555;
+@background-dark: #777;
+@background-dark2: #555;
 @text-inverse: #fff;
 
 @link: @blue;