Create .mw-body-header element for body content

For language-in-header feature, edits the <header> element to
contain:
- page title,
- language selector
- tagline (siteSub)
- Indicators

These elements are associated with header/meta content so grouping
them inside one header element makes sense semantically.

Bug: T248761
Change-Id: Ief6c4936d1ebe381432369f8d86419da5f7c6cae

includes/templates/skin.mustache

@@ -51,18 +51,30 @@
 <main id="content" class="mw-body" role="main">
 	<a id="top"></a>
 	<div id="siteNotice" class="mw-body-content">{{{html-site-notice}}}</div>
-	{{>Indicators}}
+
 	{{^is-language-in-header}}
+	{{>Indicators}}
 	<h1 id="firstHeading" class="firstHeading" {{{html-user-language-attributes}}}>{{{html-title}}}</h1>
 	{{/is-language-in-header}}
+
 	{{#is-language-in-header}}
-	<header>
-		<h1 id="firstHeading" class="firstHeading" {{{html-user-language-attributes}}}>{{{html-title}}}</h1>
+	<header class="mw-body-header">
 		{{#data-portlets.data-languages}}{{>Menu}}{{/data-portlets.data-languages}}
+		{{>Indicators}}
+		<h1 id="firstHeading" class="firstHeading" {{{html-user-language-attributes}}}>
+			{{{html-title}}}
+		</h1>
+
+		{{#page-isarticle}}
+			<div id="siteSub" class="noprint">{{msg-tagline}}</div>
+		{{/page-isarticle}}
 	</header>
 	{{/is-language-in-header}}
+
 	<div id="bodyContent" class="mw-body-content">
-		{{#page-isarticle}}<div id="siteSub" class="noprint">{{msg-tagline}}</div>{{/page-isarticle}}
+		{{^is-language-in-header}}
+			{{#page-isarticle}}<div id="siteSub" class="noprint">{{msg-tagline}}</div>{{/page-isarticle}}
+		{{/is-language-in-header}}
 		<div id="contentSub"{{{html-user-language-attributes}}}>{{{html-subtitle}}}</div>
 		<div id="contentSub2">{{{html-undelete-link}}}</div>
 		{{{html-user-message}}}

resources/skins.vector.styles/layout-default.less

@@ -78,6 +78,14 @@ body {
 	z-index: @z-index-indicators;
 }
 
+.mw-body-header {
+	.mixin-clearfix();
+
+	#p-lang {
+		float: right;
+	}
+}
+
 .mw-body-content {
 	position: relative;
 	z-index: @z-index-base;
@@ -317,19 +325,3 @@ body {
 		}
 	}
 }
-
-main.mw-body {
-	header {
-		border-bottom: 1px solid @border-color-base;
-		.mixin-clearfix();
-
-		h1 {
-			border-bottom: 0;
-			float: left;
-		}
-	}
-
-	#p-lang {
-		float: right;
-	}
-}

skin.json

@@ -217,7 +217,8 @@
 			"value": false
 		},
 		"VectorLanguageInHeader": {
-			"value": false
+			"value": false,
+			"description": "@var boolean Moves the language links from the sidebar into a menu beside the page title. Also moves the indicators to the line below, next to the tagline (siteSub)."
 		},
 		"VectorDisableSidebarPersistence": {
 			"value": false,