DevTools: improve $0 selected element hint in elements

third_party/WebKit/Source/devtools/front_end/elements/elementsTreeOutline.css

 /*
  * Copyright (c) 2014 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file.
  */
 
 .elements-disclosure {
     width: 100%;
     display: inline-block;
     line-height: normal;
 }
 
 .elements-disclosure li {
     /** Keep margin-left & padding-left in sync with ElementsTreeElements.updateDecorators **/
     padding: 0 0 0 14px;
     margin-top: 1px;
     margin-left: -2px;
     word-wrap: break-word;
     position: relative;
     min-height: 14px;
 }
 
 .elements-disclosure li.parent {
     /** Keep it in sync with ElementsTreeElements.updateDecorators **/
     margin-left: -13px;
 }
 
-.elements-disclosure li.selected:after {
+.elements-disclosure li.selected .selected-hint:before {
     font-style: italic;
     content: " == $0";
-    color: black;
     opacity: 0.6;
     position: absolute;
-}
-
-.elements-disclosure li.selected.editing-as-html:after {
-    display: none;
-}
-
-.elements-disclosure ol li.selected:focus:after {
-    color: white;
+    white-space: pre;
 }
 
 .elements-disclosure li.parent::before {
     box-sizing: border-box;
 }
 
 .elements-disclosure li.parent::before {
     -webkit-user-select: none;
     -webkit-mask-image: url(Images/treeoutlineTriangles.png);
     -webkit-mask-size: 32px 24px;
@@ skipping 304 matching lines @@
     border-color: hsla(0,0%,0%,0.1);
 }
 
 .elements-tree-outline ol.shadow-root {
     border-color: hsla(0,0%,80%,1);
 }
 
 li.selected:not(.always-parent) + ol.children {
     border-color: hsla(216,68%,80%,1) !important;
 }