mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-01 01:38:07 +08:00
Changhao Han
bb4af12377
This CL fixes two issues: 1. The traditional list of Computed styles could not be navigated via ARIA tree keyboard navigations, due to recent componentization changes. 2. The grouped list was not ARIA-tree-navigatable either. Bug: chromium:1125511, chromium:1125958 Change-Id: I2fd29ccf7e85019615d5a9fe7fab7647a44c02e9 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2403320 Reviewed-by: Jack Franklin <jacktfranklin@chromium.org> Reviewed-by: Alex Rudenko <alexrudenko@chromium.org> Commit-Queue: Changhao Han <changhaohan@chromium.org>
67 lines
1.4 KiB
CSS
67 lines
1.4 KiB
CSS
/*
|
|
* Copyright (c) 2017 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.
|
|
*/
|
|
|
|
.tree-outline,
|
|
.tree-outline ol {
|
|
padding-left: 0;
|
|
}
|
|
|
|
.tree-outline li:hover {
|
|
background-color: var(--focus-bg-color);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.tree-outline li::before {
|
|
margin: 0 -1px 0 4px;
|
|
}
|
|
|
|
.group-title {
|
|
/* tree-outline li::before is set to be 16px wide */
|
|
padding-right: 16px;
|
|
}
|
|
|
|
.tree-outline li.group-title:hover {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.group-title > h1 {
|
|
margin: 1px 0 0 0;
|
|
padding: 1em 0;
|
|
width: 100%;
|
|
cursor: pointer;
|
|
color: #5f6368;
|
|
font-size: 11px;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.group-title:not(.first-group) > h1 {
|
|
border-top: 1px solid var(--divider-color);
|
|
}
|
|
|
|
:host-context(.-theme-with-dark-background) .group-title > h1 {
|
|
color: #e8eaed;
|
|
}
|
|
|
|
.group-title + ol.children {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
@media (forced-colors: active) {
|
|
:host-context(.monospace.computed-properties) .tree-outline li:hover {
|
|
forced-color-adjust: none;
|
|
background-color: Highlight;
|
|
}
|
|
|
|
:host-context(.monospace.computed-properties) .tree-outline:not(.hide-selection-when-blurred) li.parent:hover.selected::before,
|
|
:host-context(.monospace.computed-properties) .tree-outline-disclosure li.parent:hover::before {
|
|
background-color: HighlightText;
|
|
}
|
|
|
|
:host-context(.monospace.computed-properties) .tree-outline li:hover * {
|
|
color: HighlightText;
|
|
}
|
|
}
|