dillon1000/react

Commit

[DevTools] Tweak the rects design and create multi-environment color scheme (#34880)

<img width="1011" height="811" alt="Screenshot 2025-10-16 at 2 20 46 PM"
src="https://github.com/user-attachments/assets/6dea3962-d369-4823-b44f-2c62b566c8f1"
/>

The selection is now clearer with a wider outline which spans the
bounding box if there are multi rects.

The color now gets darked changes on hover with a slight animation.

The colors are now mixed from constants defined which are consistently
used in the rects, the time span in the "suspended by" side bar and the
scrubber. I also have constants defined for "server" and "other" debug
environments which will be used in a follow up.
Browse files
Changed paths5 files
First-parent comparison
M packages/react-devtools-shared/src/devtools/constants.js ModifiedM packages/react-devtools-shared/src/devtools/views/Components/InspectedElementSharedStyles.css ModifiedM packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseRects.css ModifiedM packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseRects.js ModifiedM packages/react-devtools-shared/src/devtools/views/SuspenseTab/SuspenseScrubber.css Modified
Patch

Files changed

Rendering syntax-highlighted changes…