Bug 1552987 - Jump-to-function-definition buttons are no longer visible in the console. r=nchevobbe a=jcristau
authorJason Laster <jlaster@mozilla.com>
Tue, 21 May 2019 16:54:56 +0000
changeset 536441 3f85c8cde30cc0ac36c57242e9abd01e347066d7
parent 536440 54ff09f869d8e81bda1bf1c76816e8c6792ccf66
child 536442 80259caee8e3b023f2c2a638c59f20334646679d
push id2082
push userffxbld-merge
push dateMon, 01 Jul 2019 08:34:18 +0000
treeherdermozilla-release@2fb19d0466d2 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersnchevobbe, jcristau
bugs1552987
milestone68.0
Bug 1552987 - Jump-to-function-definition buttons are no longer visible in the console. r=nchevobbe a=jcristau Differential Revision: https://phabricator.services.mozilla.com/D32003
devtools/client/debugger/packages/devtools-reps/src/object-inspector/components/ObjectInspector.css
devtools/client/debugger/packages/devtools-reps/src/reps/reps.css
devtools/client/shared/components/reps/reps.css
--- a/devtools/client/debugger/packages/devtools-reps/src/object-inspector/components/ObjectInspector.css
+++ b/devtools/client/debugger/packages/devtools-reps/src/object-inspector/components/ObjectInspector.css
@@ -46,13 +46,12 @@
   margin-inline-start: -1px;
 }
 
 /* Focused styles */
 .tree.object-inspector .tree-node.focused * {
   color: inherit;
 }
 
-.tree-node.focused button.jump-definition,
 .tree-node.focused button.open-inspector,
 .tree-node.focused button.invoke-getter {
   background-color: currentColor;
 }
--- a/devtools/client/debugger/packages/devtools-reps/src/reps/reps.css
+++ b/devtools/client/debugger/packages/devtools-reps/src/reps/reps.css
@@ -263,27 +263,35 @@ button.open-inspector {
 .open-inspector:hover {
   background-color: var(--theme-icon-checked-color);
 }
 
 /******************************************************************************/
 /* Jump to definition button */
 
 button.jump-definition {
-  mask: url(resource://devtools/client/shared/components/reps/images/jump-definition.svg)
-    no-repeat;
   display: inline-block;
-  background-color: var(--theme-icon-color);
   height: 16px;
   margin-left: 0.25em;
   vertical-align: middle;
+  background: 0% 50%
+    url("resource://devtools/client/shared/components/reps/images/jump-definition.svg")
+    no-repeat;
+  border-color: transparent;
+  stroke: var(--theme-icon-color);
+  -moz-context-properties: stroke;
+  cursor: pointer;
 }
 
 .jump-definition:hover {
-  background-color: var(--theme-icon-checked-color);
+  stroke: var(--theme-icon-checked-color);
+}
+
+.tree-node.focused .jump-definition {
+  stroke: currentColor;
 }
 
 /******************************************************************************/
 /* Invoke getter button */
 
 button.invoke-getter {
   mask: url(resource://devtools/client/shared/components/reps/images/input.svg)
     no-repeat;
--- a/devtools/client/shared/components/reps/reps.css
+++ b/devtools/client/shared/components/reps/reps.css
@@ -358,27 +358,35 @@ button.open-inspector {
 .open-inspector:hover {
   background-color: var(--theme-icon-checked-color);
 }
 
 /******************************************************************************/
 /* Jump to definition button */
 
 button.jump-definition {
-  mask: url("resource://devtools/client/shared/components/reps/images/jump-definition.svg")
-    no-repeat;
   display: inline-block;
-  background-color: var(--theme-icon-color);
   height: 16px;
   margin-left: 0.25em;
   vertical-align: middle;
+  background: 0% 50%
+    url("resource://devtools/client/shared/components/reps/images/jump-definition.svg")
+    no-repeat;
+  border-color: transparent;
+  stroke: var(--theme-icon-color);
+  -moz-context-properties: stroke;
+  cursor: pointer;
 }
 
 .jump-definition:hover {
-  background-color: var(--theme-icon-checked-color);
+  stroke: var(--theme-icon-checked-color);
+}
+
+.tree-node.focused .jump-definition {
+  stroke: currentColor;
 }
 
 /******************************************************************************/
 /* Invoke getter button */
 
 button.invoke-getter {
   mask: url("resource://devtools/client/shared/components/reps/images/input.svg")
     no-repeat;
@@ -446,13 +454,12 @@ button.invoke-getter {
   margin-inline-start: -1px;
 }
 
 /* Focused styles */
 .tree.object-inspector .tree-node.focused * {
   color: inherit;
 }
 
-.tree-node.focused button.jump-definition,
 .tree-node.focused button.open-inspector,
 .tree-node.focused button.invoke-getter {
   background-color: currentColor;
 }