From 7b62f8abf30bae50f0888121a0aac10960655ddf Mon Sep 17 00:00:00 2001
From: Ed Sanders <esanders@wikimedia.org>
Date: Tue, 22 May 2018 21:01:59 +0100
Subject: [PATCH] Convert content.externallinks.css to less

As suggested in the comment, since the blocking
bug was fixed 3.5 years ago.

Change-Id: I345f81ca5b9672c34525d223f01844df0a74f617
---
 resources/Resources.php                       |  2 +-
 ...allinks.css => content.externallinks.less} | 51 ++++++++-----------
 2 files changed, 23 insertions(+), 30 deletions(-)
 rename resources/src/mediawiki.skinning/{content.externallinks.css => content.externallinks.less} (53%)

diff --git a/resources/Resources.php b/resources/Resources.php
index d718fb6530..df14fcdb3c 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -132,7 +132,7 @@ return [
 
 	'mediawiki.skinning.content.externallinks' => [
 		'styles' => [
-			'resources/src/mediawiki.skinning/content.externallinks.css' => [ 'media' => 'screen' ],
+			'resources/src/mediawiki.skinning/content.externallinks.less' => [ 'media' => 'screen' ],
 		],
 	],
 
diff --git a/resources/src/mediawiki.skinning/content.externallinks.css b/resources/src/mediawiki.skinning/content.externallinks.less
similarity index 53%
rename from resources/src/mediawiki.skinning/content.externallinks.css
rename to resources/src/mediawiki.skinning/content.externallinks.less
index 5afa51d2ea..c6390c0ade 100644
--- a/resources/src/mediawiki.skinning/content.externallinks.css
+++ b/resources/src/mediawiki.skinning/content.externallinks.less
@@ -2,45 +2,38 @@
  * Icons and colors for external links.
  */
 
-/* T68091 is blocking is from converting this file to LESS
- * and using the .background-image-svg mixin. */
-
-/* SVG support using a transparent gradient to guarantee cross-browser
- * compatibility ( browsers able to understand gradient syntax support also SVG ).
- * http://pauginer.tumblr.com/post/36614680636/invisible-gradient-technique */
+@import 'mediawiki.mixins';
 
 .mw-parser-output a.external,
 .link-https {
-	background: url( images/external-ltr.png ) center right no-repeat;
-	/* @embed */
-	background-image: -webkit-linear-gradient( transparent, transparent ), url( images/external-ltr.svg );
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/external-ltr.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/external-ltr.svg', 'images/external-ltr.png' );
 	padding-right: 13px;
 }
 
 .mw-parser-output a.external[ href^='mailto:' ],
 .link-mailto {
-	background: url( images/mail.png ) center right no-repeat;
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/mail.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/mail.svg', 'images/mail.png' );
 	padding-right: 13px;
 }
 
 .mw-parser-output a.external[ href^='ftp://' ],
 .link-ftp {
-	background: url( images/ftp-ltr.png ) center right no-repeat;
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/ftp-ltr.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/ftp-ltr.svg', 'images/ftp-ltr.png' );
 	padding-right: 13px;
 }
 
 .mw-parser-output a.external[ href^='irc://' ],
 .mw-parser-output a.external[ href^='ircs://' ],
 .link-irc {
-	background: url( images/chat-ltr.png ) center right no-repeat;
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/chat-ltr.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/chat-ltr.svg', 'images/chat-ltr.png' );
 	padding-right: 13px;
 }
 
@@ -57,9 +50,9 @@
 .mw-parser-output a.external[ href$='.wma' ],
 .mw-parser-output a.external[ href$='.WMA' ],
 .link-audio {
-	background: url( images/audio-ltr.png ) center right no-repeat;
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/audio-ltr.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/audio-ltr.svg', 'images/audio-ltr.png' );
 	padding-right: 13px;
 }
 
@@ -72,9 +65,9 @@
 .mw-parser-output a.external[ href$='.mpg' ],
 .mw-parser-output a.external[ href$='.MPG' ],
 .link-video {
-	background: url( images/video.png ) center right no-repeat;
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/video.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/video.svg', 'images/video.png' );
 	padding-right: 13px;
 }
 
@@ -85,9 +78,9 @@
 .mw-parser-output a.external[ href*='.pdf?' ],
 .mw-parser-output a.external[ href*='.PDF?' ],
 .link-document {
-	background: url( images/document-ltr.png ) center right no-repeat;
-	/* @embed */
-	background-image: linear-gradient( transparent, transparent ), url( images/document-ltr.svg );
+	background-position: center right;
+	background-repeat: no-repeat;
+	.background-image-svg( 'images/document-ltr.svg', 'images/document-ltr.png' );
 	padding-right: 13px;
 }
 
-- 
2.20.1