Bug 1363753 - Add an option for panelmultiviews to keep the width of the mainView synchronized across all other subviews. r?Gijs
MozReview-Commit-ID: ALgU1xWydWB
--- a/browser/components/customizableui/PanelMultiView.jsm
+++ b/browser/components/customizableui/PanelMultiView.jsm
@@ -377,20 +377,22 @@ this.PanelMultiView = class {
}
}
let reverse = !!aPreviousView;
let previousViewNode = aPreviousView || this._currentSubView;
let playTransition = (!!previousViewNode && previousViewNode != viewNode);
let dwu, previousRect;
- if (playTransition) {
+ if (playTransition || this.panelViews) {
dwu = this._dwu;
previousRect = previousViewNode.__lastKnownBoundingRect =
dwu.getBoundsWithoutFlushing(previousViewNode);
+ if (this.panelViews && !this._mainViewWidth)
+ this._mainViewWidth = previousRect.width;
}
// Emit the ViewShowing event so that the widget definition has a chance
// to lazily populate the subview with things.
let detail = {
blockers: new Set(),
addBlocker(aPromise) {
this.blockers.add(aPromise);
@@ -405,16 +407,18 @@ this.PanelMultiView = class {
let custWidget = CustomizableWidgets.find(widget => widget.viewId == viewNode.id);
if (custWidget) {
if (custWidget.onInit)
custWidget.onInit(aAnchor);
custWidget.onViewShowing({ target: aAnchor, detail });
}
}
viewNode.setAttribute("current", true);
+ if (playTransition && this.panelViews)
+ viewNode.style.maxWidth = viewNode.style.minWidth = this._mainViewWidth + "px";
let evt = new window.CustomEvent("ViewShowing", { bubbles: true, cancelable: true, detail });
viewNode.dispatchEvent(evt);
let cancel = evt.defaultPrevented;
if (detail.blockers.size) {
try {
let results = await Promise.all(detail.blockers);
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -330,16 +330,17 @@ panelview:not([mainview]) .toolbarbutton
padding: 0;
margin: 0;
border-radius: 0;
}
photonpanelmultiview panelview {
background: var(--arrowpanel-background);
padding: 6px 0;
+ min-width: @menuPanelWidth@;
}
photonpanelmultiview panelview[title] {
padding-top: 0;
}
photonpanelmultiview .panel-subview-body {
/*XXXmikedeboer this flex is unnecessary, so I unset it for our case. It might