Bug 1388029 - remove dead CSS relating to the old panel, r?jaws
MozReview-Commit-ID: FoXjvWPc9in
--- a/browser/components/customizableui/PanelMultiView.jsm
+++ b/browser/components/customizableui/PanelMultiView.jsm
@@ -1027,45 +1027,16 @@ this.PanelMultiView = class {
// currently 11px on Mac, 13px on Windows, and 13px on Linux. We also
// want an extra margin, both for visual reasons and to prevent glitches
// due to small rounding errors. So, we just use a value that makes
// sense for all platforms. If the arrow visuals change significantly,
// this value will be easy to adjust.
const EXTRA_MARGIN_PX = 20;
maxHeight -= EXTRA_MARGIN_PX;
this._viewStack.style.maxHeight = maxHeight + "px";
-
- // When using block-in-box layout inside a scrollable frame, like in the
- // main menu contents scroller, if we allow the contents to scroll then
- // it will not cause its container to expand. Thus, we layout first
- // without any scrolling (using "display: flex;"), and only if the view
- // exceeds the available space we set the height explicitly and enable
- // scrolling.
- let mainView = this._mainView;
- if (mainView && mainView.hasAttribute("blockinboxworkaround")) {
- let blockInBoxWorkaround = () => {
- let mainViewHeight =
- this._dwu.getBoundsWithoutFlushing(mainView).height;
- if (mainViewHeight > maxHeight) {
- mainView.style.height = maxHeight + "px";
- mainView.setAttribute("exceeding", "true");
- }
- };
- // On Windows, we cannot measure the full height of the main view
- // until it is visible. Unfortunately, this causes a visible jump when
- // the view needs to scroll, but there is no easy way around this.
- if (AppConstants.platform == "win") {
- // We register a "once" listener so we don't need to store the value
- // of maxHeight elsewhere on the object.
- this._panel.addEventListener("popupshown", blockInBoxWorkaround,
- { once: true });
- } else {
- blockInBoxWorkaround();
- }
- }
break;
}
case "popupshown":
// Now that the main view is visible, we can check the height of the
// description elements it contains.
this.descriptionHeightWorkaround();
break;
case "popuphidden": {
@@ -1092,23 +1063,16 @@ this.PanelMultiView = class {
this._mainViewHeight = 0;
this._mainViewWidth = 0;
this._viewContainer.style.removeProperty("min-height");
this._viewStack.style.removeProperty("max-height");
this._viewContainer.style.removeProperty("min-width");
this._viewContainer.style.removeProperty("max-width");
}
- // Always try to layout the panel normally when reopening it. This is
- // also the layout that will be used in customize mode.
- let mainView = this._mainView;
- if (mainView && mainView.hasAttribute("blockinboxworkaround")) {
- mainView.style.removeProperty("height");
- mainView.removeAttribute("exceeding");
- }
this._dispatchViewEvent(this.node, "PanelMultiViewHidden");
break;
}
}
}
/**
* Based on going up or down, select the previous or next focusable button
--- a/browser/components/customizableui/test/browser_876926_customize_mode_wrapping.js
+++ b/browser/components/customizableui/test/browser_876926_customize_mode_wrapping.js
@@ -4,17 +4,16 @@
"use strict";
const kXULWidgetId = "a-test-button"; // we'll create a button with this ID.
const kAPIWidgetId = "feed-button";
const kPanel = CustomizableUI.AREA_FIXED_OVERFLOW_PANEL;
const kToolbar = CustomizableUI.AREA_NAVBAR;
const kVisiblePalette = "customization-palette";
-const kPlaceholderClass = "panel-customization-placeholder";
function checkWrapper(id) {
is(document.querySelectorAll("#wrapper-" + id).length, 1, "There should be exactly 1 wrapper for " + id + " in the customizing window.");
}
async function ensureVisibleIfInPalette(node) {
if (node.parentNode.parentNode == gNavToolbox.palette) {
node.scrollIntoView();
@@ -38,17 +37,17 @@ var move = {
await ensureVisibleIfInPalette(nodeToMove);
simulateItemDrag(nodeToMove, targetNode);
},
"dragToItem": async function(id, target) {
let targetNode = document.getElementById(target);
if (targetNode.customizationTarget) {
targetNode = targetNode.customizationTarget;
}
- let items = targetNode.querySelectorAll("toolbarpaletteitem:not(." + kPlaceholderClass + ")");
+ let items = targetNode.querySelectorAll("toolbarpaletteitem");
if (target == kPanel) {
targetNode = items[items.length - 1];
} else {
targetNode = items[0];
}
let nodeToMove = document.getElementById(id);
await ensureVisibleIfInPalette(nodeToMove);
simulateItemDrag(nodeToMove, targetNode);
@@ -119,17 +118,17 @@ async function checkToolbar(id, method)
isLast(kToolbar, toolbarPlacements, id);
}
checkWrapper(id);
}
async function checkPanel(id, method) {
let panelPlacements = getAreaWidgetIds(kPanel);
await move[method](id, kPanel);
- let children = document.getElementById(kPanel).querySelectorAll("toolbarpaletteitem:not(." + kPlaceholderClass + ")");
+ let children = document.getElementById(kPanel).querySelectorAll("toolbarpaletteitem");
let otherChildren = otherWin.document.getElementById(kPanel).children;
let newPlacements = panelPlacements.concat([id]);
// Relative position of the new item from the end:
let position = -1;
// For the drag to item case, we drag to the last item, making the dragged item the
// penultimate item. We can't well use the first item because the panel has complicated
// rules about rearranging wide items (which, by default, the first two items are).
if (method == "dragToItem") {
--- a/browser/themes/shared/customizableui/customizeMode.inc.css
+++ b/browser/themes/shared/customizableui/customizeMode.inc.css
@@ -3,17 +3,17 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
/* Customization mode */
:root {
--drag-drop-transition-duration: .3s;
}
-#main-window[customizing] .customization-target:not(#PanelUI-contents):not(#widget-overflow-fixed-list) {
+#main-window[customizing] .customization-target:not(#widget-overflow-fixed-list) {
min-width: 100px;
}
#customization-container {
background-color: var(--toolbar-non-lwt-bgcolor);
background-image: var(--toolbar-non-lwt-bgimage);
color: var(--toolbar-non-lwt-textcolor);
text-shadow: none;
@@ -169,17 +169,16 @@
toolbarpaletteitem[place="toolbar"] {
transition: border-width 250ms ease-in-out;
}
toolbarpaletteitem[mousedown] {
cursor: -moz-grabbing;
}
-.panel-customization-placeholder,
toolbarpaletteitem[place="palette"],
toolbarpaletteitem[place="panel"] {
transition: transform var(--drag-drop-transition-duration) ease-in-out;
}
#customization-palette {
transition: opacity .3s ease-in-out;
opacity: 0;
@@ -189,17 +188,16 @@ toolbarpaletteitem[place="panel"] {
opacity: 1;
}
toolbarpaletteitem toolbarbutton[disabled] {
color: inherit !important;
}
#widget-overflow-fixed-list > toolbarpaletteitem[notransition][place="panel"],
-toolbarpaletteitem[notransition].panel-customization-placeholder,
toolbarpaletteitem[notransition][place="toolbar"],
toolbarpaletteitem[notransition][place="palette"],
toolbarpaletteitem[notransition][place="panel"] {
transition: none;
}
toolbarpaletteitem > toolbarbutton > .toolbarbutton-icon,
toolbarpaletteitem > toolbarbutton > .toolbarbutton-badge-stack > .toolbarbutton-icon,
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -232,45 +232,16 @@ panelview {
panel[photon] > .panel-arrowcontainer > .panel-arrowcontent {
overflow: hidden;
}
.cui-widget-panel > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box {
padding: 0;
}
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
- line-height: 1.2;
- max-height: 2.4em;
-}
-
-.panelUI-grid .toolbarbutton-1:not([auto-hyphens="off"]) > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid .toolbarbutton-1:not([auto-hyphens="off"]) > .toolbarbutton-multiline-text {
- -moz-hyphens: auto;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
- position: absolute;
- clip: rect(-0.1em, auto, 2.6em, auto);
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-text,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
- text-align: center;
- /* Need to override toolkit theming which sets margin: 0 !important; */
- margin: 2px 0 0 !important;
-}
-
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
- text-align: center;
- margin: -1px 0 0;
-}
-
#wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
#wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
margin-inline-start: 0;
}
#BMB_bookmarksPopup,
.panel-mainview {
max-width: @standaloneSubviewWidth@;
@@ -411,54 +382,22 @@ photonpanelmultiview .panel-subview-body
}
/* END photonpanelview adjustments */
.cui-widget-panel.cui-widget-panelWithFooter > .panel-arrowcontainer > .panel-arrowcontent {
padding-bottom: 0;
}
-#PanelUI-contents {
- display: block;
- flex: 1 0 auto;
- margin-left: auto;
- margin-right: auto;
- padding: .5em 0;
- max-width: @menuPanelWidth@;
-}
-
-#PanelUI-contents-scroller {
- -moz-box-flex: 1;
- overflow-y: auto;
- overflow-x: hidden;
- width: @menuPanelWidth@;
- padding-left: 5px;
- padding-right: 5px;
- -moz-box-align: center;
-}
-
-/* Allow box layout to take over when the view exceeds the available space. */
-#PanelUI-mainView:not([exceeding]) > #PanelUI-contents-scroller {
- display: flex;
-}
-
.toolbaritem-combined-buttons@inAnyPanel@ > toolbarbutton > .toolbarbutton-icon {
min-width: 0;
min-height: 0;
margin: 0;
}
-.panelUI-grid .toolbarbutton-1,
-.panel-customization-placeholder-child {
- -moz-appearance: none;
- -moz-box-orient: vertical;
- width: calc(@menuPanelButtonWidth@);
- height: calc(51px + 2.2em);
-}
-
.animate-out {
animation-name: widget-animate-out;
animation-fill-mode: forwards;
animation-duration: 500ms;
animation-timing-function: var(--animation-easing-function);
}
@keyframes widget-animate-out {
@@ -490,18 +429,17 @@ toolbarbutton[constrain-size="true"][cui
-moz-box-orient: vertical;
padding: 12px 0 9px;
margin: 0;
}
/* above we treat the container as the icon for the margins, that is so the
/* badge itself is positioned correctly. Here we make sure that the icon itself
/* has the minimum size we want, but no padding/margin. */
-.customization-palette .toolbarbutton-1 > .toolbarbutton-badge-stack > .toolbarbutton-icon,
-.panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-stack > .toolbarbutton-icon {
+.customization-palette .toolbarbutton-1 > .toolbarbutton-badge-stack > .toolbarbutton-icon {
width: @panelPaletteIconSize@;
height: @panelPaletteIconSize@;
min-width: @panelPaletteIconSize@;
min-height: @panelPaletteIconSize@;
margin: 0;
padding: 0;
}