Bug 1399145 - Make sure that the start padding for the FxA button in its signed-in state is adjusted on OSX only. r?Gijs
MozReview-Commit-ID: GSItfXcScLJ
--- a/browser/themes/osx/customizableui/panelUI.css
+++ b/browser/themes/osx/customizableui/panelUI.css
@@ -15,16 +15,26 @@
.subviewbutton {
padding-inline-start: 18px;
}
photonpanelmultiview .toolbaritem-combined-buttons > label {
padding-inline-start: 42px; /* 18px toolbarbutton padding + 16px icon + 8px label padding start */
}
+#appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status > #appMenu-fxa-label {
+ /* 18px space before the avatar, then 16px for the avatar */
+ padding-inline-start: 34px;
+ margin-inline-start: -34px;
+}
+
+#appMenu-fxa-container[fxastatus="signedin"] > #appMenu-fxa-status > #appMenu-fxa-avatar {
+ margin-inline-start: 18px;
+}
+
.subviewbutton[checked="true"] {
background-position: top 7px left 4px;
}
.subviewbutton[checked="true"]:-moz-locale-dir(rtl) {
background-position: top 7px right 4px;
}
--- a/browser/themes/shared/customizableui/panelUI.inc.css
+++ b/browser/themes/shared/customizableui/panelUI.inc.css
@@ -824,23 +824,23 @@ toolbaritem[cui-areatype="menu-panel"][s
#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 {
- /* 18px space before the avatar, then 16px for the avatar */
- padding-inline-start: 34px;
- margin-inline-start: -34px;
+ /* 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 > #appMenu-fxa-avatar {
- margin-inline-start: 18px;
+ margin-inline-start: 12px;
}
/* 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);
}