Minerva should use mediawiki.hlist

Override provided styles

Bug: T42062
Depends-On: I9305af5d30c8c24b44f4a0c6a466581c45fa3028
Change-Id: I7adda8ef99e5eee3df5bd7dc4da5081c1225f815

includes/skins/SkinMinerva.php

@@ -1352,6 +1352,7 @@ class SkinMinerva extends SkinTemplate implements ICustomizableSkin {
 			'skins.minerva.base.reset',
 			'skins.minerva.base.styles',
 			'skins.minerva.content.styles',
+			'mediawiki.hlist',
 			'skins.minerva.tablet.styles',
 			'mediawiki.ui.icon',
 			'mediawiki.ui.button',

resources/skins.minerva.content.styles/lists.less

@@ -2,25 +2,8 @@
 @import 'minerva.variables.less';
 @import 'minerva.mixins.less';
 
-// FIXME: to support hlists on enwiki projects - this should be deprecated
-.hlist > ul,
-// Horizontal Lists
-//
-// Use hlist class when dealing with lists where items should be horizontal.
-//
-// Markup:
-// <ul class="hlist">
-// <li>item 1</li>
-// <li>item 2</li>
-// </ul>
-//
-// Styleguide 1.5.
-ul.hlist {
-	li {
-		display: inline-block;
-		margin-right: 8px;
-	}
-}
+// FIXME: Delete this in 7 days time (T42062)
+@import '../../skinStyles/mediawiki.hlist/minerva.less';
 
 .content {
 	ul {
@@ -80,15 +63,3 @@ body.mw-hide-empty-elt .mw-empty-elt {
 	display: none;
 }
 
-.hlist-separated {
-	li:after {
-		content: '•';
-		padding-left: 8px;
-		color: @linkColor;
-		font-size: 16px;
-		line-height: 1;
-	}
-	:last-child:after {
-		content: '';
-	}
-}

skin.json

@@ -36,6 +36,9 @@
 	},
 	"ResourceModuleSkinStyles": {
 		"minerva": {
+			"mediawiki.hlist": [
+				"skinStyles/mediawiki.hlist/minerva.less"
+			],
 			"mobile.languages.structured": [
 				"skinStyles/mobile.languages.structured/LanguageOverlay.less"
 			],

skinStyles/mediawiki.hlist/minerva.less

@@ -0,0 +1,40 @@
+ @import 'minerva.variables.less';
+
+/**
+ * This tweaks the default mediawiki.hlist module to provide performance optimisations
+ * as well as subtle tweaks to the appearance. It's a work in progress.
+ */
+
+// FIXME: to support hlists on enwiki projects - this should be deprecated
+.hlist > ul,
+.hlist > dl,.hlist > ul,
+// Horizontal Lists
+//
+// Use hlist class when dealing with lists where items should be horizontal.
+//
+// Markup:
+// <ul class="hlist">
+// <li>item 1</li>
+// <li>item 2</li>
+// </ul>
+//
+// Styleguide 1.5.
+ul.hlist {
+	li {
+		display: inline-block;
+		margin-right: 8px;
+	}
+}
+
+.hlist-separated {
+	li:after {
+		content: '•';
+		padding-left: 8px;
+		color: @linkColor;
+		font-size: 16px;
+		line-height: 1;
+	}
+	:last-child:after {
+		content: '';
+	}
+}