Files
react-native-devtools-frontend/front_end/changes/changesSidebar.css
T
Kalon Hinds 1574c49c4f High contrast support for Changes Panel
This patch provides forced-colors overrides to make sidebar icons
on the changes panel visible in high contrast mode.

Screenshots: https://imgur.com/a/GG665sc
Bug: 1048378
Change-Id: I6f285eca8abafc40de17a8606a5f9c59aea0a384
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2107112
Commit-Queue: Kalon Hinds <kahinds@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
2020-03-18 22:24:39 +00:00

50 lines
1.3 KiB
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%));
}
@media (forced-colors: active) {
li .icon,
.navigator-fs-tree-item .icon,
.navigator-sm-script-tree-item .icon,
.navigator-script-tree-item .icon,
.navigator-snippet-tree-item .icon,
.navigator-sm-stylesheet-tree-item .icon,
.navigator-stylesheet-tree-item .icon,
.navigator-image-tree-item .icon,
.navigator-font-tree-item .icon {
background-color: ButtonText;
background-image: none;
forced-color-adjust: none;
}
}