Bug 1414244 - Part 3 - Remove the "panel-subviews" container. r=Gijs
MozReview-Commit-ID: 2GGJ1myKuF5
--- a/browser/components/customizableui/PanelMultiView.jsm
+++ b/browser/components/customizableui/PanelMultiView.jsm
@@ -196,21 +196,16 @@ this.PanelMultiView = class {
* that this instance should be ready to be thrown away at
* any time.
*/
get _ephemeral() {
return this.node.hasAttribute("ephemeral");
}
get panelViews() {
- // If there's a dedicated subViews container, we're not in the right binding
- // to use SlidingPanelViews.
- if (this._subViews)
- return null;
-
if (this._panelViews)
return this._panelViews;
this._panelViews = new SlidingPanelViews();
this._panelViews.push(...this.node.getElementsByTagName("panelview"));
return this._panelViews;
}
get _dwu() {
@@ -275,18 +270,16 @@ this.PanelMultiView = class {
const {document, window} = this;
this._clickCapturer =
document.getAnonymousElementByAttribute(this.node, "anonid", "clickCapturer");
this._viewContainer =
document.getAnonymousElementByAttribute(this.node, "anonid", "viewContainer");
this._mainViewContainer =
document.getAnonymousElementByAttribute(this.node, "anonid", "mainViewContainer");
- this._subViews =
- document.getAnonymousElementByAttribute(this.node, "anonid", "subViews");
this._viewStack =
document.getAnonymousElementByAttribute(this.node, "anonid", "viewStack");
this._offscreenViewStack =
document.getAnonymousElementByAttribute(this.node, "anonid", "offscreenViewStack");
XPCOMUtils.defineLazyGetter(this, "_panelViewCache", () => {
let viewCacheId = this.node.getAttribute("viewCacheId");
return viewCacheId ? document.getElementById(viewCacheId) : null;
@@ -346,32 +339,30 @@ this.PanelMultiView = class {
if (this._ephemeral)
this.hideAllViewsExcept(null);
let mainView = this._mainView;
if (mainView) {
if (this._panelViewCache)
this._panelViewCache.appendChild(mainView);
mainView.removeAttribute("mainview");
}
- if (this._subViews)
- this._moveOutKids(this._subViews);
if (this.panelViews) {
this._moveOutKids(this._viewStack);
this.panelViews.clear();
} else {
this._clickCapturer.removeEventListener("click", this);
}
this._panel.removeEventListener("mousemove", this);
this._panel.removeEventListener("popupshowing", this);
this._panel.removeEventListener("popupshown", this);
this._panel.removeEventListener("popuphidden", this);
this.window.removeEventListener("keydown", this);
this.node = this._clickCapturer = this._viewContainer = this._mainViewContainer =
- this._subViews = this._viewStack = this.__dwu = this._panelViewCache =
+ this._viewStack = this.__dwu = this._panelViewCache =
this._transitionDetails = null;
}
/**
* Remove any child subviews into the panelViewCache, to ensure
* they remain usable even if this panelmultiview instance is removed
* from the DOM.
* @param viewNodeContainer the container from which to remove subviews
@@ -390,18 +381,16 @@ this.PanelMultiView = class {
}
}
_placeSubView(viewNode) {
if (this.panelViews) {
this._viewStack.appendChild(viewNode);
if (!this.panelViews.includes(viewNode))
this.panelViews.push(viewNode);
- } else {
- this._subViews.appendChild(viewNode);
}
}
goBack(target) {
let [current, previous] = this.panelViews.back();
return this.showSubView(current, target, previous);
}
@@ -416,18 +405,16 @@ this.PanelMultiView = class {
return view.id != this._mainViewId;
}
setMainView(aNewMainView) {
if (!aNewMainView)
return;
if (this._mainView) {
- if (!this.panelViews)
- this._subViews.appendChild(this._mainView);
this._mainView.removeAttribute("mainview");
}
this._mainViewId = aNewMainView.id;
aNewMainView.setAttribute("mainview", "true");
if (this.panelViews) {
// If the new main view is not yet in the zeroth position, make sure it's
// inserted there.
if (aNewMainView.parentNode != this._viewStack && this._viewStack.firstChild != aNewMainView) {
@@ -939,19 +926,17 @@ this.PanelMultiView = class {
} else {
edge = mainViewRect.right - anchorRect.right;
}
// If the anchor is an element on the far end of the mainView we
// don't want to shift the mainView too far, we would reveal empty
// space otherwise.
let cstyle = this.window.getComputedStyle(this.document.documentElement);
- let exitSubViewGutterWidth =
- cstyle.getPropertyValue("--panel-ui-exit-subview-gutter-width");
- let maxShift = mainViewRect.width - parseInt(exitSubViewGutterWidth);
+ let maxShift = mainViewRect.width - 38;
let target = Math.min(maxShift, edge + center);
let neg = direction == "ltr" ? "-" : "";
this._mainViewContainer.style.transform = `translateX(${neg}${target}px)`;
aAnchor.setAttribute("panel-multiview-anchor", true);
} else {
this._mainViewContainer.style.transform = "";
if (this.anchorElement)
--- a/browser/components/customizableui/content/panelUI.css
+++ b/browser/components/customizableui/content/panelUI.css
@@ -5,25 +5,16 @@
.panel-viewcontainer {
overflow: hidden;
}
.panel-viewstack {
transition: height var(--panelui-subview-transition-duration);
}
-.panel-subviews {
- -moz-stack-sizing: ignore-horizontal;
- transform: translateX(0);
-}
-
-.panel-subviews[panelopen] {
- transition: transform var(--panelui-subview-transition-duration);
-}
-
.panel-viewcontainer[panelopen] {
transition-property: height;
transition-timing-function: var(--animation-easing-function);
transition-duration: var(--panelui-subview-transition-duration);
will-change: height;
}
/* START photon adjustments */
--- a/browser/components/customizableui/content/panelUI.xml
+++ b/browser/components/customizableui/content/panelUI.xml
@@ -23,24 +23,17 @@
<xul:vbox anonid="mainViewContainer" class="panel-mainview"/>
<!-- Used to capture click events over the PanelUI-mainView if we're in
subview mode. That way, any click on the PanelUI-mainView causes us
to revert to the mainView mode, whereupon PanelUI-click-capture then
allows click events to go through it. -->
<xul:vbox anonid="clickCapturer" class="panel-clickcapturer"/>
- <!-- We manually set display: none (via a CSS attribute selector) on the
- subviews that are not being displayed. We're using this over a deck
- because a deck assumes the size of its largest child, regardless of
- whether or not it is shown. That's not good for our case, since we
- want to allow each subview to be uniquely sized. -->
- <xul:vbox anonid="subViews" class="panel-subviews" xbl:inherits="panelopen">
- <children includes="panelview"/>
- </xul:vbox>
+ <children includes="panelview"/>
</xul:stack>
</xul:vbox>
</content>
<implementation>
<constructor><![CDATA[
const {PanelMultiView} = Components.utils.import("resource:///modules/PanelMultiView.jsm", {});
this.instance = new PanelMultiView(this);
]]></constructor>
--- a/browser/themes/linux/customizableui/panelUI.css
+++ b/browser/themes/linux/customizableui/panelUI.css
@@ -1,18 +1,14 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%include ../../shared/customizableui/panelUI.inc.css
-.panel-subviews {
- background-color: var(--arrowpanel-background);
-}
-
#BMB_bookmarksPopup > menuitem[type="checkbox"] {
-moz-appearance: none !important; /* important, to override toolkit rule */
}
#BMB_bookmarksPopup menupopup {
-moz-appearance: none;
background: var(--arrowpanel-background);
color: var(--arrowpanel-color);
--- a/browser/themes/osx/controlcenter/panel.css
+++ b/browser/themes/osx/controlcenter/panel.css
@@ -5,25 +5,16 @@
%include ../shared.inc
%include ../../shared/controlcenter/panel.inc.css
.identity-popup-expander:-moz-focusring,
.identity-popup-permission-remove-button:-moz-focusring {
box-shadow: var(--focus-ring-box-shadow);
}
-#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
- border-bottom-right-radius: 3.5px;
-}
-
-#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews:-moz-locale-dir(rtl) {
- border-bottom-right-radius: 0;
- border-bottom-left-radius: 3.5px;
-}
-
#tracking-action-block,
#tracking-action-unblock,
#tracking-action-unblock-private,
#identity-popup-securityView-body > button {
@hudButton@
min-height: 30px;
}
--- a/browser/themes/osx/customizableui/panelUI.css
+++ b/browser/themes/osx/customizableui/panelUI.css
@@ -1,18 +1,14 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%include ../../shared/customizableui/panelUI.inc.css
-.panel-subviews {
- background-color: hsla(0,0%,100%,.97);
-}
-
.restoreallitem > .toolbarbutton-icon {
display: none;
}
.subviewbutton {
padding-inline-start: 18px;
}
--- a/browser/themes/shared/controlcenter/panel.inc.css
+++ b/browser/themes/shared/controlcenter/panel.inc.css
@@ -63,21 +63,16 @@
fill-opacity: .6;
}
#identity-popup-mainView {
min-width: 30em;
max-width: 30em;
}
-#identity-popup-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
- background: var(--arrowpanel-background);
- padding: 0;
-}
-
.identity-popup-section:not(:first-child) {
border-top: 1px solid var(--panel-separator-color);
}
.identity-popup-security-content,
#identity-popup-permissions-content,
#tracking-protection-content {
background-repeat: no-repeat;
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -17,17 +17,16 @@
%define menuStateHover :not(:-moz-any([disabled],:active))[_moz-menuactive]
%define buttonStateActive :not([disabled]):-moz-any([open],:hover:active)
%define menuStateActive :not([disabled])[_moz-menuactive]:active
%define menuStateMenuActive :not([disabled])[_moz-menuactive]
%define inAnyPanel :-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])
%define panelPaletteIconSize 16px
:root {
- --panel-ui-exit-subview-gutter-width: 38px;
--appmenu-yellow-warning-border-color: hsl(45, 100%, 77%);
--appmenu-yellow-warning-color: #FFEFBF;
--appmenu-yellow-warning-hover-color: #FFE8A2;
--appmenu-yellow-warning-active-color: #FFE38F;
}
:root:not([uidensity=compact]):not([chromehidden~="toolbar"]) #PanelUI-button {
margin-inline-start: 3px;
@@ -109,25 +108,16 @@
filter: none;
}
#PanelUI-menu-button[badge-status="addon-alert"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
height: 13px;
background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center;
}
-.panel-subviews {
- padding: 4px;
- background-clip: padding-box;
- border-left: 1px solid var(--arrowpanel-border-color);
- box-shadow: 0 3px 5px hsla(210,4%,10%,.1),
- 0 0 7px hsla(210,4%,10%,.1);
- margin-inline-start: var(--panel-ui-exit-subview-gutter-width);
-}
-
panelview {
-moz-box-orient: vertical;
-moz-box-flex: 1;
}
/* This section is to anchor all the drop down panels at the same height, shift the
panel`s top margin according to its positioning and the uidensity of the window. */
#downloadsPanel,
--- a/browser/themes/shared/downloads/downloads.inc.css
+++ b/browser/themes/shared/downloads/downloads.inc.css
@@ -10,20 +10,16 @@
%define itemFinished @item@[state="1"]
%define itemNotFinished @item@:not([state="1"])
%define itemFocused #downloadsListBox:focus > @item@[selected]
/*** Panel and outer controls ***/
#downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent {
overflow: hidden;
-}
-
-#downloadsPanel > .panel-arrowcontainer > .panel-arrowcontent,
-#downloadsPanel-multiView > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
padding: 0;
}
#downloadsListBox {
background: transparent;
color: inherit;
-moz-appearance: none;
margin: 0;
--- a/browser/themes/windows/customizableui/panelUI.css
+++ b/browser/themes/windows/customizableui/panelUI.css
@@ -1,18 +1,14 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%include ../../shared/customizableui/panelUI.inc.css
-.panel-subviews {
- background-color: var(--arrowpanel-background);
-}
-
/* bookmark panel submenus */
#BMB_bookmarksPopup menupopup[placespopup=true] {
-moz-appearance: none;
background: transparent;
border: none;
padding: 0;
padding-top: 4px;