Jforrester has uploaded a new change for review. (
https://gerrit.wikimedia.org/r/393969 )
Change subject: Drop `-webkit-linear-gradient` image CSS fallback
......................................................................
Drop `-webkit-linear-gradient` image CSS fallback
This reduces the payload of CSS slightly (and in the few cases where these
were not just present but @embed'ed, significantly), at a cost of giving
those user agents which don't support the un-prefixed rule the icons as
PNGs rather than SVGs (i.e. Chrome < 25, Safari < 6.1, Android < 4.4).
We made this change for MediaWiki back in November 2015 in T118815. This
repo is not alone in not having noticed. :-) Ideally this repo would use
LESS and re-use the LESS macro in MediaWiki, but that's for the future.
Change-Id: I1469bce3dd6c6eed0d291a0cb8a19eceeaff4c10
---
M resources/css/ext.translate.editor.css
M resources/css/ext.translate.groupselector.css
M resources/css/ext.translate.loader.css
M resources/css/ext.translate.navitoggle.css
M resources/css/ext.translate.pagemode.css
M resources/css/ext.translate.proofread.css
M resources/css/ext.translate.special.aggregategroups.css
M resources/css/ext.translate.special.managetranslatorsandbox.css
M resources/css/ext.translate.special.pagemigration.css
M resources/css/ext.translate.special.translate.css
M resources/css/ext.translate.workflowselector.css
M resources/js/ext.translate.groupselector.js
12 files changed, 1 insertion(+), 38 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/Translate
refs/changes/69/393969/1
diff --git a/resources/css/ext.translate.editor.css
b/resources/css/ext.translate.editor.css
index e2aeb0f..982499c 100644
--- a/resources/css/ext.translate.editor.css
+++ b/resources/css/ext.translate.editor.css
@@ -8,7 +8,6 @@
.grid .tux-message-editor .close {
background: url( ../images/close.png ) no-repeat center center;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/close.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/close.svg );
padding: 16px;
@@ -25,14 +24,12 @@
.tux-message-editor .editor-contract {
background: url( ../images/contract-ltr.png ) no-repeat center center;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/contract-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/contract-ltr.svg );
}
.tux-message-editor .editor-expand {
background: url( ../images/expand-ltr.png ) no-repeat center center;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/expand-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/expand-ltr.svg );
}
@@ -230,7 +227,6 @@
.message-desc-edit {
background: url( ../images/action-edit.png ) left center no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/action-edit.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/action-edit.svg );
background-size: 18px 18px;
@@ -319,14 +315,12 @@
.tux-warning-message.validation {
background-image: url( ../images/label-flag.png );
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/label-flag.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/label-flag.svg );
}
.tux-warning-message.diff {
background-image: url( ../images/label-clock.png );
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/label-clock.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/label-clock.svg );
}
@@ -395,7 +389,6 @@
.tux-editor-insert-buttons .tux-editor-paste-original-button {
background: #fbfbfb url( ../images/paste.png ) left center no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/paste.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/paste.svg );
background-size: 16px 16px;
@@ -434,7 +427,6 @@
.tux-message-tools-menu li.selected {
background: url( ../images/label-tick.png ) right no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/label-tick.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/label-tick.svg );
color: #222;
diff --git a/resources/css/ext.translate.groupselector.css
b/resources/css/ext.translate.groupselector.css
index 11d60d1..95b039e 100644
--- a/resources/css/ext.translate.groupselector.css
+++ b/resources/css/ext.translate.groupselector.css
@@ -65,7 +65,6 @@
.tux-groupselector__filter__search__icon {
background: url( ../images/search.png ) no-repeat scroll right center
transparent;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/search.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/search.svg );
background-size: 25px;
@@ -133,7 +132,6 @@
.tux-grouplist__item__icon {
background: url( ../images/project.png ) no-repeat scroll right center
transparent;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/project.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/project.svg );
/* Keep this in sync with js! */
diff --git a/resources/css/ext.translate.loader.css
b/resources/css/ext.translate.loader.css
index 3d68c8c..2c6c561 100644
--- a/resources/css/ext.translate.loader.css
+++ b/resources/css/ext.translate.loader.css
@@ -21,7 +21,6 @@
.tux-loading-indicator {
float: left;
background: transparent url( ../images/loading.gif ) right bottom
no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/loading.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/loading.svg );
background-size: 100%;
diff --git a/resources/css/ext.translate.navitoggle.css
b/resources/css/ext.translate.navitoggle.css
index 5592dbb..3ade807 100644
--- a/resources/css/ext.translate.navitoggle.css
+++ b/resources/css/ext.translate.navitoggle.css
@@ -15,14 +15,12 @@
.tux-navitoggle {
background: url( ../images/expand-rtl.png ) no-repeat scroll right
center transparent;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/expand-rtl.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/expand-rtl.svg );
}
.tux-navi-collapsed .tux-navitoggle {
background: url( ../images/expand-ltr.png ) no-repeat scroll right
center transparent;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/expand-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/expand-ltr.svg );
}
diff --git a/resources/css/ext.translate.pagemode.css
b/resources/css/ext.translate.pagemode.css
index fa0982e..b9f6027 100644
--- a/resources/css/ext.translate.pagemode.css
+++ b/resources/css/ext.translate.pagemode.css
@@ -74,21 +74,18 @@
.tux-pagemode-status.fuzzy {
background: url( ../images/outdated-ltr.png ) left center no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/outdated-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/outdated-ltr.svg );
}
.tux-pagemode-status.untranslated {
background: url( ../images/translate-ltr.png ) left center no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/translate-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/translate-ltr.svg );
}
.tux-pagemode-action {
background: url( ../images/check-sprite-ltr.png ) right top no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/check-sprite-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/check-sprite-ltr.svg );
height: 31px;
@@ -101,7 +98,6 @@
.tux-pagemode-edit {
background-image: url( ../images/edit-mark.png );
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/edit-mark.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/edit-mark.svg );
background-repeat: no-repeat;
diff --git a/resources/css/ext.translate.proofread.css
b/resources/css/ext.translate.proofread.css
index bf4bb36..f947561 100644
--- a/resources/css/ext.translate.proofread.css
+++ b/resources/css/ext.translate.proofread.css
@@ -85,7 +85,6 @@
width: 18px;
height: 18px; /* Icon height + 3px */
background: url( ../images/user-small.png ) top right no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/user-small.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/user-small.svg );
}
@@ -96,7 +95,6 @@
.tux-proofread-status.fuzzy {
background: url( ../images/outdated-ltr.png ) left center no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/outdated-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/outdated-ltr.svg );
height: 40px;
@@ -104,7 +102,6 @@
.tux-proofread-status.untranslated {
background: url( ../images/translate-ltr.png ) left center no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/translate-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/translate-ltr.svg );
height: 40px;
@@ -114,7 +111,6 @@
background-position: right top;
background-repeat: no-repeat;
background-image: url( ../images/check-sprite-ltr.png );
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/check-sprite-ltr.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/check-sprite-ltr.svg );
/* There is 1px white row between each icon */
@@ -146,7 +142,6 @@
.tux-proofread-edit {
background-image: url( ../images/edit-mark.png );
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/edit-mark.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/edit-mark.svg );
background-repeat: no-repeat;
@@ -181,7 +176,6 @@
content: '';
display: inline-block;
background: url( ../images/check-small.png ) left bottom no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/check-small.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/check-small.svg );
height: 12px;
diff --git a/resources/css/ext.translate.special.aggregategroups.css
b/resources/css/ext.translate.special.aggregategroups.css
index 5355d4a..1075835 100644
--- a/resources/css/ext.translate.special.aggregategroups.css
+++ b/resources/css/ext.translate.special.aggregategroups.css
@@ -2,8 +2,6 @@
span.tp-aggregate-remove-button {
background: url( ../images/remove.png ) no-repeat scroll left center
transparent;
/* @embed */
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/remove.svg );
- /* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/remove.svg );
padding: 10px;
cursor: pointer;
@@ -11,8 +9,6 @@
span.tp-aggregate-edit-ag-button {
background: url( ../images/action-edit.png ) no-repeat scroll left
center transparent;
- /* @embed */
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/action-edit.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/action-edit.svg );
background-size: 18px 18px;
@@ -22,8 +18,6 @@
a.tpt-add-new-group {
background: url( ../images/add.png ) no-repeat scroll left center
transparent;
- /* @embed */
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/add.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/add.svg );
padding-left: 20px;
diff --git a/resources/css/ext.translate.special.managetranslatorsandbox.css
b/resources/css/ext.translate.special.managetranslatorsandbox.css
index 39e9538..2cd6838 100644
--- a/resources/css/ext.translate.special.managetranslatorsandbox.css
+++ b/resources/css/ext.translate.special.managetranslatorsandbox.css
@@ -22,7 +22,6 @@
.grid .search.pane {
background: url( ../images/search.png ) no-repeat scroll left top
transparent;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/search.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/search.svg );
background-size: 25px;
diff --git a/resources/css/ext.translate.special.pagemigration.css
b/resources/css/ext.translate.special.pagemigration.css
index 14411a4..bc5cec3 100644
--- a/resources/css/ext.translate.special.pagemigration.css
+++ b/resources/css/ext.translate.special.pagemigration.css
@@ -44,19 +44,16 @@
.mw-tpm-sp-action--delete {
background: url( ../images/trash_darkgray.png ) transparent no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/trash_darkgray.svg );
background-image: linear-gradient( transparent, transparent ), url(
../images/trash_darkgray.svg );
}
.mw-tpm-sp-action--swap {
background: url( ../images/switch.png ) transparent no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/switch.svg );
background-image: linear-gradient( transparent, transparent ), url(
../images/switch.svg );
}
.mw-tpm-sp-action--add {
background: url( ../images/plus_darkgray.png ) transparent no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/plus_darkgray.svg );
background-image: linear-gradient( transparent, transparent ), url(
../images/plus_darkgray.svg );
}
diff --git a/resources/css/ext.translate.special.translate.css
b/resources/css/ext.translate.special.translate.css
index 8f84173..8de825b 100644
--- a/resources/css/ext.translate.special.translate.css
+++ b/resources/css/ext.translate.special.translate.css
@@ -206,7 +206,6 @@
.tux-message-filter-wrapper {
background: url( ../images/search.png ) no-repeat scroll left center
transparent;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/search.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/search.svg );
background-size: 25px;
diff --git a/resources/css/ext.translate.workflowselector.css
b/resources/css/ext.translate.workflowselector.css
index b26f0b1..93a5577 100644
--- a/resources/css/ext.translate.workflowselector.css
+++ b/resources/css/ext.translate.workflowselector.css
@@ -47,7 +47,6 @@
.tux-workflow-status-selector li.selected {
background: url( ../images/label-tick.png ) right no-repeat;
- background-image: -webkit-linear-gradient( transparent, transparent ),
url( ../images/label-tick.svg );
/* @embed */
background-image: linear-gradient( transparent, transparent ), url(
../images/label-tick.svg );
color: #222;
diff --git a/resources/js/ext.translate.groupselector.js
b/resources/js/ext.translate.groupselector.js
index e387382..6c47a9c 100644
--- a/resources/js/ext.translate.groupselector.js
+++ b/resources/js/ext.translate.groupselector.js
@@ -537,9 +537,7 @@
}
if ( messagegroup.icon && messagegroup.icon.vector ) {
- style +=
- 'background-image:
-webkit-linear-gradient(transparent, transparent), url(--);' +
- 'background-image:
linear-gradient(transparent, transparent), url(--);';
+ style += 'background-image:
linear-gradient(transparent, transparent), url(--);';
style = style.replace( /--/g,
messagegroup.icon.vector );
}
--
To view, visit https://gerrit.wikimedia.org/r/393969
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I1469bce3dd6c6eed0d291a0cb8a19eceeaff4c10
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/Translate
Gerrit-Branch: master
Gerrit-Owner: Jforrester <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
