Bug 1355020 - part 3: add notification container and styling for photon hamburger panel, r?mikedeboer
MozReview-Commit-ID: 4Jajbo9pzg5
--- a/browser/components/customizableui/content/panelUI.inc.xul
+++ b/browser/components/customizableui/content/panelUI.inc.xul
@@ -493,16 +493,24 @@
type="arrow"
hidden="true"
flip="slide"
position="bottomcenter topright"
noautofocus="true">
<panelmultiview id="appMenu-multiView" mainViewId="appMenu-mainView">
<panelview id="appMenu-mainView" class="cui-widget-panelview PanelUI-subView">
<vbox class="panel-subview-body">
+ <vbox id="appMenu-addon-banners"/>
+ <toolbarbutton class="panel-banner-item"
+ label-update-available="&updateAvailable.panelUI.label;"
+ label-update-manual="&updateManual.panelUI.label;"
+ label-update-restart="&updateRestart.panelUI.label;"
+ oncommand="PanelUI._onBannerItemSelected(event)"
+ wrap="true"
+ hidden="true"/>
<toolbarbutton id="appMenu-new-window-button"
class="subviewbutton subviewbutton-iconic"
label="&newNavigatorCmd.label;"
key="key_newNavigator"
command="cmd_newNavigator"/>
<toolbarbutton id="appMenu-private-window-button"
class="subviewbutton subviewbutton-iconic"
label="&newPrivateWindow.label;"
--- a/browser/components/customizableui/content/panelUI.js
+++ b/browser/components/customizableui/content/panelUI.js
@@ -32,17 +32,17 @@ const PanelUI = {
contents: "PanelUI-contents",
mainView: gPhotonStructure ? "appMenu-mainView" : "PanelUI-mainView",
multiView: gPhotonStructure ? "appMenu-multiView" : "PanelUI-multiView",
helpView: "PanelUI-helpView",
menuButton: "PanelUI-menu-button",
panel: gPhotonStructure ? "appMenu-popup" : "PanelUI-popup",
notificationPanel: "appMenu-notification-popup",
scroller: "PanelUI-contents-scroller",
- addonNotificationContainer: "PanelUI-footer-addons",
+ addonNotificationContainer: gPhotonStructure ? "appMenu-addon-banners" : "PanelUI-footer-addons",
overflowFixedList: gPhotonStructure ? "widget-overflow-fixed-list" : "",
};
},
_initialized: false,
init() {
for (let [k, v] of Object.entries(this.kElements)) {
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -309,17 +309,17 @@ panelmultiview[nosubviews=true] > .panel
padding: 0;
}
panelview[id^=PanelUI-webext-] {
overflow: hidden;
}
panelview:not([mainview]) .toolbarbutton-text,
-.cui-widget-panel toolbarbutton > .toolbarbutton-text {
+.cui-widget-panel toolbarbutton:not([wrap]) > .toolbarbutton-text {
text-align: start;
display: -moz-box;
}
.cui-widget-panel > .panel-arrowcontainer > .panel-arrowcontent {
padding: 4px 0;
}
@@ -670,16 +670,25 @@ toolbarpaletteitem[place="palette"] > to
}
.panel-banner-item {
border-top: 1px solid var(--panel-separator-color);
border-bottom: 1px solid transparent;
margin-bottom: -1px;
}
+/* in Photon, we have a bottom border as well. Reconcile with the above rule
+ * after photon launch. */
+#appMenu-mainView > .panel-subview-body > .panel-banner-item {
+ border-bottom: 1px solid var(--panel-separator-color);
+ margin-bottom: 3px;
+ padding-inline-start: 10px;
+}
+
+
.panel-banner-item > .toolbarbutton-text {
width: 0; /* Fancy cropping solution for flexbox. */
}
#PanelUI-help,
#PanelUI-quit {
min-width: 46px;
}