Skip to content

Commit cccb3b5

Browse files
author
Brian Vaughn
committed
Updated scheduling profiler theme colors
1 parent 6522e17 commit cccb3b5

File tree

1 file changed

+51
-50
lines changed

1 file changed

+51
-50
lines changed

‎packages/react-devtools-shared/src/constants.js

Lines changed: 51 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -135,46 +135,43 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
135135
'--color-record-active': '#fc3a4b',
136136
'--color-record-hover': '#3578e5',
137137
'--color-record-inactive': '#0088fa',
138-
'--color-resize-bar': '#cccccc',
138+
'--color-resize-bar': '#eeeeee',
139+
'--color-resize-bar-active': '#dcdcdc',
140+
'--color-resize-bar-border': '#d1d1d1',
141+
'--color-resize-bar-dot': '#333333',
139142
'--color-scheduling-profiler-native-event': '#ccc',
140143
'--color-scheduling-profiler-native-event-hover': '#aaa',
141-
'--color-scheduling-profiler-native-event-warning': '#ee1638',
142-
'--color-scheduling-profiler-native-event-warning-hover': '#da1030',
143-
'--color-scheduling-profiler-native-event-warning-text': '#fff',
144144
'--color-scheduling-profiler-priority-background': '#f6f6f6',
145145
'--color-scheduling-profiler-priority-border': '#eeeeee',
146146
'--color-scheduling-profiler-user-timing': '#c9cacd',
147147
'--color-scheduling-profiler-user-timing-hover': '#93959a',
148-
'--color-scheduling-profiler-react-idle': '#edf6ff',
149-
'--color-scheduling-profiler-react-idle-selected': '#EDF6FF',
150-
'--color-scheduling-profiler-react-idle-hover': '#EDF6FF',
148+
'--color-scheduling-profiler-react-idle': '#d3e5f6',
149+
'--color-scheduling-profiler-react-idle-hover': '#c3d9ef',
151150
'--color-scheduling-profiler-react-render': '#9fc3f3',
152-
'--color-scheduling-profiler-react-render-selected': '#64A9F5',
153-
'--color-scheduling-profiler-react-render-hover': '#2683E2',
154-
'--color-scheduling-profiler-react-commit': '#ff718e',
155-
'--color-scheduling-profiler-react-commit-selected': '#FF5277',
156-
'--color-scheduling-profiler-react-commit-hover': '#ed0030',
157-
'--color-scheduling-profiler-react-layout-effects': '#c88ff0',
158-
'--color-scheduling-profiler-react-layout-effects-selected': '#934FC1',
159-
'--color-scheduling-profiler-react-layout-effects-hover': '#601593',
160-
'--color-scheduling-profiler-react-passive-effects': '#c88ff0',
161-
'--color-scheduling-profiler-react-passive-effects-selected': '#934FC1',
162-
'--color-scheduling-profiler-react-passive-effects-hover': '#601593',
151+
'--color-scheduling-profiler-react-render-hover': '#83afe9',
152+
'--color-scheduling-profiler-react-commit': '#c88ff0',
153+
'--color-scheduling-profiler-react-commit-hover': '#b281d6',
154+
'--color-scheduling-profiler-react-layout-effects': '#b281d6',
155+
'--color-scheduling-profiler-react-layout-effects-hover': '#9d71bd',
156+
'--color-scheduling-profiler-react-passive-effects': '#b281d6',
157+
'--color-scheduling-profiler-react-passive-effects-hover': '#9d71bd',
163158
'--color-scheduling-profiler-react-schedule': '#9fc3f3',
164159
'--color-scheduling-profiler-react-schedule-hover': '#2683E2',
165-
'--color-scheduling-profiler-react-schedule-cascading': '#ff718e',
166-
'--color-scheduling-profiler-react-schedule-cascading-hover': '#ed0030',
167-
'--color-scheduling-profiler-react-suspend': '#a6e59f',
168-
'--color-scheduling-profiler-react-suspend-hover': '#13bc00',
169-
'--light-color-scheduling-profiler-text-color': '#000000',
160+
'--color-scheduling-profiler-react-suspense-rejected': '#f1cc14',
161+
'--color-scheduling-profiler-react-suspense-rejected-hover': '#ffdf37',
162+
'--color-scheduling-profiler-react-suspense-resolved': '#a6e59f',
163+
'--color-scheduling-profiler-react-suspense-resolved-hover': '#89d281',
164+
'--color-scheduling-profiler-react-suspense-unresolved': '#c9cacd',
165+
'--color-scheduling-profiler-react-suspense-unresolved-hover': '#93959a',
166+
'--color-scheduling-profiler-text-color': '#000000',
170167
'--color-scheduling-profiler-react-work-border': '#ffffff',
171168
'--color-scroll-thumb': '#c2c2c2',
172169
'--color-scroll-track': '#fafafa',
173170
'--color-search-match': 'yellow',
174171
'--color-search-match-current': '#f7923b',
175172
'--color-selected-tree-highlight-active': 'rgba(0, 136, 250, 0.1)',
176173
'--color-selected-tree-highlight-inactive': 'rgba(0, 0, 0, 0.05)',
177-
'--color-shadow': 'rgba(0, 0, 0, 0.25)',
174+
'--color-scroll-caret': 'rgba(150, 150, 150, 0.5)',
178175
'--color-tab-selected-border': '#0088fa',
179176
'--color-text': '#000000',
180177
'--color-text-invalid': '#ff0000',
@@ -183,9 +180,12 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
183180
'--color-toggle-background-on': '#0088fa',
184181
'--color-toggle-background-off': '#cfd1d5',
185182
'--color-toggle-text': '#ffffff',
186-
'--color-tooltip-background': 'rgba(0, 0, 0, 0.95)',
183+
'--color-tooltip-background': 'rgba(0, 0, 0, 0.9)',
187184
'--color-tooltip-text': '#ffffff',
188-
'--font-smoothing': 'auto',
185+
'--color-warning-background': '#fb3655',
186+
'--color-warning-background-hover': '#f82042',
187+
'--color-warning-text-color': '#ffffff',
188+
'--color-warning-text-color-inverted': '#fd4d69',
189189
},
190190
dark: {
191191
'--color-attribute-name': '#9d87d2',
@@ -261,37 +261,34 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
261261
'--color-record-active': '#fc3a4b',
262262
'--color-record-hover': '#a2e9fc',
263263
'--color-record-inactive': '#61dafb',
264-
'--color-resize-bar': '#3d424a',
264+
'--color-resize-bar': '#282c34',
265+
'--color-resize-bar-active': '#31363f',
266+
'--color-resize-bar-border': '#3d424a',
267+
'--color-resize-bar-dot': '#cfd1d5',
265268
'--color-scheduling-profiler-native-event': '#b2b2b2',
266269
'--color-scheduling-profiler-native-event-hover': '#949494',
267-
'--color-scheduling-profiler-native-event-warning': '#ee1638',
268-
'--color-scheduling-profiler-native-event-warning-hover': '#da1030',
269-
'--color-scheduling-profiler-native-event-warning-text': '#fff',
270270
'--color-scheduling-profiler-priority-background': '#1d2129',
271271
'--color-scheduling-profiler-priority-border': '#282c34',
272272
'--color-scheduling-profiler-user-timing': '#c9cacd',
273273
'--color-scheduling-profiler-user-timing-hover': '#93959a',
274274
'--color-scheduling-profiler-react-idle': '#3d485b',
275-
'--color-scheduling-profiler-react-idle-selected': '#465269',
276275
'--color-scheduling-profiler-react-idle-hover': '#465269',
277-
'--color-scheduling-profiler-react-render': '#9fc3f3',
278-
'--color-scheduling-profiler-react-render-selected': '#64A9F5',
279-
'--color-scheduling-profiler-react-render-hover': '#2683E2',
280-
'--color-scheduling-profiler-react-commit': '#ff718e',
281-
'--color-scheduling-profiler-react-commit-selected': '#FF5277',
282-
'--color-scheduling-profiler-react-commit-hover': '#ed0030',
283-
'--color-scheduling-profiler-react-layout-effects': '#c88ff0',
284-
'--color-scheduling-profiler-react-layout-effects-selected': '#934FC1',
285-
'--color-scheduling-profiler-react-layout-effects-hover': '#601593',
286-
'--color-scheduling-profiler-react-passive-effects': '#c88ff0',
287-
'--color-scheduling-profiler-react-passive-effects-selected': '#934FC1',
288-
'--color-scheduling-profiler-react-passive-effects-hover': '#601593',
289-
'--color-scheduling-profiler-react-schedule': '#9fc3f3',
290-
'--color-scheduling-profiler-react-schedule-hover': '#2683E2',
291-
'--color-scheduling-profiler-react-schedule-cascading': '#ff718e',
292-
'--color-scheduling-profiler-react-schedule-cascading-hover': '#ed0030',
293-
'--color-scheduling-profiler-react-suspend': '#a6e59f',
294-
'--color-scheduling-profiler-react-suspend-hover': '#13bc00',
276+
'--color-scheduling-profiler-react-render': '#2683E2',
277+
'--color-scheduling-profiler-react-render-hover': '#1a76d4',
278+
'--color-scheduling-profiler-react-commit': '#731fad',
279+
'--color-scheduling-profiler-react-commit-hover': '#611b94',
280+
'--color-scheduling-profiler-react-layout-effects': '#611b94',
281+
'--color-scheduling-profiler-react-layout-effects-hover': '#51167a',
282+
'--color-scheduling-profiler-react-passive-effects': '#611b94',
283+
'--color-scheduling-profiler-react-passive-effects-hover': '#51167a',
284+
'--color-scheduling-profiler-react-schedule': '#2683E2',
285+
'--color-scheduling-profiler-react-schedule-hover': '#1a76d4',
286+
'--color-scheduling-profiler-react-suspense-rejected': '#f1cc14',
287+
'--color-scheduling-profiler-react-suspense-rejected-hover': '#e4c00f',
288+
'--color-scheduling-profiler-react-suspense-resolved': '#a6e59f',
289+
'--color-scheduling-profiler-react-suspense-resolved-hover': '#89d281',
290+
'--color-scheduling-profiler-react-suspense-unresolved': '#c9cacd',
291+
'--color-scheduling-profiler-react-suspense-unresolved-hover': '#93959a',
295292
'--color-scheduling-profiler-text-color': '#000000',
296293
'--color-scheduling-profiler-react-work-border': '#ffffff',
297294
'--color-scroll-thumb': '#afb3b9',
@@ -300,6 +297,7 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
300297
'--color-search-match-current': '#f7923b',
301298
'--color-selected-tree-highlight-active': 'rgba(23, 143, 185, 0.15)',
302299
'--color-selected-tree-highlight-inactive': 'rgba(255, 255, 255, 0.05)',
300+
'--color-scroll-caret': '#4f5766',
303301
'--color-shadow': 'rgba(0, 0, 0, 0.5)',
304302
'--color-tab-selected-border': '#178fb9',
305303
'--color-text': '#ffffff',
@@ -311,7 +309,10 @@ export const THEME_STYLES: {[style: Theme | DisplayDensity]: any} = {
311309
'--color-toggle-text': '#ffffff',
312310
'--color-tooltip-background': 'rgba(255, 255, 255, 0.95)',
313311
'--color-tooltip-text': '#000000',
314-
'--font-smoothing': 'antialiased',
312+
'--color-warning-background': '#ee1638',
313+
'--color-warning-background-hover': '#da1030',
314+
'--color-warning-text-color': '#ffffff',
315+
'--color-warning-text-color-inverted': '#ee1638',
315316
},
316317
compact: {
317318
'--font-size-monospace-small': '9px',

0 commit comments

Comments
 (0)