Devtools UI: Add node-specific actions into a ghost toolbar in DOM

Source/devtools/front_end/elements/breadcrumbs.css

Index: Source/devtools/front_end/elements/breadcrumbs.css
diff --git a/Source/devtools/front_end/elements/breadcrumbs.css b/Source/devtools/front_end/elements/breadcrumbs.css
index 1eb9159e59ba8e51956a4e95632ebabe7b0aa362..74cec40b24c31964a29aaa0d686f4657446a6e56 100644
--- a/Source/devtools/front_end/elements/breadcrumbs.css
+++ b/Source/devtools/front_end/elements/breadcrumbs.css
@@ -20,28 +20,6 @@
     white-space: nowrap;
 }
 
-:host-context(.material) .crumb {
-    padding: 0px 4px 0px 11px;
-    cursor: pointer;
-    line-height: 18px;
-    margin: 4px 0px;
-    position: relative;
-    color: hsl(0, 0%, 35%);
-}
-
-:host-context(.material) .crumb:not(.collapsed):first-child {
-    padding-left: 2px;
-}
-
-:host-context(.material) .crumb:not(.collapsed):not(:first-child):before {
-    content: "\27E9";
-    position: absolute;
-    left: 0px;
-    color: hsl(0, 0%, 35%);
-    width: 7px;
-    text-align: center;
-}
-
 .crumbs .crumb.collapsed > * {
     display: none;
 }
@@ -61,20 +39,6 @@
     text-shadow: rgba(255, 255, 255, 0.5) 0 0 0;
 }
 
-:host-context(.material) .crumb.selected {
-    color: hsl(0, 0%, 35%);
-    background-color: transparent !important;
-}
-
-:host-context(.material) .crumb.selected:before {
-    color: hsl(217, 89%, 61%) !important;
-}
-
 .crumbs .crumb:hover {
     background-color: rgb(216, 216, 216);
 }
-
-:host-context(.material) .crumb:hover {
-    background-color: transparent;
-    color: hsl(0, 0%, 20%) !important;
-}