mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-11-05 20:59:26 +08:00
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>
127 lines
2.7 KiB
CSS
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;
|
|
}
|
|
}
|