Files
react-native-devtools-frontend/front_end/console/consoleSidebar.css
T
Jack Franklin 49a9481a74 Lint color usage in background and border-* properties.
The list of CSS properties we check for colors wasn't thorough and
didn't include `border-left/right/top/bottom` or `background` on its
own. This CL fixes that and disables the rule for any current
violations.

Bug: 1152736
Change-Id: Ic732d653fdfab0462a04dc891bcece1f44e5d471
No-Presubmit: true
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2676157
Reviewed-by: Paul Lewis <aerotwist@chromium.org>
Commit-Queue: Paul Lewis <aerotwist@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
2021-02-05 15:39:39 +00:00

83 lines
1.9 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.
*/
:host {
overflow: auto;
background-color: var(--toolbar-bg-color);
}
.tree-outline-disclosure {
max-width: 100%;
padding-left: 6px;
}
.count {
flex: none;
margin: 0 8px;
}
[is=ui-icon] {
margin: 0 5px;
}
[is=ui-icon].icon-mask {
background-color: #555; /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
}
li {
height: 24px;
}
li .largeicon-navigator-file {
background: linear-gradient(45deg, hsl(48deg 70% 50%), hsl(48deg 70% 70%)); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
margin: 0;
}
li .largeicon-navigator-folder {
background: linear-gradient(45deg, hsl(210deg 82% 65%), hsl(210deg 82% 80%)); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
margin: -3px -3px 0 -5px;
}
.tree-element-title {
flex-shrink: 100;
flex-grow: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.tree-outline li:hover:not(.selected) .selection {
display: block;
background-color: var(--item-hover-color);
}
@media (forced-colors: active) {
[is=ui-icon].icon-mask {
background-color: ButtonText;
}
.tree-outline li:hover:not(.selected) .selection {
forced-color-adjust: none;
background-color: Highlight;
}
.tree-outline li:hover .tree-element-title,
.tree-outline li.selected .tree-element-title,
.tree-outline li:hover .count,
.tree-outline li.selected .count {
forced-color-adjust: none;
color: HighlightText;
}
.tree-outline li:hover [is=ui-icon].icon-mask,
.tree-outline li.selected [is=ui-icon].icon-mask,
.tree-outline li.selected:focus .spritesheet-mediumicons:not(.icon-mask) {
background-color: HighlightText !important;
}
}