Bug 1399841 - use themed SVG filter for all DevTools active icons;r=pbro
authorJulian Descottes <jdescottes@mozilla.com>
Thu, 14 Sep 2017 16:18:55 +0200
changeset 430411 a413fc1e540f6e6c2d332f450fcecf10616f55b8
parent 430410 291700116d62b23439ce9733b1d2f97733db8d1e
child 430412 0d5051ae4f943ff69f2d5dbda9bc683bc6e9a6a2
push id7761
push userjlund@mozilla.com
push dateFri, 15 Sep 2017 00:19:52 +0000
treeherdermozilla-beta@c38455951db4 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspbro
bugs1399841
milestone57.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1399841 - use themed SVG filter for all DevTools active icons;r=pbro MozReview-Commit-ID: L8vApFvHLGo
devtools/client/shared/widgets/filter-widget.css
devtools/client/themes/animationinspector.css
devtools/client/themes/rules.css
devtools/client/themes/webconsole.css
devtools/client/themes/widgets.css
--- a/devtools/client/shared/widgets/filter-widget.css
+++ b/devtools/client/shared/widgets/filter-widget.css
@@ -230,10 +230,10 @@
 
 #filter-container .add,
 #filter-container .remove-button,
 #toggle-presets {
   filter: var(--theme-icon-filter);
 }
 
 .show-presets #toggle-presets {
-  filter: url(chrome://devtools/skin/images/filters.svg#checked-icon-state);
+  filter: var(--theme-icon-checked-filter);
 }
--- a/devtools/client/themes/animationinspector.css
+++ b/devtools/client/themes/animationinspector.css
@@ -531,22 +531,22 @@ body {
 .animation-target .node-highlighter {
   background: url("chrome://devtools/skin/images/vview-open-inspector.png") no-repeat 0 0;
   padding-left: 16px;
   margin-right: 5px;
   cursor: pointer;
 }
 
 .animation-target .node-highlighter:hover {
-  filter: url(images/filters.svg#checked-icon-state);
+  filter: var(--theme-icon-checked-filter);
 }
 
 .animation-target .node-highlighter:active,
 .animation-target .node-highlighter.selected {
-  filter: url(images/filters.svg#checked-icon-state) brightness(0.9);
+  filter: var(--theme-icon-checked-filter) brightness(0.9);
 }
 
 /* Inline keyframes info in the timeline */
 
 .animation-detail .animated-properties .property {
   height: var(--detail-animation-height);
   position: relative;
 }
--- a/devtools/client/themes/rules.css
+++ b/devtools/client/themes/rules.css
@@ -596,24 +596,24 @@
 .ruleview-selectorhighlighter {
   background: url("chrome://devtools/skin/images/vview-open-inspector.png") no-repeat 0 0;
   padding-left: 16px;
   margin-left: 5px;
   cursor: pointer;
 }
 
 .ruleview-selectorhighlighter:hover {
-  filter: url(images/filters.svg#checked-icon-state);
+  filter: var(--theme-icon-checked-filter);
 }
 
 .ruleview-grid.active,
 .ruleview-selectorhighlighter:active,
 .ruleview-selectorhighlighter.highlighted,
 .ruleview-shape.active {
-  filter: url(images/filters.svg#checked-icon-state) brightness(0.9);
+  filter: var(--theme-icon-checked-filter) brightness(0.9);
 }
 
 #ruleview-add-rule-button::before {
   background-image: url("chrome://devtools/skin/images/add.svg");
 }
 
 #pseudo-class-panel-toggle::before {
   background-image: url("chrome://devtools/skin/images/pseudo-class.svg");
--- a/devtools/client/themes/webconsole.css
+++ b/devtools/client/themes/webconsole.css
@@ -604,22 +604,22 @@ a.learn-more-link.webconsole-learn-more-
   background: url("chrome://devtools/skin/images/vview-open-inspector.png") no-repeat 0 0;
   padding-left: 16px;
   margin-left: 5px;
   cursor: pointer;
 }
 
 .elementNode:hover .open-inspector,
 .open-inspector:hover {
-  filter: url(images/filters.svg#checked-icon-state);
+  filter: var(--theme-icon-checked-filter);
 }
 
 .elementNode:hover .open-inspector:active,
 .open-inspector:active {
-  filter: url(images/filters.svg#checked-icon-state) brightness(0.9);
+  filter: var(--theme-icon-checked-filter) brightness(0.9);
 }
 
 /* Old console frontend filters */
 .devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
   -moz-appearance: none;
   color: inherit;
   border-width: 0;
   -moz-box-orient: horizontal;
--- a/devtools/client/themes/widgets.css
+++ b/devtools/client/themes/widgets.css
@@ -823,23 +823,23 @@ widgets.css is overwritten. */
   height: 16px;
   background-size: cover;
   cursor: pointer;
 }
 
 .variables-view-delete:hover,
 .variables-view-edit:hover,
 .variables-view-open-inspector:hover {
-  filter: url(images/filters.svg#checked-icon-state);
+  filter: var(--theme-icon-checked-filter);
 }
 
 .variables-view-delete:active,
 .variables-view-edit:active,
 .variables-view-open-inspector:active {
-  filter: url(images/filters.svg#checked-icon-state) brightness(0.9);
+  filter: var(--theme-icon-checked-filter) brightness(0.9);
 }
 
 .variable-or-property:focus > .title > .variables-view-delete,
 .variable-or-property:focus > .title > .variables-view-edit,
 .variable-or-property:focus > .title > .variables-view-open-inspector {
   filter: none;
 }