DevTools: Use real focus in TreeOutline

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;
@@ skipping 19 matching lines @@
     content: " == $0";
     color: black;
     opacity: 0.6;
     position: absolute;
 }
 
 .elements-disclosure li.selected.editing-as-html:after {
     display: none;
 }
 
-.elements-disclosure ol:focus li.selected:after {
+.elements-disclosure ol li.selected:focus:after {
     color: white;
 }
 
 .elements-disclosure li.parent::before {
     box-sizing: border-box;
 }
 
 .elements-disclosure li.parent::before {
     -webkit-user-select: none;
     -webkit-mask-image: url(Images/toolbarButtonGlyphs.png);
@@ skipping 62 matching lines @@
 
 .elements-disclosure > ol {
     position: relative;
     margin: 0;
     cursor: default;
     min-width: 100%;
     min-height: 100%;
     padding-left: 2px;
 }
 
-.elements-disclosure ol:focus li.selected {
+.elements-disclosure ol li.selected:focus {
     color: white;
 }
 
-.elements-disclosure ol:focus li.parent.selected::before {
+.elements-disclosure ol li.parent.selected:focus::before {
     background-color: white;
 }
 
-.elements-disclosure ol:focus li.selected * {
+.elements-disclosure ol li.selected:focus * {
     color: inherit;
 }
 
-.elements-disclosure ol:focus li.selected .selection {
+.elements-disclosure ol li.selected:focus .selection {
     background-color: rgb(56, 121, 217);
 }
 
 .elements-tree-outline ol.shadow-root-depth-4 {
     background-color: rgba(0, 0, 0, 0.04);
 }
 
 .elements-tree-outline ol.shadow-root-depth-3 {
     background-color: rgba(0, 0, 0, 0.03);
 }
@@ skipping 150 matching lines @@
 
 ol:hover > li > .elements-tree-shortcut-link {
     display: initial;
 }
 
 .elements-tree-shortcut-link {
     color: rgb(87, 87, 87);
     display: none;
 }
 
-ol:focus li.selected .webkit-html-tag {
+ol li.selected:focus .webkit-html-tag {
     color: #a5a5a5;
 }
 
-ol:focus li.selected .webkit-html-tag-name,
-ol:focus li.selected .webkit-html-close-tag-name,
-ol:focus li.selected .webkit-html-attribute-value,
-ol:focus li.selected .devtools-link {
+ol li.selected:focus .webkit-html-tag-name,
+ol li.selected:focus .webkit-html-close-tag-name,
+ol li.selected:focus .webkit-html-attribute-value,
+ol li.selected:focus .devtools-link {
     color: white;
 }
 
-ol:focus li.selected .webkit-html-attribute-name {
+ol li.selected:focus .webkit-html-attribute-name {
     color: #ccc;
 }
 
 .elements-disclosure .gutter-container {
     position: absolute;
     top: 0;
 }
 
 .elements-disclosure li.selected .gutter-container:not(.has-decorations) {
     left: 0px;
@@ skipping 30 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;
 }