Back out 1fd1058d6099 (bug 1139698) for JP, bc and dt bustage

CLOSED TREE

browser/base/content/browser-fxaccounts.js

@@ -36,28 +36,12 @@ let gFxAccounts = {
       this.FxAccountsCommon.ONVERIFIED_NOTIFICATION,
       this.FxAccountsCommon.ONLOGOUT_NOTIFICATION,
       "weave:notification:removed",
-      this.FxAccountsCommon.ON_PROFILE_CHANGE_NOTIFICATION,
     ];
   },
 
-  get panelUIFooter() {
-    return document.getElementById("PanelUI-footer-fxa");
-  },
-
-  get panelUIStatus() {
-    return document.getElementById("PanelUI-fxa-status");
-  },
-
-  get panelUIAvatar() {
-    return document.getElementById("PanelUI-fxa-avatar");
-  },
-
-  get panelUILabel() {
-    return document.getElementById("PanelUI-fxa-label");
-  },
-
-  get panelUIIcon() {
-    return document.getElementById("PanelUI-fxa-icon");
+  get button() {
+    delete this.button;
+    return this.button = document.getElementById("PanelUI-fxa-status");
   },
 
   get strings() {
@@ -151,9 +135,6 @@ let gFxAccounts = {
           this.fxaMigrator.recordTelemetry(this.fxaMigrator.TELEMETRY_DECLINED);
         }
         break;
-      case this.FxAccountsCommon.ONPROFILE_IMAGE_CHANGE_NOTIFICATION:
-        this.updateUI();
-        break;
       default:
         this.updateUI();
         break;
@@ -230,96 +211,59 @@ let gFxAccounts = {
       return;
     }
 
-    let profileInfoEnabled = false;
-    try {
-      profileInfoEnabled = Services.prefs.getBoolPref("identity.fxaccounts.profile_image.enabled");
-    } catch (e) { }
-
     // Bail out if FxA is disabled.
     if (!this.weave.fxAccountsEnabled) {
       // When migration transitions from needs-verification to the null state,
       // fxAccountsEnabled is false because migration has not yet finished.  In
       // that case, hide the button.  We'll get another notification with a null
       // state once migration is complete.
-      this.panelUIFooter.removeAttribute("fxastatus");
+      this.button.hidden = true;
+      this.button.removeAttribute("fxastatus");
       return;
     }
 
+    // FxA is enabled, show the widget.
+    this.button.hidden = false;
+
     // Make sure the button is disabled in customization mode.
     if (this._inCustomizationMode) {
-      this.panelUILabel.setAttribute("disabled", "true");
-      this.panelUIAvatar.setAttribute("disabled", "true");
-      this.panelUIIcon.setAttribute("disabled", "true");
+      this.button.setAttribute("disabled", "true");
     } else {
-      this.panelUILabel.removeAttribute("disabled");
-      this.panelUIAvatar.removeAttribute("disabled");
-      this.panelUIIcon.removeAttribute("disabled");
+      this.button.removeAttribute("disabled");
     }
 
-    let defaultLabel = this.panelUIStatus.getAttribute("defaultlabel");
-    let errorLabel = this.panelUIStatus.getAttribute("errorlabel");
-    let signedInTooltiptext = this.panelUIStatus.getAttribute("signedinTooltiptext");
+    let defaultLabel = this.button.getAttribute("defaultlabel");
+    let errorLabel = this.button.getAttribute("errorlabel");
 
     // If the user is signed into their Firefox account and we are not
     // currently in customization mode, show their email address.
-    let doUpdate = (profile, userData) => {
-
+    let doUpdate = userData => {
       // Reset the button to its original state.
-      this.panelUILabel.setAttribute("label", defaultLabel);
-      this.panelUILabel.removeAttribute("tooltiptext");
-      this.panelUIAvatar.removeAttribute("tooltiptext");
-      this.panelUIFooter.removeAttribute("fxastatus");
-      this.panelUIFooter.removeAttribute("fxaprofileimage");
-      this.panelUIAvatar.style.removeProperty("background-image");
+      this.button.setAttribute("label", defaultLabel);
+      this.button.removeAttribute("tooltiptext");
+      this.button.removeAttribute("fxastatus");
 
       if (!this._inCustomizationMode) {
         if (this.loginFailed) {
           let tooltipDescription = this.strings.formatStringFromName("reconnectDescription", [userData.email], 1);
-          this.panelUIFooter.setAttribute("fxastatus", "error");
-          this.panelUILabel.setAttribute("label", errorLabel);
-          this.panelUIStatus.setAttribute("tooltiptext", tooltipDescription);
-          this.panelUIAvatar.setAttribute("tooltiptext", tooltipDescription);
-        } else {
-          let label = profile && profile.displayName ? profile.displayName : userData.email;
-          this.panelUIFooter.setAttribute("fxastatus", "signedin");
-          this.panelUILabel.setAttribute("label", label);
-          this.panelUIStatus.setAttribute("tooltiptext", signedInTooltiptext);
-          this.panelUIAvatar.setAttribute("tooltiptext", signedInTooltiptext);
-        }
-        if (profileInfoEnabled) {
-          this.panelUIFooter.setAttribute("fxaprofileimage", "enabled");
-          if (profile && profile.avatar) {
-            let img = new Image();
-            // Make sure the image is available before attempting to display it
-            img.onload = () => {
-              this.panelUIFooter.setAttribute("fxaprofileimage", "set");
-              this.panelUIAvatar.style.backgroundImage = "url('" + profile.avatar + "')";
-            };
-            img.src = profile.avatar;
-          }
+          this.button.setAttribute("fxastatus", "error");
+          this.button.setAttribute("label", errorLabel);
+          this.button.setAttribute("tooltiptext", tooltipDescription);
+        } else if (userData) {
+          this.button.setAttribute("fxastatus", "signedin");
+          this.button.setAttribute("label", userData.email);
+          this.button.setAttribute("tooltiptext", userData.email);
         }
       }
     }
-    let userData, profile;
-    // Calling getSignedInUserProfile() without a user logged in causes log
-    // noise that looks like an actual error...
-    fxAccounts.getSignedInUser().then(data => {
-      userData = data;
-      if (!userData) {
-        return null;
-      }
-      return fxAccounts.getSignedInUserProfile();
-    }).then(data => {
-      profile = data;
-      // profile may be null here, but that's expected.
-      doUpdate(profile, userData);
-    }).catch(error => {
+    fxAccounts.getSignedInUser().then(userData => {
+      doUpdate(userData);
+    }).then(null, error => {
       // This is most likely in tests, were we quickly log users in and out.
       // The most likely scenario is a user logged out, so reflect that.
       // Bug 995134 calls for better errors so we could retry if we were
       // sure this was the failure reason.
-      this.FxAccountsCommon.log.error("Error updating FxA profile", error);
-      doUpdate(profile, userData);
+      doUpdate(null);
     });
   },
 
@@ -330,7 +274,7 @@ let gFxAccounts = {
       case this.fxaMigrator.STATE_USER_FXA:
         status = "migrate-signup";
         label = this.strings.formatStringFromName("needUserShort",
-          [this.panelUILabel.getAttribute("fxabrandname")], 1);
+          [this.button.getAttribute("fxabrandname")], 1);
         break;
       case this.fxaMigrator.STATE_USER_FXA_VERIFIED:
         status = "migrate-verify";
@@ -339,8 +283,9 @@ let gFxAccounts = {
                                                   1);
         break;
     }
-    this.panelUILabel.label = label;
-    this.panelUIFooter.setAttribute("fxastatus", status);
+    this.button.label = label;
+    this.button.hidden = false;
+    this.button.setAttribute("fxastatus", status);
   }),
 
   updateMigrationNotification: Task.async(function* () {
@@ -407,9 +352,10 @@ let gFxAccounts = {
     Weave.Notifications.replaceTitle(note);
   }),
 
-  onMenuPanelCommand: function () {
+  onMenuPanelCommand: function (event) {
+    let button = event.originalTarget;
 
-    switch (this.panelUIFooter.getAttribute("fxastatus")) {
+    switch (button.getAttribute("fxastatus")) {
     case "signedin":
       this.openPreferences();
       break;

browser/base/content/browser-syncui.js

@@ -166,15 +166,8 @@ let gSyncUI = {
       return;
 
     let syncButton = document.getElementById("sync-button");
-    let statusButton = document.getElementById("PanelUI-fxa-icon");
-    if (needsSetup) {
-      if (syncButton) {
-        syncButton.removeAttribute("tooltiptext");
-      }
-      if (statusButton) {
-        statusButton.removeAttribute("tooltiptext");
-      }
-    }
+    if (needsSetup && syncButton)
+      syncButton.removeAttribute("tooltiptext");
 
     this._updateLastSyncTime();
   },
@@ -191,9 +184,9 @@ let gSyncUI = {
       if (button) {
         button.setAttribute("status", "active");
       }
-      let container = document.getElementById("PanelUI-footer-fxa");
-      if (container) {
-        container.setAttribute("syncstatus", "active");
+      button = document.getElementById("PanelUI-fxa-status");
+      if (button) {
+        button.setAttribute("syncstatus", "active");
       }
     }
   },
@@ -217,9 +210,9 @@ let gSyncUI = {
     if (syncButton) {
       syncButton.removeAttribute("status");
     }
-    let fxaContainer = document.getElementById("PanelUI-footer-fxa");
-    if (fxaContainer) {
-      fxaContainer.removeAttribute("syncstatus");
+    let panelHorizontalButton = document.getElementById("PanelUI-fxa-status");
+    if (panelHorizontalButton) {
+      panelHorizontalButton.removeAttribute("syncstatus");
     }
   },
 
@@ -425,7 +418,8 @@ let gSyncUI = {
       return;
 
     let syncButton = document.getElementById("sync-button");
-    let statusButton = document.getElementById("PanelUI-fxa-icon");
+    if (!syncButton)
+      return;
 
     let lastSync;
     try {
@@ -441,12 +435,7 @@ let gSyncUI = {
     }
     catch (e) { };
     if (!lastSync || this._needsSetup()) {
-      if (syncButton) {
-        syncButton.removeAttribute("tooltiptext");
-      }
-      if (statusButton) {
-        statusButton.removeAttribute("tooltiptext");
-      }
+      syncButton.removeAttribute("tooltiptext");
       return;
     }
 
@@ -455,12 +444,7 @@ let gSyncUI = {
     let lastSyncLabel =
       this._stringBundle.formatStringFromName("lastSync2.label", [lastSyncDateString], 1);
 
-    if (syncButton) {
-      syncButton.setAttribute("tooltiptext", lastSyncLabel);
-    }
-    if (statusButton) {
-      statusButton.setAttribute("tooltiptext", lastSyncLabel);
-    }
+    syncButton.setAttribute("tooltiptext", lastSyncLabel);
   },
 
   clearError: function SUI_clearError(errorString) {

browser/base/content/test/general/browser_fxa_migrate.js

@@ -9,24 +9,24 @@ Cu.import("resource://services-sync/FxaMigrator.jsm", imports);
 
 add_task(function* test() {
   // Fake the state where we need an FxA user.
-  let fxaPanelUIPromise = promiseButtonMutation();
+  let buttonPromise = promiseButtonMutation();
   Services.obs.notifyObservers(null, STATE_CHANGED_TOPIC,
                                imports.fxaMigrator.STATE_USER_FXA);
-  let buttonState = yield fxaPanelUIPromise;
-  assertButtonState(buttonState, "migrate-signup");
+  let buttonState = yield buttonPromise;
+  assertButtonState(buttonState, "migrate-signup", true);
   Assert.ok(Weave.Notifications.notifications.some(n => {
     return n.title == NOTIFICATION_TITLE;
   }), "Needs-user notification should be present");
 
   // Fake the state where we need a verified FxA user.
-  fxaPanelUIPromise = promiseButtonMutation();
+  buttonPromise = promiseButtonMutation();
   let email = Cc["@mozilla.org/supports-string;1"].
               createInstance(Ci.nsISupportsString);
   email.data = "foo@example.com";
   Services.obs.notifyObservers(email, STATE_CHANGED_TOPIC,
                                imports.fxaMigrator.STATE_USER_FXA_VERIFIED);
-  buttonState = yield fxaPanelUIPromise;
-  assertButtonState(buttonState, "migrate-verify",
+  buttonState = yield buttonPromise;
+  assertButtonState(buttonState, "migrate-verify", true,
                     "foo@example.com not verified");
   let note = Weave.Notifications.notifications.find(n => {
     return n.title == NOTIFICATION_TITLE;
@@ -36,22 +36,23 @@ add_task(function* test() {
             "Needs-verification notification should include email");
 
   // Fake the state where no migration is needed.
-  fxaPanelUIPromise = promiseButtonMutation();
+  buttonPromise = promiseButtonMutation();
   Services.obs.notifyObservers(null, STATE_CHANGED_TOPIC, null);
-  buttonState = yield fxaPanelUIPromise;
+  buttonState = yield buttonPromise;
   // In this case, the front end has called fxAccounts.getSignedInUser() to
   // update the button label and status.  But since there isn't actually a user,
   // the button is left with no fxastatus.
-  assertButtonState(buttonState, "");
+  assertButtonState(buttonState, "", true);
   Assert.ok(!Weave.Notifications.notifications.some(n => {
     return n.title == NOTIFICATION_TITLE;
   }), "Migration notifications should no longer be present");
 });
 
-function assertButtonState(buttonState, expectedStatus,
+function assertButtonState(buttonState, expectedStatus, expectedVisible,
                            expectedLabel=undefined) {
   Assert.equal(buttonState.fxastatus, expectedStatus,
                "Button fxstatus attribute");
+  Assert.equal(!buttonState.hidden, expectedVisible, "Button visibility");
   if (expectedLabel !== undefined) {
     Assert.equal(buttonState.label, expectedLabel, "Button label");
   }
@@ -65,11 +66,12 @@ function promiseButtonMutation() {
       if (mutations.some(m => m.attributeName == "fxastatus")) {
         obs.disconnect();
         resolve({
-          fxastatus: gFxAccounts.panelUIFooter.getAttribute("fxastatus"),
-          label: gFxAccounts.panelUILabel.label,
+          fxastatus: gFxAccounts.button.getAttribute("fxastatus"),
+          hidden: gFxAccounts.button.hidden,
+          label: gFxAccounts.button.label,
         });
       }
     });
-    obs.observe(gFxAccounts.panelUIFooter, { attributes: true });
+    obs.observe(gFxAccounts.button, { attributes: true });
   });
 }

browser/base/content/test/general/browser_syncui.js

@@ -255,13 +255,13 @@ add_task(function* testRLLoginErrorRemains() {
 
 function checkButtonsStatus(shouldBeActive) {
   let button = document.getElementById("sync-button");
-  let fxaContainer = document.getElementById("PanelUI-footer-fxa");
+  let panelbutton = document.getElementById("PanelUI-fxa-status");
   if (shouldBeActive) {
     Assert.equal(button.getAttribute("status"), "active");
-    Assert.equal(fxaContainer.getAttribute("syncstatus"), "active");
+    Assert.equal(panelbutton.getAttribute("syncstatus"), "active");
   } else {
     Assert.ok(!button.hasAttribute("status"));
-    Assert.ok(!fxaContainer.hasAttribute("syncstatus"));
+    Assert.ok(!panelbutton.hasAttribute("syncstatus"));
   }
 }
 

browser/components/customizableui/content/panelUI.inc.xul

@@ -20,21 +20,12 @@
                        oncommand="gMenuButtonUpdateBadge.onMenuPanelCommand(event);"
                        wrap="true"
                        hidden="true"/>
-        <hbox id="PanelUI-footer-fxa">
-          <hbox id="PanelUI-fxa-status"
-                defaultlabel="&fxaSignIn.label;"
-                signedinTooltiptext="&fxaSignedIn.tooltip;"
-                errorlabel="&fxaSignInError.label;"
-                onclick="gFxAccounts.onMenuPanelCommand();">
-            <image id="PanelUI-fxa-avatar"/>
-            <toolbarbutton id="PanelUI-fxa-label"
-                           fxabrandname="&syncBrand.fxAccount.label;"/>
-          </hbox>
-          <toolbarseparator/>
-          <toolbarbutton id="PanelUI-fxa-icon"
-                         oncommand="gSyncUI.doSync();"
-                         closemenu="none"/>
-        </hbox>
+        <toolbarbutton id="PanelUI-fxa-status"
+                       defaultlabel="&fxaSignIn.label;"
+                       errorlabel="&fxaSignInError.label;"
+                       fxabrandname="&syncBrand.fxAccount.label;"
+                       oncommand="gFxAccounts.onMenuPanelCommand(event);"
+                       hidden="true"/>
 
         <hbox id="PanelUI-footer-inner">
           <toolbarbutton id="PanelUI-customize" label="&appMenuCustomize.label;"

browser/components/uitour/UITour.jsm

@@ -96,12 +96,12 @@ this.UITour = {
   targets: new Map([
     ["accountStatus", {
       query: (aDocument) => {
-        let statusButton = aDocument.getElementById("PanelUI-fxa-label");
+        let statusButton = aDocument.getElementById("PanelUI-fxa-status");
         return aDocument.getAnonymousElementByAttribute(statusButton,
                                                         "class",
                                                         "toolbarbutton-icon");
       },
-      widgetName: "PanelUI-fxa-label",
+      widgetName: "PanelUI-fxa-status",
     }],
     ["addons",      {query: "#add-ons-button"}],
     ["appMenu",     {

browser/locales/en-US/chrome/browser/browser.dtd

@@ -110,7 +110,6 @@ These should match what Safari and other Apple applications use on OS X Lion. --
 <!ENTITY showAllTabsCmd.accesskey "A">
 
 <!ENTITY fxaSignIn.label "Sign in to &syncBrand.shortName.label;">
-<!ENTITY fxaSignedIn.tooltip "Open &syncBrand.shortName.label; preferences">
 <!ENTITY fxaSignInError.label "Reconnect to &syncBrand.shortName.label;">
 <!ENTITY syncStartPanel2.heading "&syncBrand.shortName.label; enabled">
 <!ENTITY syncStartPanel2.subTitle "&brandShortName; will begin syncing momentarily.">

browser/themes/linux/customizableui/panelUIOverlay.css

@@ -92,8 +92,7 @@ menu.subviewbutton > .menu-right:-moz-locale-dir(rtl) {
 .PanelUI-subView toolbarseparator,
 .PanelUI-subView menuseparator,
 .cui-widget-panelview menuseparator,
-#PanelUI-footer-inner > toolbarseparator,
-#PanelUI-footer-fxa > toolbarseparator {
+#PanelUI-footer-inner > toolbarseparator {
   -moz-appearance: none !important;
 }
 

browser/themes/linux/jar.mn

@@ -220,7 +220,7 @@ browser.jar:
   skin/classic/browser/preferences/in-content/favicon.ico     (../shared/incontentprefs/favicon.ico)
   skin/classic/browser/preferences/in-content/icons.svg       (../shared/incontentprefs/icons.svg)
   skin/classic/browser/preferences/in-content/search.css      (../shared/incontentprefs/search.css)
-  skin/classic/browser/fxa/default-profile-image.svg   (../shared/fxa/default-profile-image.svg)
+  skin/classic/browser/preferences/in-content/default-profile-image.svg   (../shared/incontentprefs/default-profile-image.svg)
   skin/classic/browser/preferences/applications.css   (preferences/applications.css)
   skin/classic/browser/preferences/aboutPermissions.css (preferences/aboutPermissions.css)
   skin/classic/browser/preferences/search.css         (preferences/search.css)

browser/themes/osx/jar.mn

@@ -296,7 +296,7 @@ browser.jar:
   skin/classic/browser/preferences/in-content/favicon.ico     (../shared/incontentprefs/favicon.ico)
   skin/classic/browser/preferences/in-content/icons.svg       (../shared/incontentprefs/icons.svg)
   skin/classic/browser/preferences/in-content/search.css      (../shared/incontentprefs/search.css)
-  skin/classic/browser/fxa/default-profile-image.svg   (../shared/fxa/default-profile-image.svg)
+  skin/classic/browser/preferences/in-content/default-profile-image.svg   (../shared/incontentprefs/default-profile-image.svg)
   skin/classic/browser/preferences/applications.css         (preferences/applications.css)
   skin/classic/browser/preferences/aboutPermissions.css     (preferences/aboutPermissions.css)
   skin/classic/browser/preferences/search.css               (preferences/search.css)

browser/themes/shared/customizableui/panelUIOverlay.inc.css

@@ -404,10 +404,8 @@ toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
 
 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-contents-scroller > #PanelUI-contents > .panel-wide-item,
 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-contents-scroller > #PanelUI-contents > .toolbarbutton-1:not([panel-multiview-anchor="true"]),
+#PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-fxa-status,
 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-update-status,
-#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-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"]) {
@@ -505,49 +503,29 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
   margin: 0;
 }
 
-#main-window[customizing] #PanelUI-footer-fxa > toolbarseparator {
-  display: none;
-}
-
-#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-status {
-  display: flex;
-  flex: 1 1 0%;
-}
-
-#PanelUI-footer-inner,
-#PanelUI-footer-fxa {
+#PanelUI-footer-inner {
   display: flex;
   border-top: 1px solid hsla(210,4%,10%,.14);
 }
 
-#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-inner,
-#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-fxa {
+#PanelUI-multiView[viewtype="subview"] #PanelUI-footer-inner {
   position: relative;
 }
 
-#PanelUI-footer-inner > toolbarseparator,
-#PanelUI-footer-fxa > toolbarseparator {
+#PanelUI-footer-inner > toolbarseparator {
   border: 0;
   border-left: 1px solid hsla(210,4%,10%,.14);
   margin: 7px 0 7px;
   -moz-appearance: none;
 }
 
-#PanelUI-footer-inner:hover > toolbarseparator,
-#PanelUI-footer-fxa:hover > toolbarseparator {
+#PanelUI-footer-inner:hover > toolbarseparator {
   margin: 0;
 }
 
 #PanelUI-update-status,
 #PanelUI-help,
-#PanelUI-fxa-label,
-#PanelUI-fxa-icon,
+#PanelUI-fxa-status,
 #PanelUI-customize,
 #PanelUI-quit {
   margin: 0;
@@ -562,16 +540,15 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
   -moz-box-orient: horizontal;
 }
 
-#PanelUI-update-status {
+#PanelUI-update-status,
+#PanelUI-fxa-status {
   border-top: 1px solid hsla(210,4%,10%,.14);
-}
-
-#PanelUI-update-status {
   border-bottom: 1px solid transparent;
   margin-bottom: -1px;
 }
 
-#PanelUI-update-status > .toolbarbutton-text {
+#PanelUI-update-status > .toolbarbutton-text,
+#PanelUI-fxa-status > .toolbarbutton-text {
   width: 0; /* Fancy cropping solution for flexbox. */
 }
 
@@ -581,7 +558,7 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
 }
 
 #PanelUI-update-status > .toolbarbutton-text,
-#PanelUI-fxa-label > .toolbarbutton-text,
+#PanelUI-fxa-status > .toolbarbutton-text,
 #PanelUI-customize > .toolbarbutton-text {
   margin: 0;
   padding: 0 6px;
@@ -589,37 +566,25 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
 }
 
 #PanelUI-help > .toolbarbutton-text,
-#PanelUI-quit > .toolbarbutton-text,
-#PanelUI-fxa-avatar > .toolbarbutton-text {
+#PanelUI-quit > .toolbarbutton-text {
   display: none;
 }
 
 #PanelUI-update-status > .toolbarbutton-icon,
-#PanelUI-fxa-label > .toolbarbutton-icon,
-#PanelUI-fxa-icon > .toolbarbutton-icon,
+#PanelUI-fxa-status > .toolbarbutton-icon,
 #PanelUI-customize > .toolbarbutton-icon,
 #PanelUI-help > .toolbarbutton-icon,
 #PanelUI-quit > .toolbarbutton-icon {
   -moz-margin-end: 0;
 }
 
-#PanelUI-fxa-icon {
-  -moz-padding-start: 15px;
-  -moz-padding-end: 15px;
-}
-
-#PanelUI-fxa-label,
+#PanelUI-fxa-status,
 #PanelUI-customize {
   flex: 1;
   -moz-padding-start: 15px;
   -moz-border-start-style: none;
 }
 
-#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 {
-  -moz-padding-start: 0px;
-}
-
 #PanelUI-update-status {
   width: calc(@menuPanelWidth@ + 30px);
   -moz-padding-start: 15px;
@@ -630,18 +595,17 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
   list-style-image: url(chrome://branding/content/icon16.png);
 }
 
-#PanelUI-fxa-label,
-#PanelUI-fxa-icon {
+#PanelUI-fxa-status {
   list-style-image: url(chrome://browser/skin/sync-horizontalbar.png);
 }
 
-#PanelUI-footer-fxa[syncstatus="active"] > #PanelUI-fxa-icon {
+#PanelUI-fxa-status[syncstatus="active"] {
   list-style-image: url(chrome://browser/skin/syncProgress-horizontalbar.png);
 }
 
-#PanelUI-fxa-icon[fxastatus="migrate-signup"],
-#PanelUI-fxa-icon[fxastatus="migrate-verify"] {
-  list-style-image: url(chrome://browser/skni/warning16.png);
+#PanelUI-fxa-status[fxastatus="migrate-signup"],
+#PanelUI-fxa-status[fxastatus="migrate-verify"] {
+  list-style-image: url(chrome://browser/skin/warning16.png);
   -moz-image-region: rect(0, 32px, 16px, 16px);
 }
 
@@ -662,46 +626,13 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
   list-style-image: url(chrome://browser/skin/menuPanel-exit.png);
 }
 
-#PanelUI-fxa-label,
-#PanelUI-fxa-icon,
+#PanelUI-fxa-status,
 #PanelUI-customize,
 #PanelUI-help,
 #PanelUI-quit {
   -moz-image-region: rect(0, 16px, 16px, 0);
 }
 
-#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-footer-fxa[fxastatus="error"]:not([fxaprofileimage="set"]) > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
-  display: none;
-}
-
-#PanelUI-fxa-avatar[disabled],
-#PanelUI-fxa-icon[disabled] {
-  display: none;
-}
-
-#PanelUI-fxa-avatar {
-  width: 32px;
-  height: 32px;
-  border-radius: 50%;
-  background-repeat: no-repeat;
-  background-position: 0 0;
-  background-size: contain;
-  align-self: center;
-  margin: 0px 7px;
-  padding: 0px;
-  border: 0px none;
-  -moz-margin-end: 0;
-}
-
-#PanelUI-footer-fxa[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar {
-  list-style-image: url(chrome://browser/skin/fxa/default-profile-image.svg);
-}
-
 #PanelUI-customize:hover,
 #PanelUI-help:not([disabled]):hover,
 #PanelUI-quit:not([disabled]):hover {
