Remove unnecessary skins.minerva.base.styles

* truncated-text is only used in MainMenu, last modified bar,
 a few special pages
Making this a mixin and limiting it to mobile.startup skinStyles
and mobile.special.styles thus makes sense
* cloaked-element is only ever added by Skin.js in mobile.startup
* position-fixed is only ever added by Skin.js

Change-Id: Iaf7061e9dda87eb25c963f8a281175af08f358e5

minerva.less/minerva.mixins.less

@@ -9,3 +9,10 @@
 	margin-top: 0.5em;
 	line-height: 1.4;
 }
+
+.truncated-text() {
+	white-space: nowrap;
+	overflow: hidden;
+	-webkit-text-overflow: ellipsis;
+	text-overflow: ellipsis;
+}

resources/skins.minerva.base.styles/common.less

@@ -2,32 +2,6 @@
 @import '../../minerva.less/minerva.variables';
 @import '../../minerva.less/minerva.mixins';
 
-// Reusable components
-//
-// Styleguide 6.
-
-// Cloaked element
-//
-// Use this for elements that are clickable but not visible
-// Examples: A file input who's parent is styled with an icon
-// A shield that covers the entire screen and is made more opaque
-// under a different circumstance
-//
-// Markup:
-// <div style="width:50px; height:50px; border:1px solid red;">
-//   <input type="file" class="cloaked-element">
-// </div>
-//
-// Styleguide 6.1.
-.cloaked-element {
-	opacity: 0;
-	position: absolute;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-}
-
 .view-border-box *,
 .view-border-box {
 	.box-sizing( border-box );
@@ -61,18 +35,6 @@ textarea {
 	display: inherit;
 }
 
-/* stylelint-enable no-descending-specificity */
-.position-fixed {
-	// use !important to override more specific rules (e.g. in Overlay.less)
-	position: fixed !important;
-}
-
-.touch-events {
-	:focus {
-		outline: 0;
-	}
-}
-
 // currently used to hide talk button
 .hidden {
 	display: none !important;

resources/skins.minerva.base.styles/ui.less

@@ -238,13 +238,6 @@ input.search {
 	}
 }
 
-.truncated-text {
-	white-space: nowrap;
-	overflow: hidden;
-	-webkit-text-overflow: ellipsis;
-	text-overflow: ellipsis;
-}
-
 // This is here rather than in mainmenu.less because we want to load these rules for non-js users too
 // Transparent shield hidden by default
 .transparent-shield,

resources/skins.minerva.scripts/styles.less

@@ -1,4 +1,5 @@
 @import '../../minerva.less/minerva.variables';
+@import '../../minerva.less/minerva.mixins';
 @import 'mediawiki.mixins.animation';
 
 @animationDuration: 0.3s;
@@ -15,6 +16,11 @@
 	}
 }
 
+// Used by last modified and Main Menu items
+.truncated-text {
+	.truncated-text();
+}
+
 @-webkit-keyframes fadeInImage {
 	from {
 		opacity: 0;

skin.json

@@ -108,6 +108,7 @@
 				"skinStyles/mobile.languages.structured/LanguageOverlay.less"
 			],
 			"mobile.startup": [
+				"skinStyles/mobile.startup/skin.less",
 				"skinStyles/mobile.startup/toast.less",
 				"skinStyles/mobile.startup/Overlay.less"
 			],

skinStyles/mobile.special.styles/minerva.less

@@ -1,4 +1,5 @@
 @import '../../minerva.less/minerva.variables';
+@import '../../minerva.less/minerva.mixins';
 
 // FIXME [mediawiki ui] These rules should not be needed in the mobile context
 .mw-ui-button-group {
@@ -48,6 +49,7 @@
 
 // Used by MobileSpecialPageFeed.php in MobileFrontend
 .truncated-text {
+	.truncated-text();
 
 	// FIXME: this works only in WebKit
 	&.multi-line {

skinStyles/mobile.startup/skin.less

@@ -0,0 +1,17 @@
+.cloaked-element {
+	opacity: 0;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+}
+.position-fixed {
+	// use !important to override more specific rules (e.g. in Overlay.less)
+	position: fixed !important;
+}
+.touch-events {
+	:focus {
+		outline: 0;
+	}
+}