Files
react-native-devtools-frontend/front_end/object_ui/objectValue.css
T
Mathias Bynens 91c67413a6 Improve contrast for null and undefined values
Any `null` and `undefined` values logged to the Console are styled
in grey. This patch tweaks the shade of grey used in order to bring
the contrast to an acceptable level, for the light theme and the dark
theme alike.

Bug: chromium:1066415
Change-Id: I5e410013dbf6e87a7018e68c487f9e5d44993f6c
Fixed: chromium:1083126
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2203442
Commit-Queue: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
2020-05-15 08:14:16 +00:00

127 lines
2.7 KiB
CSS

/*
* Copyright 2015 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.
*/
.object-value-scientific-notation-exponent {
flex-shrink: 0;
}
.object-value-scientific-notation-mantissa {
overflow: hidden;
text-overflow: ellipsis;
flex-shrink: 1;
min-width: 1ex;
}
.object-value-scientific-notation-number {
display: flex !important;
}
.value.object-value-node:hover {
background-color: var(--item-hover-color);
}
.object-value-function-prefix,
.object-value-boolean {
color: rgb(13, 34, 170);
}
.object-value-function {
font-style: italic;
}
.object-value-function.linkified:hover {
background-color: rgba(0, 0, 0, 0.1);
cursor: pointer;
}
.object-value-number {
color: rgb(28, 0, 207);
}
.object-value-bigint {
color: rgb(0, 93, 0);
}
.object-value-string,
.object-value-regexp,
.object-value-symbol {
white-space: pre;
unicode-bidi: -webkit-isolate;
color: rgb(196, 26, 22);
}
.-theme-with-dark-background .object-value-string,
:host-context(.-theme-with-dark-background) .object-value-string,
.-theme-with-dark-background .object-value-regexp,
:host-context(.-theme-with-dark-background) .object-value-regexp,
.-theme-with-dark-background .object-value-symbol,
:host-context(.-theme-with-dark-background) .object-value-symbol {
color: rgb(242, 139, 84);
}
.object-value-string-quote {
color: #222;
}
.object-value-node {
position: relative;
vertical-align: baseline;
color: rgb(48, 57, 66);
display: inline-block;
}
.object-value-null,
.object-value-undefined {
color: rgb(94 94 94);
}
.-theme-with-dark-background .object-value-null,
:host-context(.-theme-with-dark-background) .object-value-null,
.-theme-with-dark-background .object-value-undefined,
:host-context(.-theme-with-dark-background) .object-value-undefined {
color: rgb(161 161 161);
}
.object-value-calculate-value-button:hover {
text-decoration: underline;
}
.object-properties-section-custom-section {
display: inline-flex;
flex-direction: column;
}
.-theme-with-dark-background .object-value-number,
:host-context(.-theme-with-dark-background) .object-value-number,
.-theme-with-dark-background .object-value-boolean,
:host-context(.-theme-with-dark-background) .object-value-boolean {
color: hsl(252, 100%, 75%);
}
.object-properties-section .object-description {
color: gray;
}
.value .object-properties-preview {
white-space: nowrap;
}
.name {
color: rgb(136, 19, 145);
flex-shrink: 0;
}
.object-properties-preview .name {
color: #565656;
}
@media (forced-colors: active) {
.object-value-calculate-value-button:hover {
forced-color-adjust: none;
color: Highlight;
}
}