#PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive {
}
+#PanelUI-menu-button[badge-status="addon-alert"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
+ height: 13px;
+ background: #FF0000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center;
+}
+
.panel-subviews {
padding: 4px;
background-clip: padding-box;
#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-fxa > #PanelUI-fxa-status > #PanelUI-fxa-avatar,
#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-fxa > #PanelUI-fxa-status > #PanelUI-fxa-label,
#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-fxa > #PanelUI-fxa-icon,
+#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-fxa-container > #PanelUI-fxa-status > #PanelUI-fxa-avatar,
+#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-fxa-container > #PanelUI-fxa-status > #PanelUI-fxa-label,
+#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-fxa-container > #PanelUI-fxa-icon,
#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > toolbarseparator,
#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > #PanelUI-customize,
#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > #PanelUI-help:not([panel-multiview-anchor="true"]) {
border-bottom-left-radius: 4px;
}
+#main-window[customizing] #PanelUI-fxa-container,
#main-window[customizing] #PanelUI-footer-fxa {
display: none;
}
+#PanelUI-fxa-container:not([fxastatus="signedin"]) > toolbarseparator,
+#PanelUI-fxa-container:not([fxastatus="signedin"]) > #PanelUI-fxa-icon,
+#PanelUI-fxa-container:not([fxaprofileimage]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar,
#PanelUI-footer-fxa:not([fxastatus="signedin"]) > toolbarseparator,
#PanelUI-footer-fxa:not([fxastatus="signedin"]) > #PanelUI-fxa-icon,
#PanelUI-footer-fxa:not([fxaprofileimage]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
display: none;
}
+#PanelUI-fxa-container[fxastatus="login-failed"] > #PanelUI-fxa-status::after,
+#PanelUI-fxa-container[fxastatus="unverified"] > #PanelUI-fxa-status::after,
#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status::after {
content: url("chrome://browser/skin/warning.svg");
width: 47px;
top: 25%;
}
-#PanelUI-update-status[update-status]::after {
+#PanelUI-update-status[update-status]::after,
+#PanelUI-footer-addons > toolbarbutton::after {
content: "";
width: 14px;
height: 14px;
- margin-right: 16.5px;
+ margin-inline-end: 16.5px;
border-radius: 2px;
background-size: contain;
display: -moz-box;
background-color: #FF0000;
}
+#PanelUI-footer-addons > toolbarbutton {
+ background-color: #A09090;
+ /* Force border to override `#PanelUI-footer-addons > toolbarbutton` selector below */
+ /*border-top: 1px solid hsl(45, 100%, 77%) !important;*/
+ display: flex;
+ flex: 1 1 0%;
+ width: calc(22.35em + 30px);
+ padding-inline-start: 15px;
+ border-inline-start-style: none;
+}
+
+#PanelUI-footer-addons > toolbarbutton:hover {
+ background-color: #FFCF00;
+}
+
+#PanelUI-footer-addons > toolbarbutton:active {
+ background-color: #FF9F00;
+}
+
+#PanelUI-footer-addons > toolbarbutton > .toolbarbutton-icon {
+ width: 14px;
+ height: 14px;
+}
+
+#PanelUI-footer-addons > toolbarbutton::after {
+ background: #FF0000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center;
+}
+
#PanelUI-fxa-status {
display: flex;
flex: 1 1 0%;
}
#PanelUI-footer-inner,
+#PanelUI-fxa-container:not([hidden]),
#PanelUI-footer-fxa:not([hidden]) {
display: flex;
border-top: 1px solid var(--panel-separator-color);
}
#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-inner,
+#PanelUI-multiView[viewtype="subview"] #PanelUI-fxa-container,
#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-fxa {
position: relative;
}
#PanelUI-footer-inner > toolbarseparator,
+#PanelUI-fxa-container > toolbarseparator,
#PanelUI-footer-fxa > toolbarseparator {
border: 0;
border-left: 1px solid var(--panel-separator-color);
}
#PanelUI-footer-inner:hover > toolbarseparator,
+#PanelUI-fxa-container:hover > toolbarseparator,
#PanelUI-footer-fxa:hover > toolbarseparator {
/* margin: 0;*/
}
#PanelUI-help,
#PanelUI-fxa-label,
#PanelUI-fxa-icon,
+#PanelUI-footer-addons > toolbarbutton,
#PanelUI-customize,
#PanelUI-quit {
margin: 0;
-moz-image-region: rect(0, 32px, 16px, 16px);
}
+/* FxAccount indicator bits. */
+#appMenu-fxa-label,
+#appMenu-fxa-icon {
+ padding: 4px;
+ -moz-appearance: none;
+ box-shadow: none;
+ border-radius: 0;
+ border: 0 none;
+ -moz-box-orient: horizontal;
+ -moz-image-region: rect(0, 16px, 16px, 0);
+ list-style-image: url(chrome://browser/skin/syncFx-horizontalbar.png);
+}
+
+#appMenu-fxa-label {
+ -moz-box-flex: 1;
+ padding-inline-start: 12px;
+ margin: 0;
+}
+
+#appMenu-fxa-icon {
+ margin: 0 10px;
+}
+
+#appMenu-fxa-icon > .toolbarbutton-text {
+ display: none;
+}
+
+#appMenu-fxa-icon[syncstatus="active"] {
+ list-style-image: url(chrome://browser/skin/syncFxProgress-horizontalbar.png);
+}
+
+#appMenu-fxa-avatar {
+ pointer-events: none;
+ list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg);
+}
+
+#appMenu-fxa-container {
+ -moz-box-orient: horizontal;
+}
+
+/* Handle different UI states. */
+#appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status > #appMenu-fxa-label > .toolbarbutton-icon,
+#appMenu-fxa-container:not([fxastatus="signedin"]) > toolbarseparator,
+#appMenu-fxa-container:not([fxastatus="signedin"]) > #appMenu-fxa-icon,
+#appMenu-fxa-container:not([fxastatus="signedin"]) > #appMenu-fxa-status > #appMenu-fxa-avatar {
+ display: none;
+}
+
+#appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status > #appMenu-fxa-label {
+ /* 12px space before the avatar, then 16px for the avatar */
+ padding-inline-start: 28px;
+ margin-inline-start: -28px;
+}
+#appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status {
+ margin-inline-end: 10px;
+}
+
+#appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status > #appMenu-fxa-avatar {
+ margin-inline-start: 12px;
+}
+
+#appMenu-fxa-container[fxastatus="signedin"] > toolbarseparator {
+ -moz-appearance: none;
+ height: 24px;
+ margin: 0;
+ border: 0 none;
+ width: 1px;
+ /* Use background: rather than background-color: to override background-image
+ * styles on OS X */
+ background: var(--arrowpanel-dimmed);
+}
+
+/* Error states */
+#appMenu-fxa-container[fxastatus="unverified"] > #appMenu-fxa-status > #appMenu-fxa-label,
+#appMenu-fxa-container[fxastatus="login-failed"] > #appMenu-fxa-status > #appMenu-fxa-label {
+ list-style-image: url(chrome://browser/skin/warning.svg);
+ -moz-image-region: rect(0, 16px, 16px, 0);
+}
+/*
+#appMenu-fxa-container[fxastatus="login-failed"],
+#appMenu-fxa-container[fxastatus="unverified"] {
+ background-color: var(--appmenu-yellow-warning-color);
+ border-top: 1px solid var(--appmenu-yellow-warning-border-color);
+ border-bottom: 1px solid var(--appmenu-yellow-warning-border-color);
+}
+
+#appMenu-fxa-container[fxastatus="login-failed"] > #appMenu-fxa-status:hover,
+#appMenu-fxa-container[fxastatus="unverified"] > #appMenu-fxa-status:hover {
+ background-color: var(--appmenu-yellow-warning-hover-color);
+}
+
+#appMenu-fxa-container[fxastatus="login-failed"] > #appMenu-fxa-status:hover:active,
+#appMenu-fxa-container[fxastatus="unverified"] > #appMenu-fxa-status:hover:active {
+ background-color: var(--appmenu-yellow-warning-active-color);
+}
+*/
#PanelUI-help,
#PanelUI-quit {
min-width: 44px;
#PanelUI-update-status > .toolbarbutton-text,
#PanelUI-fxa-label > .toolbarbutton-text,
+#PanelUI-footer-addons > toolbarbutton > .toolbarbutton-text,
#PanelUI-customize > .toolbarbutton-text {
margin: 0;
padding: 0 6px;
}
#PanelUI-fxa-label,
+#PanelUI-footer-addons > toolbarbutton,
#PanelUI-customize {
flex: 1;
padding-inline-start: 15px;
border-inline-start-style: none;
}
+#PanelUI-fxa-container[fxaprofileimage="set"] > #PanelUI-fxa-status > #PanelUI-fxa-label,
+#PanelUI-fxa-container[fxaprofileimage="enabled"]:not([fxastatus="error"]) > #PanelUI-fxa-status > #PanelUI-fxa-label,
#PanelUI-footer-fxa[fxaprofileimage="set"] > #PanelUI-fxa-status > #PanelUI-fxa-label,
#PanelUI-footer-fxa[fxaprofileimage="enabled"]:not([fxastatus="error"]) > #PanelUI-fxa-status > #PanelUI-fxa-label {
padding-inline-start: 0px;
list-style-image: url("chrome://browser/skin/syncFx-horizontalbar.png");
}
+#PanelUI-fxa-label:hover,
+#PanelUI-fxa-icon:hover {
+ list-style-image: url("chrome://browser/skin/syncFx-horizontalbar-hover.png");
+}
+
#PanelUI-remotetabs {
--panel-ui-sync-illustration-height: 157.5px;
}
}
.fxaSyncIllustration {
+ width: 180px;
height: var(--panel-ui-sync-illustration-height);
- list-style-image: url(chrome://browser/skin/fxa/sync-illustration.svg);
}
.PanelUI-remotetabs-prefs-button > .toolbarbutton-text {
list-style-image: url("chrome://browser/skin/syncFxProgress-horizontalbar.png");
}
-#PanelUI-footer-fxa[fxastatus="migrate-signup"] > #PanelUI-fxa-status > #PanelUI-fxa-label,
-#PanelUI-footer-fxa[fxastatus="migrate-verify"] > #PanelUI-fxa-status > #PanelUI-fxa-label {
- list-style-image: url(chrome://browser/skin/warning.svg);
- -moz-image-region: auto;
-}
-
#PanelUI-customize {
list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
}
#PanelUI-fxa-label,
#PanelUI-fxa-icon,
+#PanelUI-footer-addons > toolbarbutton,
#PanelUI-customize,
#PanelUI-help,
#PanelUI-quit {
-moz-image-region: rect(0, 16px, 16px, 0);
}
+#PanelUI-fxa-container[fxastatus="signedin"] > #PanelUI-fxa-status > #PanelUI-fxa-label > .toolbarbutton-icon,
+#PanelUI-fxa-container[fxastatus="error"][fxaprofileimage="set"] > #PanelUI-fxa-status > #PanelUI-fxa-label > .toolbarbutton-icon,
#PanelUI-footer-fxa[fxastatus="signedin"] > #PanelUI-fxa-status > #PanelUI-fxa-label > .toolbarbutton-icon,
#PanelUI-footer-fxa[fxastatus="error"][fxaprofileimage="set"] > #PanelUI-fxa-status > #PanelUI-fxa-label > .toolbarbutton-icon {
display: none;
}
+#PanelUI-fxa-container[fxastatus="error"]:not([fxaprofileimage="set"]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar,
#PanelUI-footer-fxa[fxastatus="error"]:not([fxaprofileimage="set"]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
display: none;
}
margin-inline-end: 0;
}
-#PanelUI-footer-fxa[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
+#PanelUI-footer-fxa[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar,
+#PanelUI-fxa-container[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg);
}
#PanelUI-fxa-icon:not([disabled]):hover:active {
}
+#PanelUI-fxa-container[fxastatus="error"],
#PanelUI-footer-fxa[fxastatus="error"] {
background-color: #FF0000;
color: #000000;
}
+#PanelUI-fxa-container[fxastatus="error"] > #PanelUI-fxa-status:hover,
#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status:hover {
background-color: #FFCF00;
}
+#PanelUI-fxa-container[fxastatus="error"] > #PanelUI-fxa-status:hover:active,
#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status:hover:active {
background-color: #FF9F00;
}
#BMB_bookmarksPopup menupopup[placespopup=true][singleitempopup=true] > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
/ These popups never have a footer /
#BMB_bookmarksToolbarPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
-#BMB_unsortedBookmarksPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox {
+#BMB_unsortedBookmarksPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
+#BMB_mobileBookmarksPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox {
/ And so they need some bottom padding: /
padding-bottom: 4px;
}
color: #A09090;
}
-#PanelUI-remotetabs-tabslist > toolbarbutton,
+#PanelUI-remotetabs-tabslist > toolbarbutton[itemtype="tab"],
#PanelUI-historyItems > toolbarbutton {
list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}
@media (min-resolution: 1.1dppx) {
- #PanelUI-remotetabs-tabslist > toolbarbutton,
+ #PanelUI-remotetabs-tabslist > toolbarbutton[itemtype="tab"],
#PanelUI-historyItems > toolbarbutton {
list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png");
}
}
-#PanelUI-remotetabs-tabslist > toolbarbutton > .toolbarbutton-icon,
+#PanelUI-remotetabs-tabslist > toolbarbutton[itemtype="tab"] > .toolbarbutton-icon,
#PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
#PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
#PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
/* === END panelUI.inc.css === */
.panel-subviews {
- background-color: var(--panel-arrowcontent-background);
+ background-color: var(--arrowpanel-background);
}
#PanelUI-contents #zoom-out-btn {
#BMB_bookmarksPopup menupopup[placespopup=true] > hbox {
/* emulating chrome://browser/content/places/menu.xml#places-popup-arrow but without the arrow */
/* box-shadow: 0 0 4px rgba(0,0,0,0.2);
- background: var(--panel-arrowcontent-background);
- border: 1px solid var(--panel-arrowcontent-border-color);
+ background: var(--arrowpanel-background);
+ color: var(--arrowpanel-color);
+ border: 1px solid var(--arrowpanel-border-color);
border-radius: 3.5px;
margin-top: -4px;*/
}