mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-09-30 01:07:01 +08:00
Accessibility testing revealed the following issues within the tool: 1. no focus indicator on javascript VM instances list This change: changes current selected/hover and adds selected but inactive color to match treeoutline in Element Bug: 963183 Workflow gif: https://imgur.com/a/lHNTOP7 Change-Id: Iaed79d7166bf70011711be548ba66c65a57922da Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1678946 Commit-Queue: Junyi Xiao <juxiao@microsoft.com> Reviewed-by: Alexei Filippov <alph@chromium.org> Cr-Original-Commit-Position: refs/heads/master@{#690483} Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src Cr-Mirrored-Commit: 522709bc5b3158fdaef516f391d382d7321e505f
33 lines
885 B
CSS
33 lines
885 B
CSS
li .icon {
|
|
margin: -3px -5px -3px -5px;
|
|
background: linear-gradient(45deg, hsl(0, 0%, 50%), hsl(0, 0%, 70%));
|
|
}
|
|
|
|
.tree-outline li {
|
|
min-height: 20px;
|
|
}
|
|
|
|
.tree-outline li:hover:not(.selected) .selection {
|
|
display: block;
|
|
background-color: var(--item-hover-color);
|
|
}
|
|
|
|
.navigator-fs-tree-item .icon{
|
|
background: linear-gradient(45deg, hsl(28, 75%, 50%), hsl(28, 75%, 70%));
|
|
}
|
|
|
|
.navigator-sm-script-tree-item .icon,
|
|
.navigator-script-tree-item .icon,
|
|
.navigator-snippet-tree-item .icon {
|
|
background: linear-gradient(45deg, hsl(48, 70%, 50%), hsl(48, 70%, 70%));
|
|
}
|
|
|
|
.navigator-sm-stylesheet-tree-item .icon,
|
|
.navigator-stylesheet-tree-item .icon {
|
|
background: linear-gradient(45deg, hsl(256, 50%, 50%), hsl(256, 50%, 70%));
|
|
}
|
|
|
|
.navigator-image-tree-item .icon,
|
|
.navigator-font-tree-item .icon {
|
|
background: linear-gradient(45deg, hsl(109, 33%, 50%), hsl(109, 33%, 70%));
|
|
} |