Index: tracing/tracing/ui/side_panel/side_panel_container.html |
diff --git a/tracing/tracing/ui/side_panel/side_panel_container.html b/tracing/tracing/ui/side_panel/side_panel_container.html |
index 9f75c8ada1f291e5743dca59cdadbe02235e8912..5b3d182bf38bafbe7b1decaa47e6ee1d9068d18f 100644 |
--- a/tracing/tracing/ui/side_panel/side_panel_container.html |
+++ b/tracing/tracing/ui/side_panel/side_panel_container.html |
@@ -48,7 +48,9 @@ found in the LICENSE file. |
} |
tab-strip > tab-strip-label { |
+ flex-shrink: 0; |
-webkit-writing-mode: vertical-rl; |
+ white-space: nowrap; |
display: inline; |
margin-right: 1px; |
min-height: 20px; |
@@ -211,9 +213,11 @@ Polymer({ |
Polymer.dom(this.tabStrip_).textContent = ''; |
const supportedPanelTypes = []; |
+ const panelTypeInfos = |
+ tr.ui.side_panel.SidePanelRegistry.getAllRegisteredTypeInfos(); |
+ const unsupportedLabelEls = []; |
- for (const panelTypeInfo of |
- tr.ui.side_panel.SidePanelRegistry.getAllRegisteredTypeInfos()) { |
+ for (const panelTypeInfo of panelTypeInfos) { |
const labelEl = document.createElement('tab-strip-label'); |
const panel = panelTypeInfo.constructor(); |
const panelType = panel.tagName; |
@@ -229,12 +233,21 @@ Polymer({ |
this.activePanelType = |
this.activePanelType === panelType ? undefined : panelType; |
}.bind(this, panelType)); |
+ Polymer.dom(this.tabStrip_).appendChild(labelEl); |
} else { |
if (this.activePanel) { |
this.activePanelContainer_.removeChild(this.activePanel); |
} |
this.removeAttribute('expanded'); |
+ unsupportedLabelEls.push(labelEl); |
} |
+ } |
+ |
+ // Labels do not shrink, so when the user drags the analysis-view up, the |
+ // bottom labels are obscured first. |
+ // Append all unsupported panel labels after all supported panel labels so |
+ // that unsupported panel labels are obscured first. |
+ for (const labelEl of unsupportedLabelEls) { |
Polymer.dom(this.tabStrip_).appendChild(labelEl); |
} |