[DevTools] Special case the selected root outline

[jasonyuezhang]

When I moved the outline to above all other rects, I thought it was clever to unify with the root so that the outline was also used for the root selection. But the root outline is not drawn like the other rects. It's outside the padding and doesn't have the 1px adjustment which leads the overlay to be slightly inside the other rect instead of above it.

This goes back to just having the selected root be drawn by the root element.

Before:

After:

---

Copied from facebook#35071
Original PR: facebook#35071

[macroscopeapp]

Render root selection in DevTools Suspense tab with a 4px container outline and 0.125rem radius via .SuspenseRectsRootOutline and remove ScaledRect overlay for root

Introduce a root-specific container outline and drop the ScaledRect overlay when the root is selected. Update .SuspenseRectsContainer to append styles.SuspenseRectsRootOutline on isRootSelected and remove styles.SuspenseRectOutlineRoot. Add the 4px outline and 0.125rem radius in SuspenseRects.css and adjust logic in SuspenseRects.js.

📍Where to Start

Start with the SuspenseRectsContainer component in SuspenseRects.js to review the root selection logic and class assignment, then verify styles in SuspenseRects.css.

---

Macroscope summarized 38fc9e6.