@@ -724,7 +655,6 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
 }
 
 #PanelUI-fxa-status:not([disabled]):hover,
-#PanelUI-fxa-icon:not([disabled]):hover,
 #PanelUI-help:not([disabled]):hover,
 #PanelUI-customize:hover,
 #PanelUI-quit:not([disabled]):hover {
@@ -733,7 +663,6 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
 }
 
 #PanelUI-fxa-status:not([disabled]):hover:active,
-#PanelUI-fxa-icon:not([disabled]):hover:active,
 #PanelUI-help:not([disabled]):hover:active,
 #PanelUI-customize:hover:active,
 #PanelUI-quit:not([disabled]):hover:active {
@@ -743,26 +672,10 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
 }
 
 #PanelUI-fxa-status:not([disabled]):hover,
-#PanelUI-fxa-status:not([disabled]):hover:active,
-#PanelUI-fxa-icon:not([disabled]):hover,
-#PanelUI-fxa-icon:not([disabled]):hover:active {
+#PanelUI-fxa-status:not([disabled]):hover:active {
   outline: none;
 }
 
-#PanelUI-footer-fxa[fxastatus="error"] {
-  background-color: rgb(255, 236, 158);
-  border-top: 1px solid rgb(254, 212, 21);
-}
-
-#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status:hover {
-  background-color: #F9E79A;
-}
-
-#PanelUI-footer-fxa[fxastatus="error"] > #PanelUI-fxa-status:hover:active {
-  background-color: #ECDB92;
-  box-shadow: 0 1px 0 hsla(210,4%,10%,.05) inset;
-}
-
 #PanelUI-update-status {
   color: black;
 }
