zzos/react-native-devtools-frontend
1
0
Fork 0
mirror of https://github.com/react/react-native-devtools-frontend.git synced 2026-10-13 01:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

[DarkMode] more small files

Browse Source 
* xhrBreakpointsSidebarPane.css
* sensors.css
* profilesSidebarTree.css
* watchExpressionsSidebarPane.css

Bug: chromium:1152736
Change-Id: I7c2ae46b94cfb6b331e19cf652bfae4586c1e16b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2916381
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
This commit is contained in:
Jack Franklin
2021-05-25 12:04:06 +00:00
committed by Devtools-frontend LUCI CQ
parent d74e151c60
commit 3f4f4db4e5
8 changed files with 40 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front_end/panels/browser_debugger/XHRBreakpointsSidebarPane.ts
+1 -1
View File
@@ -78,7 +78,7 @@ export class XHRBreakpointsSidebarPane extends UI.Widget.VBox implements UI.Cont
private constructor() {
super(true);
this.registerRequiredCSS('panels/browser_debugger/xhrBreakpointsSidebarPane.css', {enableLegacyPatching: true});
this.registerRequiredCSS('panels/browser_debugger/xhrBreakpointsSidebarPane.css', {enableLegacyPatching: false});
this._breakpoints = new UI.ListModel.ListModel();
this._list = new UI.ListControl.ListControl(this._breakpoints, this, UI.ListControl.ListMode.NonViewport);
front_end/panels/browser_debugger/xhrBreakpointsSidebarPane.css
+10 -10
View File
@@ -26,8 +26,7 @@
margin-left: 0;
margin-right: 0;
outline: none !important; /* stylelint-disable-line declaration-no-important */
border: 1px solid rgb(66% 66% 66%); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
border: 1px solid var(--color-background-elevation-2);
}
.breakpoint-entry {
@@ -36,8 +35,7 @@
}
.breakpoint-list .breakpoint-entry:hover {
background-color: #eee; /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
background-color: var(--color-background-elevation-1);
}
.breakpoint-list .breakpoint-entry:focus-visible {
@@ -49,15 +47,17 @@
}
.breakpoint-hit {
background-color: rgb(255 255 194); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
border-right: 3px solid rgb(107 97 48); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
--override-breakpoint-hit-background-color: rgb(255 255 194);
--override-breakpoint-hit-border-color: rgb(107 97 48);
background-color: var(--override-breakpoint-hit-background-color);
border-right: 3px solid var(--override-breakpoint-hit-border-color);
}
.-theme-with-dark-background .breakpoint-hit,
:host-context(.-theme-with-dark-background) .breakpoint-hit {
background-color: hsl(46deg 98% 22%);
color: #ccc;
--override-breakpoint-hit-background-color: hsl(46deg 98% 22%);
--override-breakpoint-hit-border-color: #ccc;
}
@media (forced-colors: active) {
front_end/panels/emulation/SensorsView.ts
+1 -1
View File
@@ -208,7 +208,7 @@ export class SensorsView extends UI.Widget.VBox {
constructor() {
super(true);
this.registerRequiredCSS('panels/emulation/sensors.css', {enableLegacyPatching: true});
this.registerRequiredCSS('panels/emulation/sensors.css', {enableLegacyPatching: false});
this.contentElement.classList.add('sensors-view');
this._LocationSetting = Common.Settings.Settings.instance().createSetting('emulation.locationOverride', '');
front_end/panels/emulation/sensors.css
+14 -6
View File
@@ -17,8 +17,7 @@
}
.sensors-view input[readonly] {
background-color: rgb(235 235 228); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
background-color: var(--color-background-elevation-1);
}
.sensors-view fieldset {
@@ -84,17 +83,27 @@
}
.orientation-stage {
--override-gradient-color-1: #e1f5fe;
--override-gradient-color-2: #b0ebf3;
--override-gradient-color-3: #def6f9;
perspective: 700px;
perspective-origin: 50% 50%;
width: 160px;
height: 150px;
background: linear-gradient(#e1f5fe 0%, #e1f5fe 64%, #b0ebf3 64%, #def6f9 100%); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
background: linear-gradient(var(--override-gradient-color-1) 0%, var(--override-gradient-color-1) 64%, var(--override-gradient-color-2) 64%, var(--override-gradient-color-3) 100%);
transition: 0.2s ease opacity, 0.2s ease filter;
overflow: hidden;
margin-bottom: 10px;
}
.-theme-with-dark-background .orientation-stage,
:host-context(.-theme-with-dark-background) .orientation-stage {
--override-gradient-color-1: rgb(1 21 30);
--override-gradient-color-2: rgb(12 71 79);
--override-gradient-color-3: rgb(6 30 33);
}
.orientation-stage.disabled {
filter: grayscale();
opacity: 50%;
@@ -280,8 +289,7 @@ fieldset.device-orientation-override-section {
.panel-section-separator {
height: 2px;
margin-bottom: 8px;
background: #f1f1f1; /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
background: var(--color-background-elevation-2);
}
button.text-button {
front_end/panels/profiler/ProfilesPanel.ts
+1 -1
View File
@@ -110,7 +110,7 @@ export class ProfilesPanel extends UI.Panel.PanelWithSidebar implements DataDisp
this.profilesItemTreeElement = new ProfilesSidebarTreeElement(this);
this._sidebarTree = new UI.TreeOutline.TreeOutlineInShadow();
this._sidebarTree.registerRequiredCSS('panels/profiler/profilesSidebarTree.css', {enableLegacyPatching: true});
this._sidebarTree.registerRequiredCSS('panels/profiler/profilesSidebarTree.css', {enableLegacyPatching: false});
this._sidebarTree.element.classList.add('profiles-sidebar-tree-box');
this.panelSidebarElement().appendChild(this._sidebarTree.element);
front_end/panels/profiler/profilesSidebarTree.css
+2 -4
View File
@@ -37,10 +37,8 @@ ol.tree-outline {
padding: 0 10px;
white-space: nowrap;
margin-top: 1px;
color: rgb(92 110 129); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
text-shadow: rgb(255 255 255 / 75%) 0 1px 0; /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
color: var(--color-text-secondary);
text-shadow: var(--color-background-opacity-80) 0 1px 0;
line-height: 18px;
}
front_end/panels/sources/WatchExpressionsSidebarPane.ts
+2 -2
View File
@@ -99,7 +99,7 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
private constructor() {
super(true);
this.registerRequiredCSS('ui/legacy/components/object_ui/objectValue.css', {enableLegacyPatching: false});
this.registerRequiredCSS('panels/sources/watchExpressionsSidebarPane.css', {enableLegacyPatching: true});
this.registerRequiredCSS('panels/sources/watchExpressionsSidebarPane.css', {enableLegacyPatching: false});
// TODO(szuend): Replace with a Set once the web test
// panels/sources/debugger-ui/watch-expressions-preserve-expansion.js is either converted
@@ -119,7 +119,7 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
this.contentElement.addEventListener('contextmenu', this._contextMenu.bind(this), false);
this._treeOutline = new ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeOutline();
this._treeOutline.registerRequiredCSS(
'panels/sources/watchExpressionsSidebarPane.css', {enableLegacyPatching: true});
'panels/sources/watchExpressionsSidebarPane.css', {enableLegacyPatching: false});
this._treeOutline.setShowSelectionOnKeyboardFocus(/* show */ true);
this._expandController =
new ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController(this._treeOutline);
front_end/panels/sources/watchExpressionsSidebarPane.css
+9 -9
View File
@@ -48,21 +48,22 @@
}
.watch-expressions .name {
color: rgb(136 19 145); /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
--override-watch-expression-name-color: rgb(136 19 145);
color: var(--override-watch-expression-name-color);
flex: none;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.watch-expression-error {
color: #f00; /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
.-theme-with-dark-background .watch-expressions .name,
:host-context(.-theme-with-dark-background) .watch-expressions .name {
--override-watch-expression-name-color: rgb(227 110 236);
}
:host-context(.-theme-with-dark-background) .watch-expression-error {
color: hsl(0deg 100% 65%);
.watch-expression-error {
color: var(--color-red);
}
.watch-expressions-separator {
@@ -100,8 +101,7 @@ li.watch-expression-tree-item {
}
li.watch-expression-tree-item:hover {
background-color: #f0f0f0; /* stylelint-disable-line plugin/use_theme_colors */
/* See: crbug.com/1152736 for color variable migration. */
background-color: var(--color-background-elevation-2);
}
.watch-expression-header:focus-visible {