diff --git a/src/devtools/views/Profiler/Profiler.css b/src/devtools/views/Profiler/Profiler.css index 3bf17ac9af..ce55714c18 100644 --- a/src/devtools/views/Profiler/Profiler.css +++ b/src/devtools/views/Profiler/Profiler.css @@ -22,6 +22,7 @@ flex: 1 1 100px; max-width: 300px; border-left: 1px solid var(--color-border); + border-top: 1px solid var(--color-border); } .Content { diff --git a/src/devtools/views/Profiler/SidebarCommitInfo.css b/src/devtools/views/Profiler/SidebarCommitInfo.css index 62991da498..38a4c7f7d0 100644 --- a/src/devtools/views/Profiler/SidebarCommitInfo.css +++ b/src/devtools/views/Profiler/SidebarCommitInfo.css @@ -4,13 +4,12 @@ flex: 0 0 auto; display: flex; align-items: center; - border-bottom: 1px solid var(--color-border); - border-top: 1px solid var(--color-border); } .Content { padding: 0.5rem; user-select: none; + border-top: 1px solid var(--color-border); } .List, @@ -45,3 +44,11 @@ font-family: var(--font-family-monospace); font-size: var(--font-size-monospace-normal); } + +.NothingSelected { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + color: var(--color-dim); +} diff --git a/src/devtools/views/Profiler/SidebarCommitInfo.js b/src/devtools/views/Profiler/SidebarCommitInfo.js index aefae459f1..cefbb8effc 100644 --- a/src/devtools/views/Profiler/SidebarCommitInfo.js +++ b/src/devtools/views/Profiler/SidebarCommitInfo.js @@ -21,7 +21,7 @@ export default function SidebarCommitInfo(_: Props) { const { profilingCache } = useContext(StoreContext); if (selectedCommitIndex === null) { - return null; // TODO (profiling) Use a better UI + return
Nothing selected
; } const { commitDurations, commitTimes } = profilingCache.ProfilingSummary.read( diff --git a/src/devtools/views/Profiler/SidebarInteractions.css b/src/devtools/views/Profiler/SidebarInteractions.css index f2a8432c7b..99327dbb9c 100644 --- a/src/devtools/views/Profiler/SidebarInteractions.css +++ b/src/devtools/views/Profiler/SidebarInteractions.css @@ -4,13 +4,12 @@ flex: 0 0 auto; display: flex; align-items: center; - border-bottom: 1px solid var(--color-border); - border-top: 1px solid var(--color-border); } .Content { padding: 0.5rem; user-select: none; + border-top: 1px solid var(--color-border); } .Name { @@ -21,7 +20,6 @@ } .NothingSelected { - border-top: 1px solid var(--color-border); display: flex; align-items: center; justify-content: center;