From e3831477e86f0963b37e68e47ef57c384ac2077c Mon Sep 17 00:00:00 2001 From: =?utf8?q?Bartosz=20Dziewo=C5=84ski?= Date: Sat, 13 Sep 2014 13:11:08 +0000 Subject: [PATCH] Revert "Add support for svg in .list-style-image" The generated CSS is invalid, as you can't have multiple list-style-images (unlike background-images). Browsers either ignore the invalid properties with linear-gradient and use non-embedded PNG fallback (Chrome, Firefox, modern IE), or accept the properties but ignore everything after the comma, using the fully transparent gradient (Opera). This reverts commit 502fffe3bf2cb6a8fccb8059436a038e21153596. Change-Id: I87f8142b5e718f96ca8ee74578224b4db7dedce9 --- .../src/mediawiki.less/mediawiki.mixins.less | 38 +++---------------- 1 file changed, 6 insertions(+), 32 deletions(-) diff --git a/resources/src/mediawiki.less/mediawiki.mixins.less b/resources/src/mediawiki.less/mediawiki.mixins.less index 7963533272..8c288840db 100644 --- a/resources/src/mediawiki.less/mediawiki.mixins.less +++ b/resources/src/mediawiki.less/mediawiki.mixins.less @@ -19,17 +19,6 @@ background-image: url(@url); } -/* Caution: Does not support localisable images */ - -.list-style-image(@url) when (embeddable(@url)) { - list-style-image: embed(@url); - list-style-image: url(@url)!ie; -} - -.list-style-image(@url) when not (embeddable(@url)) { - list-style-image: url(@url); -} - .vertical-gradient(@startColor: gray, @endColor: white, @startPos: 0, @endPos: 100%) { background-color: @endColor; background-image: -moz-linear-gradient( top, @startColor @startPos, @endColor @endPos ); // Firefox 3.6+ @@ -61,29 +50,14 @@ background-image: linear-gradient(transparent, transparent), url(@svg); } -/* - * Caution: Does not support localisable images - * - * 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 - * - * We use gzip compression, which means that it is okay to embed twice. - * - * We do not embed the fallback image on the assumption that the gain for old browsers - * is not worth the harm done to modern ones. - */ -.list-style-image-svg(@svg, @fallback) when (embeddable(@svg)) { - list-style-image: url(@fallback); - /* We don't need the !ie hack because this old IE uses the fallback already */ - list-style-image: -webkit-linear-gradient(transparent, transparent), embed(@svg); - list-style-image: linear-gradient(transparent, transparent), embed(@svg); +/* Caution: Does not support localisable images */ +.list-style-image(@url) when (embeddable(@url)) { + list-style-image: embed(@url); + list-style-image: url(@url)!ie; } -.list-style-image-svg(@svg, @fallback) when not (embeddable(@svg)) { - list-style-image: url(@fallback); - list-style-image: -webkit-linear-gradient(transparent, transparent), url(@svg); - list-style-image: linear-gradient(transparent, transparent), url(@svg); +.list-style-image(@url) when not (embeddable(@url)) { + list-style-image: url(@url); } .transition(@value) { -- 2.20.1