{"patch":"diff --git a\/src\/devtools\/views\/Profiler\/Profiler.css b\/src\/devtools\/views\/Profiler\/Profiler.css\nindex 107a092f99..7829df4dff 100644\n--- a\/src\/devtools\/views\/Profiler\/Profiler.css\n+++ b\/src\/devtools\/views\/Profiler\/Profiler.css\n@@ -2,13 +2,28 @@\n width: 100%;\n height: 100%;\n display: flex;\n- flex-direction: column;\n+ flex-direction: row;\n+ align-items: stretch;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n background-color: var(--color-background);\n color: var(--color-text-color);\n }\n \n+.LeftColumn {\n+ display: flex;\n+ flex-direction: column;\n+ flex: 2 1 200px;\n+}\n+\n+.RightColumn {\n+ display: flex;\n+ flex-direction: column;\n+ flex: 1 1 100px;\n+ max-width: 300px;\n+ border-left: 1px solid var(--color-border);\n+}\n+\n .Content {\n position: relative;\n flex: 1 1 auto;\n@@ -38,13 +53,17 @@\n }\n \n .Toolbar {\n+ height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n border-top: 1px solid var(--color-border);\n- color: var(--color-button);\n+}\n+\n+.InspectedProperties {\n+ padding: 0.5rem;\n }\n \n .VRule {\ndiff --git a\/src\/devtools\/views\/Profiler\/Profiler.js b\/src\/devtools\/views\/Profiler\/Profiler.js\nindex 1f31ebe245..8cc1e54aa5 100644\n--- a\/src\/devtools\/views\/Profiler\/Profiler.js\n+++ b\/src\/devtools\/views\/Profiler\/Profiler.js\n@@ -29,6 +29,9 @@ function ProfilerInner(_: Props) {\n const showFilterModal = useCallback(() => setIsFilterModalShowing(true));\n const dismissFilterModal = useCallback(() => setIsFilterModalShowing(false));\n \n+ \/\/ TODO (profiling) Maybe a smarter check here\n+ const showProfilingData = !isProfiling && hasProfilingData;\n+\n let view = null;\n if (isProfiling) {\n view = ;\n@@ -42,38 +45,51 @@ function ProfilerInner(_: Props) {\n \n return (\n

\n-

\n- \n-

dillon1000/react

Files changed