Wrap Components and Profiler tabs with box-size style too

For the browser extension, these views get rendered into portals and so they don't inherit the box-sizing style from the .DevTools wrapper element. This causes views like the Profiler commit selector to subtly break.

Author: Brian Vaughn

packages/react-devtools-shared/src/devtools/views/Components/Components.css

@@ -9,6 +9,11 @@
   font-family: var(--font-family-sans);
 }
 
+.Components, .Components * {
+  box-sizing: border-box;
+  -webkit-font-smoothing: var(--font-smoothing);
+}
+
 .TreeWrapper {
   flex: 0 0 var(--horizontal-resize-percentage);
   overflow: auto;

packages/react-devtools-shared/src/devtools/views/DevTools.css

@@ -56,6 +56,5 @@
 
 .DevTools, .DevTools * {
   box-sizing: border-box;
-
   -webkit-font-smoothing: var(--font-smoothing);
 }

packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.css

@@ -11,6 +11,11 @@
   color: var(--color-text);
 }
 
+.Profiler, .Profiler * {
+  box-sizing: border-box;
+  -webkit-font-smoothing: var(--font-smoothing);
+}
+
 .LeftColumn {
   display: flex;
   flex-direction: column;