Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: skin/desktop-options.css

Issue 29596663: Issue 5973 - broken icons on Firefox v50-53 (Closed)
Patch Set: Created Nov. 3, 2017, 5:48 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | skin/icons/attention.svg » ('j') | skin/icons/tooltip.svg » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: skin/desktop-options.css
===================================================================
--- a/skin/desktop-options.css
+++ b/skin/desktop-options.css
@@ -210,14 +210,22 @@
button.delete::before
{
- -webkit-mask: url(icons/trash.svg);
- mask: url(icons/trash.svg);
+ background-image: url(icons/trash.svg#default);
+}
+
+button.delete:hover::before
+{
+ background-image: url(icons/trash.svg#hover);
}
button.gear::before
{
- -webkit-mask: url(icons/gear.svg);
- mask: url(icons/gear.svg);
+ background-image: url(icons/gear.svg#default);
+}
+
+button.gear:hover::before
+{
+ background-image: url(icons/gear.svg#hover);
}
button.gear,
@@ -235,13 +243,6 @@
display: block;
height: 1.9rem;
width: 1.9rem;
- background-color: #099DD1;
-}
-
-button.gear:hover::before,
-button.delete:hover::before
-{
- background-color: #5CBCE1;
}
button.link,
@@ -376,17 +377,13 @@
[data-validation] .floating-input input:focus:invalid ~ .attention::before
{
- background-color: #C11D27;
- -webkit-mask: url(icons/attention.svg);
- mask: url(icons/attention.svg);
+ background-image: url(icons/attention.svg);
}
[data-validation] .floating-input input:valid ~ .attention::before
{
top: 0.8rem;
- background-color: green;
- -webkit-mask: url(icons/checkmark.svg);
- mask: url(icons/checkmark.svg);
+ background-image: url(icons/checkmark.svg#approve);
}
[data-validation] .floating-input input ~ .error-msg
@@ -873,9 +870,7 @@
content: "";
width: 1.3rem;
height: 1.3rem;
- background-color: #BBB;
- -webkit-mask: url(icons/checkmark.svg);
- mask: url(icons/checkmark.svg);
+ background-image: url(icons/checkmark.svg#default);
margin: 0rem;
}
@@ -908,9 +903,7 @@
width: 1.3rem;
height: 1.3rem;
display: block;
- background-color: #099DD1;
- -webkit-mask: url(icons/tooltip.svg);
- mask: url(icons/tooltip.svg);
+ background-image: url(icons/tooltip.svg);
}
/*
@@ -1178,32 +1171,27 @@
content: "";
height: 1.5rem;
width: 1.5rem;
- background-color: #099DD1;
margin: 0rem 1.1rem;
}
.context-menu .update-subscription::before
{
- -webkit-mask: url(icons/reload.svg);
- mask: url(icons/reload.svg);
+ background-image: url(icons/reload.svg);
}
.context-menu .website::before
{
- -webkit-mask: url(icons/globe.svg);
- mask: url(icons/globe.svg);
+ background-image: url(icons/globe.svg);
}
.context-menu .source::before
{
- -webkit-mask: url(icons/code.svg);
- mask: url(icons/code.svg);
+ background-image: url(icons/code.svg);
}
.context-menu .delete::before
{
- -webkit-mask: url(icons/trash.svg);
- mask: url(icons/trash.svg);
+ background-image: url(icons/trash.svg#default);
}
/*
@@ -1242,25 +1230,21 @@
width: 2.5rem;
height: 2.5rem;
content: "";
- background-color: #099DD1;
}
#twitter::before
{
- -webkit-mask: url("social/twitter.svg");
- mask: url("social/twitter.svg");
+ background-image: url("social/twitter.svg");
}
#facebook::before
{
- -webkit-mask: url("social/facebook.svg");
- mask: url("social/facebook.svg");
+ background-image: url("social/facebook.svg");
}
#google-plus::before
{
- -webkit-mask: url("social/googleplus.svg");
- mask: url("social/googleplus.svg");
+ background-image: url("social/googleplus.svg");
}
/*
@@ -1330,14 +1314,12 @@
height: 1rem;
width: 1rem;
border: 0rem;
- background-color: #FFF;
- -webkit-mask: url(icons/delete.svg);
- mask: url(icons/delete.svg);
+ background-image: url(icons/delete.svg#primary);
}
#dialog-close:hover::before
{
- background-color: #000;
+ background-image: url(icons/delete.svg#primary-hover);
}
#dialog #dialog-body
@@ -1459,10 +1441,10 @@
#hide-notification::after
{
- background-color: #099DD1;
+ background-image: url(icons/delete.svg#secondary);
}
#hide-notification:hover::after
{
- background-color: #5CBCE1;
+ background-image: url(icons/delete.svg#secondary-hover);
}
« no previous file with comments | « no previous file | skin/icons/attention.svg » ('j') | skin/icons/tooltip.svg » ('J')

Powered by Google App Engine
This is Rietveld