@@ -1495,17 +1408,16 @@ menuitem[checked="true"].subviewbutton > .menu-iconic-left {
     list-style-image: url(chrome://branding/content/icon32.png);
   }
 
-  #PanelUI-fxa-label,
-  #PanelUI-fxa-icon {
+  #PanelUI-fxa-status {
     list-style-image: url(chrome://browser/skin/sync-horizontalbar@2x.png);
   }
 
-  #PanelUI-footer-fxa[syncstatus="active"] > #PanelUI-fxa-icon {
+  #PanelUI-fxa-status[syncstatus="active"] {
     list-style-image: url(chrome://browser/skin/syncProgress-horizontalbar@2x.png);
   }
 
-  #PanelUI-fxa-icon[fxastatus="migrate-signup"],
-  #PanelUI-fxa-icon[fxastatus="migrate-verify"] {
+  #PanelUI-fxa-status[fxastatus="migrate-signup"],
+  #PanelUI-fxa-status[fxastatus="migrate-verify"] {
     list-style-image: url(chrome://browser/skin/warning16@2x.png);
     -moz-image-region: rect(0, 64px, 32px, 32px);
   }
@@ -1526,8 +1438,7 @@ menuitem[checked="true"].subviewbutton > .menu-iconic-left {
     list-style-image: url(chrome://browser/skin/menuPanel-exit@2x.png);
   }
 
-  #PanelUI-fxa-label,
-  #PanelUI-fxa-icon,
+  #PanelUI-fxa-status,
   #PanelUI-customize,
   #PanelUI-help,
   #PanelUI-quit {
@@ -1535,8 +1446,7 @@ menuitem[checked="true"].subviewbutton > .menu-iconic-left {
   }
 
   #PanelUI-update-status > .toolbarbutton-icon,
-  #PanelUI-fxa-label > .toolbarbutton-icon,
-  #PanelUI-fxa-icon > .toolbarbutton-icon,
+  #PanelUI-fxa-status > .toolbarbutton-icon,
   #PanelUI-customize > .toolbarbutton-icon,
   #PanelUI-help > .toolbarbutton-icon,
   #PanelUI-quit > .toolbarbutton-icon {

browser/themes/shared/incontentprefs/preferences.inc.css

@@ -221,7 +221,7 @@ description > html|a {
   border-radius: 50%;
   border-width: 5px;
   border-color: red;
-  background-image: url(chrome://browser/skin/fxa/default-profile-image.svg);
+  background-image: url(chrome://browser/skin/preferences/in-content/default-profile-image.svg);
   background-size: contain;
   cursor: pointer;
   -moz-margin-end: 15px;

browser/themes/windows/customizableui/panelUIOverlay.css

@@ -197,16 +197,16 @@ menu.subviewbutton > .menu-right:-moz-locale-dir(rtl) {
     text-shadow: none;
   }
 
-  #PanelUI-fxa-label,
+  #PanelUI-fxa-status,
   #PanelUI-help,
   #PanelUI-customize {
     border: 1px solid transparent;
   }
 
-  #PanelUI-fxa-label:not([disabled]):hover,
+  #PanelUI-fxa-status:not([disabled]):hover,
   #PanelUI-help:not([disabled]):hover,
   #PanelUI-customize:hover,
-  #PanelUI-fxa-label:not([disabled]):hover:active,
+  #PanelUI-fxa-status:not([disabled]):hover:active,
   #PanelUI-help:not([disabled]):hover:active,
   #PanelUI-customize:hover:active {
     border-color: ThreeDLightShadow;

browser/themes/windows/jar.mn

@@ -292,7 +292,7 @@ browser.jar:
         skin/classic/browser/preferences/in-content/favicon.ico      (../shared/incontentprefs/favicon.ico)
         skin/classic/browser/preferences/in-content/icons.svg        (../shared/incontentprefs/icons.svg)
         skin/classic/browser/preferences/in-content/search.css       (../shared/incontentprefs/search.css)
-        skin/classic/browser/fxa/default-profile-image.svg   (../shared/fxa/default-profile-image.svg)
+        skin/classic/browser/preferences/in-content/default-profile-image.svg   (../shared/incontentprefs/default-profile-image.svg)
         skin/classic/browser/preferences/applications.css            (preferences/applications.css)
         skin/classic/browser/preferences/aboutPermissions.css        (preferences/aboutPermissions.css)
         skin/classic/browser/preferences/search.css                  (preferences/search.css)