mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-28 15:23:51 +00:00
Bug 1634865 - Backed out bug 1625720 and bug 1625721. r=Gijs
Differential Revision: https://phabricator.services.mozilla.com/D73542
This commit is contained in:
Dão Gottwald
parent
8904c372ca
commit
84553118c4
@ -1031,13 +1031,10 @@ toolbarpaletteitem[place="palette"] > #downloads-button[indicator] > .toolbarbut
|
||||
-moz-appearance: none;
|
||||
background: transparent;
|
||||
border: none;
|
||||
-moz-font-smoothing-background-color: unset;
|
||||
|
||||
/* The popup inherits -moz-image-region from the button, must reset it */
|
||||
-moz-image-region: auto;
|
||||
}
|
||||
|
||||
/* Keep in sync with xul.css */
|
||||
@supports -moz-bool-pref("xul.panel-animations.enabled") {
|
||||
%ifdef MOZ_WIDGET_COCOA
|
||||
/* On Mac, use the properties "-moz-window-transform" and "-moz-window-opacity"
|
||||
|
||||
@ -32,17 +32,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
static get markup() {
|
||||
get markup() {
|
||||
return `
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/popup.css"/>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/global.css" />
|
||||
<hbox flex="1" part="innerbox">
|
||||
<vbox part="drop-indicator-bar" hidden="true">
|
||||
<image part="drop-indicator"/>
|
||||
</vbox>
|
||||
<arrowscrollbox flex="1" orient="vertical"
|
||||
<arrowscrollbox class="menupopup-arrowscrollbox" flex="1" orient="vertical"
|
||||
exportparts="scrollbox: arrowscrollbox-scrollbox"
|
||||
smoothscroll="false" part="arrowscrollbox">
|
||||
<html:slot/>
|
||||
<html:slot></html:slot>
|
||||
</arrowscrollbox>
|
||||
</hbox>
|
||||
`;
|
||||
@ -589,10 +589,9 @@
|
||||
};
|
||||
}
|
||||
|
||||
static get markup() {
|
||||
get markup() {
|
||||
return `
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/popup.css"/>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/arrowpanel.css"/>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/global.css"/>
|
||||
<vbox class="panel-arrowcontainer" flex="1">
|
||||
<box class="panel-arrowbox" part="arrowbox">
|
||||
<image class="panel-arrow" part="arrow"/>
|
||||
@ -601,8 +600,9 @@
|
||||
<vbox part="drop-indicator-bar" hidden="true">
|
||||
<image part="drop-indicator"/>
|
||||
</vbox>
|
||||
<arrowscrollbox flex="1" orient="vertical"
|
||||
smoothscroll="false" part="arrowscrollbox">
|
||||
<arrowscrollbox class="menupopup-arrowscrollbox" flex="1"
|
||||
orient="vertical" smoothscroll="false"
|
||||
part="arrowscrollbox">
|
||||
<html:slot/>
|
||||
</arrowscrollbox>
|
||||
</box>
|
||||
|
||||
@ -294,6 +294,16 @@
|
||||
}
|
||||
}
|
||||
|
||||
#BMB_bookmarksPopup[side="top"],
|
||||
#BMB_bookmarksPopup[side="bottom"] {
|
||||
margin-inline: -26px;
|
||||
}
|
||||
|
||||
#BMB_bookmarksPopup[side="left"],
|
||||
#BMB_bookmarksPopup[side="right"] {
|
||||
margin-block: -26px;
|
||||
}
|
||||
|
||||
/* Bookmarking panel */
|
||||
|
||||
%include ../shared/places/editBookmarkPanel.inc.css
|
||||
|
||||
@ -453,7 +453,6 @@ toolbarpaletteitem > #search-container > #searchbar > .searchbar-textbox {
|
||||
margin: 0;
|
||||
box-shadow: 0 0 4px hsla(0,0%,0%,.2);
|
||||
%endif
|
||||
padding: var(--arrowpanel-padding);
|
||||
max-width: 29em;
|
||||
}
|
||||
|
||||
@ -461,6 +460,7 @@ toolbarpaletteitem > #search-container > #searchbar > .searchbar-textbox {
|
||||
display: block;
|
||||
position: relative;
|
||||
height: 10px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
/* In customize mode, the overflow button should look both 'disabled' and 'open'.
|
||||
|
||||
@ -356,7 +356,8 @@ panelview:not([mainview]) .toolbarbutton-text,
|
||||
display: -moz-box;
|
||||
}
|
||||
|
||||
.cui-widget-panel {
|
||||
.cui-widget-panel,
|
||||
.cui-widget-panel::part(arrowcontent) {
|
||||
--arrowpanel-padding: 4px 0;
|
||||
}
|
||||
|
||||
|
||||
@ -291,6 +291,18 @@ toolbar .toolbarbutton-1:-moz-focusring {
|
||||
border-color: hsla(240,5%,5%,.40);
|
||||
}
|
||||
|
||||
/* bookmarks menu button */
|
||||
|
||||
#BMB_bookmarksPopup[side="top"],
|
||||
#BMB_bookmarksPopup[side="bottom"] {
|
||||
margin-inline: -20px;
|
||||
}
|
||||
|
||||
#BMB_bookmarksPopup[side="left"],
|
||||
#BMB_bookmarksPopup[side="right"] {
|
||||
margin-block: -20px;
|
||||
}
|
||||
|
||||
/* ::::: bookmark buttons ::::: */
|
||||
|
||||
toolbarbutton.bookmark-item:not(.subviewbutton) {
|
||||
|
||||
@ -14,6 +14,7 @@
|
||||
@import url("chrome://global/skin/menu.css");
|
||||
@import url("chrome://global/skin/notification.css");
|
||||
@import url("chrome://global/skin/numberinput.css");
|
||||
@import url("chrome://global/skin/popup.css");
|
||||
@import url("chrome://global/skin/popupnotification.css");
|
||||
@import url("chrome://global/skin/radio.css");
|
||||
@import url("chrome://global/skin/richlistbox.css");
|
||||
|
||||
@ -7,6 +7,10 @@
|
||||
// This is loaded into all XUL windows. Wrap in a block to prevent
|
||||
// leaking to window scope.
|
||||
{
|
||||
const { AppConstants } = ChromeUtils.import(
|
||||
"resource://gre/modules/AppConstants.jsm"
|
||||
);
|
||||
|
||||
class MozMenuPopup extends MozElements.MozElementMixin(XULPopupElement) {
|
||||
constructor() {
|
||||
super();
|
||||
@ -58,21 +62,61 @@
|
||||
// We generate shadow DOM lazily on popupshowing event to avoid extra load
|
||||
// on the system during browser startup.
|
||||
if (!super.shadowRoot.firstElementChild) {
|
||||
super.shadowRoot.appendChild(this.constructor.fragment);
|
||||
super.shadowRoot.appendChild(this.fragment);
|
||||
this.initShadowDOM();
|
||||
}
|
||||
return super.shadowRoot;
|
||||
}
|
||||
|
||||
static get markup() {
|
||||
get fragment() {
|
||||
if (!this.constructor.hasOwnProperty("_fragment")) {
|
||||
this.constructor._fragment = MozXULElement.parseXULToFragment(
|
||||
this.markup
|
||||
);
|
||||
}
|
||||
return document.importNode(this.constructor._fragment, true);
|
||||
}
|
||||
|
||||
get markup() {
|
||||
return `
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/popup.css"/>
|
||||
<arrowscrollbox flex="1" orient="vertical" smoothscroll="false">
|
||||
<html:slot/>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/global.css"/>
|
||||
<html:style>${this.styles}</html:style>
|
||||
<arrowscrollbox class="menupopup-arrowscrollbox"
|
||||
flex="1"
|
||||
orient="vertical"
|
||||
smoothscroll="false">
|
||||
<html:slot></html:slot>
|
||||
</arrowscrollbox>
|
||||
`;
|
||||
}
|
||||
|
||||
get styles() {
|
||||
let s = `
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-up),
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-down) {
|
||||
display: none;
|
||||
}
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbox) {
|
||||
overflow: auto;
|
||||
}
|
||||
`;
|
||||
|
||||
switch (AppConstants.platform) {
|
||||
case "macosx":
|
||||
s += `
|
||||
:host(.in-menulist) arrowscrollbox {
|
||||
padding: 0;
|
||||
}
|
||||
`;
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
return s;
|
||||
}
|
||||
|
||||
get scrollBox() {
|
||||
if (!this._scrollBox) {
|
||||
this._scrollBox = this.shadowRoot.querySelector("arrowscrollbox");
|
||||
|
||||
@ -10,7 +10,12 @@
|
||||
class MozPanel extends MozElements.MozElementMixin(XULPopupElement) {
|
||||
static get markup() {
|
||||
return `
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/arrowpanel.css"/>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/global.css"/>
|
||||
<html:style>
|
||||
:host([orient=vertical]) .panel-arrowcontent {
|
||||
-moz-box-orient: vertical;
|
||||
}
|
||||
</html:style>
|
||||
<vbox class="panel-arrowcontainer" flex="1">
|
||||
<box class="panel-arrowbox" part="arrowbox">
|
||||
<image class="panel-arrow" part="arrow"/>
|
||||
@ -68,12 +73,7 @@
|
||||
}
|
||||
|
||||
if (!this.isArrowPanel) {
|
||||
const stylesheet = document.createElement("link");
|
||||
stylesheet.rel = "stylesheet";
|
||||
stylesheet.href = "chrome://global/skin/popup.css";
|
||||
|
||||
const slot = document.createElement("slot");
|
||||
this.shadowRoot.append(stylesheet, slot);
|
||||
this.shadowRoot.appendChild(document.createElement("slot"));
|
||||
} else {
|
||||
this.shadowRoot.appendChild(this.constructor.fragment);
|
||||
}
|
||||
|
||||
@ -225,16 +225,6 @@ panel {
|
||||
-moz-box-orient: vertical;
|
||||
}
|
||||
|
||||
menupopup,
|
||||
panel:not([type="arrow"]) {
|
||||
/* This should be in popup.css, but the stylesheet loads after the custom
|
||||
element initializes which is too late for widget code. */
|
||||
%ifdef XP_WIN
|
||||
background: Menu;
|
||||
border: 1px solid ThreeDShadow;
|
||||
%endif
|
||||
}
|
||||
|
||||
menupopup,
|
||||
panel,
|
||||
tooltip {
|
||||
@ -315,6 +305,10 @@ tooltip {
|
||||
%endif
|
||||
}
|
||||
|
||||
panel[type="arrow"][animating] {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/******** grid **********/
|
||||
|
||||
grid {
|
||||
|
||||
@ -1,51 +0,0 @@
|
||||
% 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/arrowpanel.inc.css
|
||||
|
||||
:host {
|
||||
min-width: 1px;
|
||||
}
|
||||
|
||||
:host([side="top"]),
|
||||
:host([side="bottom"]) {
|
||||
margin-inline: -20px;
|
||||
}
|
||||
|
||||
:host([side="left"]),
|
||||
:host([side="right"]) {
|
||||
margin-block: -20px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
border: 1px solid var(--arrowpanel-border-color);
|
||||
box-shadow: 0 0 4px hsla(0,0%,0%,.2);
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
:host([side="top"]) .panel-arrow,
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
margin-inline: 10px;
|
||||
}
|
||||
|
||||
:host([side="top"]) .panel-arrow {
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow,
|
||||
:host([side="right"]) .panel-arrow {
|
||||
margin-block: 10px;
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow {
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
:host([side="right"]) .panel-arrow {
|
||||
margin-left: -5px;
|
||||
}
|
||||
@ -5,7 +5,6 @@
|
||||
#include ../../shared/non-mac.jar.inc.mn
|
||||
|
||||
toolkit.jar:
|
||||
* skin/classic/global/arrowpanel.css
|
||||
skin/classic/global/autocomplete.css
|
||||
skin/classic/global/button.css
|
||||
skin/classic/global/checkbox.css
|
||||
|
||||
@ -3,29 +3,97 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
@namespace html url("http://www.w3.org/1999/xhtml");
|
||||
|
||||
:host {
|
||||
/* ::::: menupopup ::::: */
|
||||
|
||||
menupopup,
|
||||
panel {
|
||||
-moz-appearance: menupopup;
|
||||
min-width: 1px;
|
||||
color: MenuText;
|
||||
}
|
||||
|
||||
/* ::::: arrow panel ::::: */
|
||||
|
||||
panel[type="arrow"] {
|
||||
-moz-appearance: none;
|
||||
}
|
||||
|
||||
panel[type="arrow"][side="top"],
|
||||
panel[type="arrow"][side="bottom"] {
|
||||
margin-inline: -20px;
|
||||
}
|
||||
|
||||
panel[type="arrow"][side="left"],
|
||||
panel[type="arrow"][side="right"] {
|
||||
margin-block: -20px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
padding: var(--arrowpanel-padding);
|
||||
color: var(--arrowpanel-color);
|
||||
background: var(--arrowpanel-background);
|
||||
border: 1px solid var(--arrowpanel-border-color);
|
||||
box-shadow: 0 0 4px hsla(0,0%,0%,.2);
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent > html|slot {
|
||||
/* propagate border-radius from arrowcontent to slotted children */
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
panel[type="arrow"].panel-no-padding::part(arrowcontent) {
|
||||
padding: 0;
|
||||
overflow: hidden; /* Don't let panel content overflow the border */
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)::part(arrow) {
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: var(--arrowpanel-background);
|
||||
stroke: var(--arrowpanel-border-color);
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="top"]::part(arrow),
|
||||
:-moz-any(panel, menupopup)[side="bottom"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
|
||||
position: relative;
|
||||
margin-inline: 10px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="top"]::part(arrow) {
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="bottom"]::part(arrow) {
|
||||
transform: scaleY(-1);
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="left"]::part(arrow),
|
||||
:-moz-any(panel, menupopup)[side="right"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
|
||||
position: relative;
|
||||
margin-block: 10px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="left"]::part(arrow) {
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="right"]::part(arrow) {
|
||||
transform: scaleX(-1);
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
/* rules for popups associated with menulists */
|
||||
|
||||
:host(.in-menulist) {
|
||||
menulist > menupopup {
|
||||
padding: 0;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-up),
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-down) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbox) {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:host([customoptionstyling="true"]) {
|
||||
menupopup[customoptionstyling="true"] {
|
||||
-moz-appearance: none;
|
||||
}
|
||||
|
||||
@ -1,47 +0,0 @@
|
||||
% 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/arrowpanel.inc.css
|
||||
|
||||
:host([side="top"]),
|
||||
:host([side="bottom"]) {
|
||||
margin-inline: -25px;
|
||||
}
|
||||
|
||||
:host([side="left"]),
|
||||
:host([side="right"]) {
|
||||
margin-block: -25px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
border-radius: var(--arrowpanel-border-radius);
|
||||
box-shadow: 0 0 0 1px var(--arrowpanel-border-color);
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
:host([side="top"]) .panel-arrow,
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
margin-inline: 16px;
|
||||
}
|
||||
|
||||
:host([side="top"]) .panel-arrow {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow,
|
||||
:host([side="right"]) .panel-arrow {
|
||||
margin-block: 16px;
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow {
|
||||
margin-right: -1px;
|
||||
}
|
||||
|
||||
:host([side="right"]) .panel-arrow {
|
||||
margin-left: -1px;
|
||||
}
|
||||
@ -5,7 +5,6 @@
|
||||
#include ../../shared/jar.inc.mn
|
||||
|
||||
toolkit.jar:
|
||||
* skin/classic/global/arrowpanel.css
|
||||
skin/classic/global/autocomplete.css
|
||||
skin/classic/global/button.css
|
||||
skin/classic/global/checkbox.css
|
||||
|
||||
@ -165,8 +165,32 @@ menuseparator {
|
||||
padding: 1px 0;
|
||||
}
|
||||
|
||||
/* align menupopup submenus */
|
||||
/* Scroll buttons */
|
||||
|
||||
menupopup > menu > menupopup {
|
||||
margin-top: -4px;
|
||||
.menupopup-arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-up),
|
||||
.menupopup-arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-down) {
|
||||
position: relative;
|
||||
/* Here we're using a little magic.
|
||||
* The arrow button is supposed to overlay the scrollbox, blocking
|
||||
* everything under it from reaching the screen. However, the menu background
|
||||
* is slightly transparent, so how can we block something completely without
|
||||
* messing up the transparency? It's easy: The native theming of the
|
||||
* "menuitem" appearance uses CGContextClearRect before drawing, which
|
||||
* clears everything under it.
|
||||
* Without help from native theming this effect wouldn't be achievable.
|
||||
*/
|
||||
-moz-appearance: menuitem;
|
||||
}
|
||||
|
||||
.menupopup-arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-up) {
|
||||
margin-bottom: -16px;
|
||||
}
|
||||
|
||||
.menupopup-arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-down) {
|
||||
margin-top: -16px;
|
||||
}
|
||||
|
||||
.menupopup-arrowscrollbox:not(:-moz-lwtheme)[scrolledtostart="true"]::part(scrollbutton-up),
|
||||
.menupopup-arrowscrollbox:not(:-moz-lwtheme)[scrolledtoend="true"]::part(scrollbutton-down) {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
||||
@ -3,74 +3,110 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
@namespace html url("http://www.w3.org/1999/xhtml");
|
||||
|
||||
:host {
|
||||
menupopup,
|
||||
panel {
|
||||
-moz-appearance: menupopup;
|
||||
-moz-font-smoothing-background-color: -moz-mac-menupopup;
|
||||
background-color: Menu;
|
||||
color: MenuText;
|
||||
}
|
||||
|
||||
:host(panel[titlebar]) {
|
||||
-moz-appearance: none; /* to disable rounded corners */
|
||||
menupopup > menu > menupopup {
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
/* Scroll box */
|
||||
|
||||
:host(:not(.in-menulist)) arrowscrollbox {
|
||||
.menupopup-arrowscrollbox {
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-up),
|
||||
arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-down) {
|
||||
position: relative;
|
||||
/* Here we're using a little magic.
|
||||
* The arrow button is supposed to overlay the scrollbox, blocking
|
||||
* everything under it from reaching the screen. However, the menu background
|
||||
* is slightly transparent, so how can we block something completely without
|
||||
* messing up the transparency? It's easy: The native theming of the
|
||||
* "menuitem" appearance uses CGContextClearRect before drawing, which
|
||||
* clears everything under it.
|
||||
* Without help from native theming this effect wouldn't be achievable.
|
||||
*/
|
||||
-moz-appearance: menuitem;
|
||||
panel[titlebar] {
|
||||
-moz-appearance: none; /* to disable rounded corners */
|
||||
}
|
||||
|
||||
arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-up) {
|
||||
margin-bottom: -16px;
|
||||
panel[type="arrow"] {
|
||||
-moz-appearance: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
arrowscrollbox:not(:-moz-lwtheme)::part(scrollbutton-down) {
|
||||
margin-top: -16px;
|
||||
panel[type="arrow"][side="top"],
|
||||
panel[type="arrow"][side="bottom"] {
|
||||
margin-inline: -25px;
|
||||
}
|
||||
|
||||
arrowscrollbox:not(:-moz-lwtheme)[scrolledtostart="true"]::part(scrollbutton-up),
|
||||
arrowscrollbox:not(:-moz-lwtheme)[scrolledtoend="true"]::part(scrollbutton-down) {
|
||||
visibility: collapse;
|
||||
panel[type="arrow"][side="left"],
|
||||
panel[type="arrow"][side="right"] {
|
||||
margin-block: -25px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
-moz-appearance: none;
|
||||
-moz-font-smoothing-background-color: var(--arrowpanel-background);
|
||||
background: var(--arrowpanel-background);
|
||||
border-radius: var(--arrowpanel-border-radius);
|
||||
box-shadow: 0 0 0 1px var(--arrowpanel-border-color);
|
||||
color: var(--arrowpanel-color);
|
||||
border: none;
|
||||
padding: var(--arrowpanel-padding);
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent > html|slot {
|
||||
/* propagate border-radius from arrowcontent to slotted children */
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
panel[type="arrow"].panel-no-padding::part(arrowcontent) {
|
||||
padding: 0;
|
||||
overflow: hidden; /* Don't let panel content overflow the border-radius */
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)::part(arrow) {
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: var(--arrowpanel-background);
|
||||
stroke: var(--arrowpanel-border-color);
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="top"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
|
||||
margin-inline: 16px;
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="bottom"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
|
||||
-moz-transform: scaleY(-1);
|
||||
margin-inline: 16px;
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="left"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
|
||||
margin-block: 16px;
|
||||
margin-right: -1px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="right"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
|
||||
transform: scaleX(-1);
|
||||
margin-block: 16px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
/* rules for popups associated with menulists */
|
||||
|
||||
:host(.in-menulist) {
|
||||
menulist > menupopup {
|
||||
min-width: 0;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
:host(.in-menulist:not([position])) {
|
||||
menulist > menupopup:not([position]) {
|
||||
margin-inline-start: -13px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
:host([customoptionstyling="true"]) {
|
||||
menupopup[customoptionstyling="true"] {
|
||||
-moz-appearance: none;
|
||||
padding-block: 0;
|
||||
}
|
||||
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-up),
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-down) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbox) {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
@ -1,55 +0,0 @@
|
||||
/* 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/. */
|
||||
|
||||
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
@namespace html url("http://www.w3.org/1999/xhtml");
|
||||
|
||||
:host([animating]) {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
padding: var(--arrowpanel-padding);
|
||||
color: var(--arrowpanel-color);
|
||||
background: var(--arrowpanel-background);
|
||||
}
|
||||
|
||||
:host(.panel-no-padding) .panel-arrowcontent {
|
||||
padding: 0;
|
||||
overflow: hidden; /* Don't let panel content overflow the border-radius */
|
||||
}
|
||||
|
||||
:host([orient="vertical"]) .panel-arrowcontent {
|
||||
-moz-box-orient: vertical;
|
||||
}
|
||||
|
||||
.panel-arrowcontent > html|slot {
|
||||
/* Make border-radius: inherit work on slotted children */
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
.panel-arrow {
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: var(--arrowpanel-background);
|
||||
stroke: var(--arrowpanel-border-color);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
:host([side="top"]) .panel-arrow,
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow,
|
||||
:host([side="right"]) .panel-arrow {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
|
||||
}
|
||||
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
transform: scaleY(-1);
|
||||
}
|
||||
|
||||
:host([side="right"]) .panel-arrow {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
@ -1,70 +0,0 @@
|
||||
% 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/arrowpanel.inc.css
|
||||
|
||||
:host {
|
||||
padding: 0;
|
||||
min-width: 1px;
|
||||
}
|
||||
|
||||
:host([side="top"]),
|
||||
:host([side="bottom"]) {
|
||||
margin-inline: -20px;
|
||||
}
|
||||
|
||||
:host([side="left"]),
|
||||
:host([side="right"]) {
|
||||
margin-block: -20px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
border: 1px solid var(--arrowpanel-border-color);
|
||||
box-shadow: 0 0 4px hsla(0,0%,0%,.2);
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
%ifdef XP_WIN
|
||||
@media (-moz-os-version: windows-win7) {
|
||||
%endif
|
||||
.panel-arrowcontent {
|
||||
border-radius: 4px;
|
||||
}
|
||||
%ifdef XP_WIN
|
||||
}
|
||||
%endif
|
||||
|
||||
%ifdef XP_WIN
|
||||
@media (-moz-windows-default-theme) {
|
||||
.panel-arrowcontent {
|
||||
box-shadow: 0 0 4px hsla(210,4%,10%,.2);
|
||||
}
|
||||
}
|
||||
%endif
|
||||
|
||||
:host([side="top"]) .panel-arrow,
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
margin-inline: 10px;
|
||||
}
|
||||
|
||||
:host([side="top"]) .panel-arrow {
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
:host([side="bottom"]) .panel-arrow {
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow,
|
||||
:host([side="right"]) .panel-arrow {
|
||||
margin-block: 10px;
|
||||
}
|
||||
|
||||
:host([side="left"]) .panel-arrow {
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
:host([side="right"]) .panel-arrow {
|
||||
margin-left: -5px;
|
||||
}
|
||||
@ -5,7 +5,6 @@
|
||||
#include ../../shared/non-mac.jar.inc.mn
|
||||
|
||||
toolkit.jar:
|
||||
* skin/classic/global/arrowpanel.css
|
||||
skin/classic/global/autocomplete.css
|
||||
skin/classic/global/button.css
|
||||
skin/classic/global/checkbox.css
|
||||
@ -19,7 +18,7 @@ toolkit.jar:
|
||||
* skin/classic/global/findBar.css
|
||||
* skin/classic/global/global.css
|
||||
skin/classic/global/netError.css
|
||||
skin/classic/global/popup.css
|
||||
* skin/classic/global/popup.css
|
||||
* skin/classic/global/popupnotification.css
|
||||
skin/classic/global/printPageSetup.css
|
||||
skin/classic/global/richlistbox.css
|
||||
|
||||
@ -262,10 +262,3 @@ menulist > menupopup > menuseparator {
|
||||
border-top: 1px solid #000000;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* align menupopup submenus */
|
||||
|
||||
menupopup > menu > menupopup {
|
||||
margin-inline-start: -3px;
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
@ -3,8 +3,12 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
@namespace html url("http://www.w3.org/1999/xhtml");
|
||||
|
||||
:host {
|
||||
/* ::::: menupopup ::::: */
|
||||
|
||||
menupopup,
|
||||
panel {
|
||||
border: 1px solid ThreeDShadow;
|
||||
padding: 0;
|
||||
min-width: 1px;
|
||||
@ -12,23 +16,112 @@
|
||||
color: MenuText;
|
||||
}
|
||||
|
||||
:host(menupopup) {
|
||||
menupopup {
|
||||
-moz-appearance: menupopup;
|
||||
}
|
||||
|
||||
menupopup > menu > menupopup {
|
||||
/* align submenus */
|
||||
margin-inline-start: -3px;
|
||||
margin-top: -3px;
|
||||
}
|
||||
|
||||
panel[type="arrow"] {
|
||||
-moz-appearance: none;
|
||||
background: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
panel[type="arrow"][side="top"],
|
||||
panel[type="arrow"][side="bottom"] {
|
||||
margin-inline: -20px;
|
||||
}
|
||||
|
||||
panel[type="arrow"][side="left"],
|
||||
panel[type="arrow"][side="right"] {
|
||||
margin-block: -20px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent {
|
||||
padding: var(--arrowpanel-padding);
|
||||
color: var(--arrowpanel-color);
|
||||
background: var(--arrowpanel-background);
|
||||
background-clip: padding-box;
|
||||
border: 1px solid var(--arrowpanel-border-color);
|
||||
box-shadow: 0 0 4px hsla(0,0%,0%,.2);
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.panel-arrowcontent > html|slot {
|
||||
/* propagate border-radius from arrowcontent to slotted children */
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
%ifdef XP_WIN
|
||||
@media (-moz-os-version: windows-win7) {
|
||||
%endif
|
||||
.panel-arrowcontent {
|
||||
border-radius: 4px;
|
||||
}
|
||||
%ifdef XP_WIN
|
||||
}
|
||||
%endif
|
||||
|
||||
panel[type="arrow"].panel-no-padding::part(arrowcontent) {
|
||||
padding: 0;
|
||||
overflow: hidden; /* Don't let panel content overflow the border-radius */
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)::part(arrow) {
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: var(--arrowpanel-background);
|
||||
stroke: var(--arrowpanel-border-color);
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="top"]::part(arrow),
|
||||
:-moz-any(panel, menupopup)[side="bottom"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg");
|
||||
position: relative;
|
||||
margin-inline: 10px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="top"]::part(arrow) {
|
||||
margin-bottom: -5px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="bottom"]::part(arrow) {
|
||||
transform: scaleY(-1);
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="left"]::part(arrow),
|
||||
:-moz-any(panel, menupopup)[side="right"]::part(arrow) {
|
||||
list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg");
|
||||
position: relative;
|
||||
margin-block: 10px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="left"]::part(arrow) {
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
:-moz-any(panel, menupopup)[side="right"]::part(arrow) {
|
||||
transform: scaleX(-1);
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
%ifdef XP_WIN
|
||||
@media (-moz-windows-default-theme) {
|
||||
.panel-arrowcontent {
|
||||
box-shadow: 0 0 4px hsla(210,4%,10%,.2);
|
||||
}
|
||||
}
|
||||
%endif
|
||||
|
||||
/* rules for popups associated with menulists */
|
||||
|
||||
:host(.in-menulist) {
|
||||
menulist > menupopup {
|
||||
-moz-appearance: none;
|
||||
min-width: 0;
|
||||
background-color: -moz-Field;
|
||||
}
|
||||
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-up),
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbutton-down) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:host(.in-menulist) arrowscrollbox::part(scrollbox) {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user