Bug 1456219 - Add default Light and Dark themes to TB. r=jorgk a=jorgk
authorRichard Marti <richard.marti@gmail.com>
Mon, 23 Apr 2018 10:52:55 +0200
changeset 31418 b6abecf3a8e13e56fc8d9ccb539e10d40017eaf3
parent 31417 5461aa9fc88ca52b75e830cca8ca6ca2a9e05ff8
child 31419 c3e64abc3311a2c3475886d57b7f57f193c390e0
push id383
push userclokep@gmail.com
push dateMon, 07 May 2018 21:52:48 +0000
reviewersjorgk, jorgk
bugs1456219
Bug 1456219 - Add default Light and Dark themes to TB. r=jorgk a=jorgk
mail/base/content/dark.icon.svg
mail/base/content/light.icon.svg
mail/base/content/mail-compacttheme.js
mail/base/content/messenger.xul
mail/base/content/msgMail3PaneWindow.js
mail/base/jar.mn
mail/components/addrbook/content/addressbook.js
mail/components/addrbook/content/addressbook.xul
mail/components/compose/content/MsgComposeCommands.js
mail/components/compose/content/messengercompose.xul
mail/components/mailGlue.js
mail/locales/en-US/chrome/messenger/messenger.properties
mail/themes/linux/jar.mn
mail/themes/linux/mail/compacttheme.css
mail/themes/linux/mail/messenger.css
mail/themes/osx/jar.mn
mail/themes/osx/mail/compacttheme.css
mail/themes/shared/jar.inc.mn
mail/themes/shared/mail/compacttheme.css
mail/themes/windows/jar.mn
mail/themes/windows/mail/compacttheme.css
new file mode 100644
--- /dev/null
+++ b/mail/base/content/dark.icon.svg
@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+  <path fill="#0c0c0d" d="M2 2h14v13H2z"/>
+  <path fill="#323234" d="M16 2v13H2v15h28V2H16z"/>
+  <rect x="1" y="1" width="30" height="30" rx="2" ry="2" fill="none" stroke="#08091a" stroke-opacity=".35" stroke-width="2"/>
+  <circle cx="9.5" cy="22.5" r="6" fill="#474749" stroke="#08091a"/>
+  <path d="M12.5 22H7.707l2.146-2.146a.5.5 0 0 0-.707-.707l-3 3a.5.5 0 0 0 0 .708l3 3a.5.5 0 1 0 .707-.707L7.707 23H12.5a.5.5 0 0 0 0-1z" fill="#f9f9fa" fill-opacity=".8"/>
+  <path d="M20.5 20h4a.5.5 0 0 0 0-1h-4a.5.5 0 0 0 0 1zm4 2h-4a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1zm0 3h-4a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1z" fill="#f9f9fa" fill-opacity=".8"/>
+  <path fill="#0a84ff" d="M16 2h14v1H16z"/>
+  <path d="M26.354 8.646l-3.5-3.5a.5.5 0 0 0-.707 0l-3.5 3.5a.5.5 0 0 0 .707.707L20 8.707V11.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5V8.707l.646.646a.5.5 0 1 0 .707-.707zM24 11h-1V9h-1v2h-1V7.707l1.5-1.5 1.5 1.5z" fill="#f9f9fa" fill-opacity=".8"/>
+  <path fill="#08091a" d="M15 2v12H2v1h14V2h-1z"/>
+</svg>
\ No newline at end of file
new file mode 100644
--- /dev/null
+++ b/mail/base/content/light.icon.svg
@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+  <path fill="#e1e1e5" d="M2 2h14v13H2z"/>
+  <path fill="#f9f9fa" d="M16 2v13H2v15h28V2H16z"/>
+  <rect x="1" y="1" width="30" height="30" rx="2" ry="2" fill="none" stroke="#08091a" stroke-opacity=".35" stroke-width="2"/>
+  <circle cx="9.5" cy="22.5" r="6" fill="#fff" stroke="#adadb3"/>
+  <path d="M12.5 22H7.707l2.146-2.146a.5.5 0 0 0-.707-.707l-3 3a.5.5 0 0 0 0 .708l3 3a.5.5 0 1 0 .707-.707L7.707 23H12.5a.5.5 0 0 0 0-1z" fill="#0c0c0d" fill-opacity=".8"/>
+  <path d="M20.5 20h4a.5.5 0 0 0 0-1h-4a.5.5 0 0 0 0 1zm4 2h-4a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1zm0 3h-4a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1z" fill="#0c0c0d" fill-opacity=".8"/>
+  <path fill="#0a84ff" d="M16 2h14v1H16z"/>
+  <path d="M26.354 8.646l-3.5-3.5a.5.5 0 0 0-.707 0l-3.5 3.5a.5.5 0 0 0 .707.707L20 8.707V11.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5V8.707l.646.646a.5.5 0 1 0 .707-.707zM24 11h-1V9h-1v2h-1V7.707l1.5-1.5 1.5 1.5z" fill="#0c0c0d" fill-opacity=".8"/>
+  <path fill="#08091a" fill-opacity=".25" d="M15 2v12H2v1h14V2h-1z"/>
+</svg>
\ No newline at end of file
new file mode 100644
--- /dev/null
+++ b/mail/base/content/mail-compacttheme.js
@@ -0,0 +1,68 @@
+/* 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/. */
+
+/**
+ * Enables compacttheme.css when needed.
+ */
+var CompactTheme = {
+  get styleSheet() {
+    delete this.styleSheet;
+    for (let styleSheet of document.styleSheets) {
+      if (styleSheet.href == "chrome://messenger/skin/compacttheme.css") {
+        this.styleSheet = styleSheet;
+        break;
+      }
+    }
+    return this.styleSheet;
+  },
+
+  get isStyleSheetEnabled() {
+    return this.styleSheet && !this.styleSheet.disabled;
+  },
+
+  get isThemeCurrentlyApplied() {
+    let theme = LightweightThemeManager.currentTheme;
+    return theme && (
+           theme.id == "thunderbird-compact-dark@mozilla.org" ||
+           theme.id == "thunderbird-compact-light@mozilla.org");
+  },
+
+  init() {
+    Services.obs.addObserver(this, "lightweight-theme-styling-update");
+
+    if (this.isThemeCurrentlyApplied) {
+      this._toggleStyleSheet(true);
+    }
+  },
+
+  observe(subject, topic, data) {
+    if (topic == "lightweight-theme-styling-update") {
+      let newTheme = JSON.parse(data);
+      if (newTheme && (
+          newTheme.id == "thunderbird-compact-light@mozilla.org" ||
+          newTheme.id == "thunderbird-compact-dark@mozilla.org")) {
+        // We are using the theme ID on this object instead of always referencing
+        // LightweightThemeManager.currentTheme in case this is a preview
+        this._toggleStyleSheet(true);
+      } else {
+        this._toggleStyleSheet(false);
+      }
+
+    }
+  },
+
+  _toggleStyleSheet(enabled) {
+    let wasEnabled = this.isStyleSheetEnabled;
+    if (enabled) {
+      this.styleSheet.disabled = false;
+    } else if (!enabled && wasEnabled) {
+      this.styleSheet.disabled = true;
+    }
+  },
+
+  uninit() {
+    Services.obs.removeObserver(this, "lightweight-theme-styling-update");
+    this.styleSheet = null;
+  }
+};
--- a/mail/base/content/messenger.xul
+++ b/mail/base/content/messenger.xul
@@ -5,16 +5,17 @@
 
 #filter substitution
 
 <?xml-stylesheet href="chrome://messenger/skin/mailWindow1.css" type="text/css"?>
 <?xml-stylesheet href="chrome://gloda/content/glodacomplete.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/content/bindings.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/content/tabmail.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/tabmail.css" type="text/css"?>
+<?xml-stylesheet href="chrome://messenger/skin/compacttheme.css" type="text/css" alternate="yes" title="Light/Dark"?>
 
 <?xul-overlay href="chrome://communicator/content/utilityOverlay.xul"?>
 <?xul-overlay href="chrome://messenger/content/msgHdrViewOverlay.xul"?>
 <?xul-overlay href="chrome://messenger/content/mailWindowOverlay.xul"?>
 <?xul-overlay href="chrome://messenger/content/extraCustomizeItems.xul"?>
 <?xul-overlay href="chrome://messenger/content/mailOverlay.xul"?>
 <?xul-overlay href="chrome://messenger/content/editContactOverlay.xul"?>
 <?xul-overlay href="chrome://messenger/content/specialTabs.xul"?>
@@ -64,16 +65,17 @@
   <stringbundle id="bundle_read_smime" src="chrome://messenger-smime/locale/msgReadSMIMEOverlay.properties"/>
 </stringbundleset>
 
 <script type="application/javascript" src="chrome://global/content/globalOverlay.js"/>
 <script type="application/javascript" src="chrome://messenger/content/commandglue.js"/>
 <script type="application/javascript" src="chrome://messenger/content/shareglue.js"/>
 <script type="application/javascript" src="chrome://messenger/content/msgViewNavigation.js"/>
 <script type="application/javascript" src="chrome://messenger/content/mailWindow.js"/>
+<script type="application/javascript" src="chrome://messenger/content/mail-compacttheme.js"/>
 <script type="application/javascript" src="chrome://messenger/content/selectionsummaries.js"/>
 <script type="application/javascript" src="chrome://messenger/content/msgMail3PaneWindow.js"/>
 <script type="application/javascript" src="chrome://messenger/content/specialTabs.js"/>
 <!-- accountProvisionerTab.js relies on code from specialTabs.js, and so much be loaded after it. -->
 <script type="application/javascript" src="chrome://messenger/content/newmailaccount/accountProvisionerTab.js"/>
 <script type="application/javascript" src="chrome://messenger/content/glodaFacetTab.js"/>
 <script type="application/javascript" src="chrome://messenger/content/searchBar.js"/>
 <script type="application/javascript" src="chrome://messenger/content/mail3PaneWindowCommands.js"/>
--- a/mail/base/content/msgMail3PaneWindow.js
+++ b/mail/base/content/msgMail3PaneWindow.js
@@ -15,16 +15,20 @@ ChromeUtils.import("resource:///modules/
 ChromeUtils.import("resource:///modules/msgDBCacheManager.js");
 ChromeUtils.import("resource:///modules/sessionStoreManager.js");
 ChromeUtils.import("resource:///modules/summaryFrameManager.js");
 ChromeUtils.import("resource:///modules/MailUtils.js");
 ChromeUtils.import("resource://gre/modules/Services.jsm");
 ChromeUtils.import("resource://gre/modules/AppConstants.jsm");
 ChromeUtils.import("resource://gre/modules/Color.jsm");
 
+XPCOMUtils.defineLazyModuleGetters(this, {
+  LightweightThemeManager: "resource://gre/modules/LightweightThemeManager.jsm",
+});
+
 /* This is where functions related to the 3 pane window are kept */
 
 // from MailNewsTypes.h
 var nsMsgKey_None = 0xFFFFFFFF;
 var nsMsgViewIndex_None = 0xFFFFFFFF;
 var kMailCheckOncePrefName = "mail.startup.enabledMailCheckOnce";
 
 var kStandardPaneConfig = 0;
@@ -334,16 +338,17 @@ function AutoConfigWizard(okCallback)
 function OnLoadMessenger()
 {
   migrateMailnews();
   // Rig up our TabsInTitlebar early so that we can catch any resize events.
   TabsInTitlebar.init();
   // update the pane config before we exit onload otherwise the user may see a flicker if we poke the document
   // in delayedOnLoadMessenger...
   UpdateMailPaneConfig(false);
+  CompactTheme.init();
 
   if (AppConstants.platform == "win") {
     // On Win8 set an attribute when the window frame color is too dark for black text.
     if (window.matchMedia("(-moz-os-version: windows-win8)").matches &&
         window.matchMedia("(-moz-windows-default-theme)").matches) {
       let windowFrameColor = new Color(...ChromeUtils.import("resource:///modules/Windows8WindowFrameColor.jsm", {})
                                             .Windows8WindowFrameColor.get());
       // Default to black for foreground text.
@@ -626,16 +631,18 @@ function OnUnloadMessenger()
   }
 
   sessionStoreManager.unloadingWindow(window);
 
   TabsInTitlebar.uninit();
 
   ToolbarIconColor.uninit();
 
+  CompactTheme.uninit();
+
   let tabmail = document.getElementById("tabmail");
   tabmail._teardown();
 
   MailServices.mailSession.RemoveFolderListener(folderListener);
 
   gPhishingDetector.shutdown();
 
   Services.obs.removeObserver(gPluginHandler.pluginCrashed, "plugin-crashed");
--- a/mail/base/jar.mn
+++ b/mail/base/jar.mn
@@ -17,16 +17,17 @@ messenger.jar:
 % style chrome://messenger/content/customizeToolbar.xul chrome://messenger/skin/smime/msgCompSMIMEOverlay.css
 % style chrome://messenger/content/customizeToolbar.xul chrome://messenger/skin/messageHeader.css
 % style chrome://messenger/content/customizeToolbar.xul chrome://messenger/skin/primaryToolbar.css
     content/messenger/mailWindow.js                 (content/mailWindow.js)
     content/messenger/messageDisplay.js             (content/messageDisplay.js)
     content/messenger/extensionsOverlay.css         (content/extensionsOverlay.css)
     content/messenger/extensionsOverlay.xul         (content/extensionsOverlay.xul)
     content/messenger/folderDisplay.js              (content/folderDisplay.js)
+    content/messenger/mail-compacttheme.js          (content/mail-compacttheme.js)
     content/messenger/mailWindowOverlay.js          (content/mailWindowOverlay.js)
 *   content/messenger/mailWindowOverlay.xul         (content/mailWindowOverlay.xul)
     content/messenger/extraCustomizeItems.xul       (content/extraCustomizeItems.xul)
 *   content/messenger/mailOverlay.xul               (content/mailOverlay.xul)
 *   content/messenger/messageWindow.xul             (content/messageWindow.xul)
     content/messenger/messageWindow.js              (content/messageWindow.js)
     content/messenger/mailContextMenus.js           (content/mailContextMenus.js)
     content/messenger/nsContextMenu.js              (content/nsContextMenu.js)
@@ -89,16 +90,18 @@ messenger.jar:
 *   content/messenger/viewSourceOverlay.xul         (content/viewSourceOverlay.xul)
     content/messenger/configEditorOverlay.xul       (content/configEditorOverlay.xul)
     content/messenger/EdSpellCheckOverlay.xul       (content/EdSpellCheckOverlay.xul)
     content/messenger/EdSpellCheckOverlay.js        (content/EdSpellCheckOverlay.js)
     content/messenger/composerOverlay.css           (content/composerOverlay.css)
     content/messenger/threadPane.js                 (content/threadPane.js)
     content/messenger/threadPaneColumnPicker.xml    (content/threadPaneColumnPicker.xml)
     content/messenger/protovis-r2.6-modded.js       (content/protovis-r2.6-modded.js)
+    content/messenger/dark.icon.svg                 (content/dark.icon.svg)
+    content/messenger/light.icon.svg                (content/light.icon.svg)
 #ifdef XP_MACOSX
     content/messenger/macMessengerOverlay.xul       (content/macMessengerOverlay.xul)
     content/messenger/macMessengerOverlay.js        (content/macMessengerOverlay.js)
 #endif
     content/messenger/selectionsummaries.js         (content/selectionsummaries.js)
     content/messenger/multimessageview.css          (content/multimessageview.css)
     content/messenger/multimessageview_print.css    (content/multimessageview_print.css)
     content/messenger/sharedsummary.css             (content/sharedsummary.css)
--- a/mail/components/addrbook/content/addressbook.js
+++ b/mail/components/addrbook/content/addressbook.js
@@ -7,16 +7,20 @@
 
 // Ensure the activity modules are loaded for this window.
 ChromeUtils.import("resource:///modules/activity/activityModules.js");
 ChromeUtils.import("resource:///modules/ABQueryUtils.jsm");
 ChromeUtils.import("resource:///modules/mailServices.js");
 ChromeUtils.import("resource://gre/modules/PluralForm.jsm");
 ChromeUtils.import("resource://gre/modules/Services.jsm");
 
+XPCOMUtils.defineLazyModuleGetters(this, {
+  LightweightThemeManager: "resource://gre/modules/LightweightThemeManager.jsm",
+});
+
 var nsIAbListener = Ci.nsIAbListener;
 var kPrefMailAddrBookLastNameFirst = "mail.addr_book.lastnamefirst";
 var kPersistCollapseMapStorage = "directoryTree.json";
 
 var gSearchTimer = null;
 var gStatusText = null;
 var gQueryURIFormat = null;
 var gCardViewBox;
@@ -113,16 +117,17 @@ function OnUnloadAddressBook()
 
   // Shutdown the tree view - this will also save the open/collapsed
   // state of the tree view to a JSON file.
   gDirectoryTreeView.shutdown(kPersistCollapseMapStorage);
 
   MailServices.mailSession.RemoveMsgWindow(msgWindow);
 
   ToolbarIconColor.uninit();
+  CompactTheme.uninit();
 
   CloseAbView();
 }
 
 var gAddressBookAbViewListener = {
   onSelectionChanged: function() {
     ResultsPaneSelectionChanged();
   },
@@ -154,16 +159,17 @@ function OnLoadAddressBook()
 
     document.documentElement.setAttribute("width", defaultWidth);
     document.documentElement.setAttribute("height", defaultHeight);
     // Make sure we're safe at the left/top edge of screen
     document.documentElement.setAttribute("screenX", screen.availLeft);
     document.documentElement.setAttribute("screenY", screen.availTop);
   }
 
+  CompactTheme.init();
   ToolbarIconColor.init();
 
   if (!chatHandler.ChatCore.initialized)
     chatHandler.ChatCore.init();
 
   setTimeout(delayedOnLoadAddressBook, 0); // when debugging, set this to 5000, so you can see what happens after the window comes up.
 }
 
--- a/mail/components/addrbook/content/addressbook.xul
+++ b/mail/components/addrbook/content/addressbook.xul
@@ -2,16 +2,17 @@
 
 # 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/.
 
 <?xml-stylesheet href="chrome://messenger/content/bindings.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/searchBox.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/addressbook/addressbook.css" type="text/css"?>
+<?xml-stylesheet href="chrome://messenger/skin/compacttheme.css" type="text/css" alternate="yes" title="Light/Dark"?>
 
 <!DOCTYPE window [
 <!ENTITY % abMainWindowDTD SYSTEM "chrome://messenger/locale/addressbook/abMainWindow.dtd" >
 %abMainWindowDTD;
 <!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd" >
 %brandDTD;
 <!ENTITY % customizeToolbarDTD SYSTEM "chrome://messenger/locale/customizeToolbar.dtd">
 %customizeToolbarDTD;
@@ -38,16 +39,17 @@
     <stringbundle id="bundle_messenger" src="chrome://messenger/locale/messenger.properties"/>
     <stringbundle id="bundle_brand" src="chrome://branding/locale/brand.properties"/>
   </stringbundleset>
 
 <script type="application/javascript" src="chrome://messenger/content/jsTreeView.js"/>
 <script type="application/javascript" src="chrome://messenger/content/addressbook/abTrees.js"/>
 <script type="application/javascript" src="chrome://messenger/content/accountUtils.js"/>
 <script type="application/javascript" src="chrome://messenger/content/mailCore.js"/>
+<script type="application/javascript" src="chrome://messenger/content/mail-compacttheme.js"/>
 <script type="application/javascript" src="chrome://messenger/content/addressbook/addressbook.js"/>
 <script type="application/javascript" src="chrome://messenger/content/addressbook/abCommon.js"/>
 <script type="application/javascript" src="chrome://communicator/content/contentAreaClick.js"/>
 <script type="application/javascript" src="chrome://global/content/printUtils.js"/>
 <script type="application/javascript" src="chrome://messenger/content/msgPrintEngine.js"/>
 
 <!-- move needed functions into a single js file -->
 <script type="application/javascript" src="chrome://communicator/content/utilityOverlay.js"/>
--- a/mail/components/compose/content/MsgComposeCommands.js
+++ b/mail/components/compose/content/MsgComposeCommands.js
@@ -21,16 +21,20 @@ ChromeUtils.import("resource://gre/modul
 ChromeUtils.import("resource://gre/modules/Services.jsm");
 ChromeUtils.import("resource://gre/modules/XPCOMUtils.jsm");
 ChromeUtils.import("resource://gre/modules/AppConstants.jsm");
 
 ChromeUtils.defineModuleGetter(this, "OS", "resource://gre/modules/osfile.jsm");
 ChromeUtils.defineModuleGetter(this, "ShortcutUtils",
                                "resource://gre/modules/ShortcutUtils.jsm");
 
+XPCOMUtils.defineLazyModuleGetters(this, {
+  LightweightThemeManager: "resource://gre/modules/LightweightThemeManager.jsm",
+});
+
 /**
  * interfaces
  */
 var nsIMsgCompDeliverMode = Ci.nsIMsgCompDeliverMode;
 var nsIMsgCompSendFormat = Ci.nsIMsgCompSendFormat;
 var nsIMsgCompConvertible = Ci.nsIMsgCompConvertible;
 var nsIMsgCompType = Ci.nsIMsgCompType;
 var nsIMsgCompFormat = Ci.nsIMsgCompFormat;
@@ -3102,16 +3106,17 @@ function ComposeLoad()
     Cu.reportError(ex);
     Services.prompt.alert(window, getComposeBundle().getString("initErrorDlogTitle"),
                           getComposeBundle().getString("initErrorDlgMessage"));
 
     MsgComposeCloseWindow();
     return;
   }
 
+  CompactTheme.init();
   ToolbarIconColor.init();
 
   // initialize the customizeDone method on the customizeable toolbar
   var toolbox = document.getElementById("compose-toolbox");
   toolbox.customizeDone = function(aEvent) { MailToolboxCustomizeDone(aEvent, "CustomizeComposeToolbar"); };
 
   var toolbarset = document.getElementById('customToolbars');
   toolbox.toolbarset = toolbarset;
@@ -3140,16 +3145,17 @@ function ComposeUnload()
   EditorCleanup();
 
   if (gMsgCompose)
     gMsgCompose.removeMsgSendListener(gSendListener);
 
   RemoveMessageComposeOfflineQuitObserver();
   gAttachmentNotifier.shutdown();
   ToolbarIconColor.uninit();
+  CompactTheme.uninit();
 
   // Stop observing dictionary removals.
   dictionaryRemovalObserver.removeObserver();
 
   if (gMsgCompose)
     gMsgCompose.UnregisterStateListener(stateListener);
   if (gAutoSaveTimeout)
     clearTimeout(gAutoSaveTimeout);
--- a/mail/components/compose/content/messengercompose.xul
+++ b/mail/components/compose/content/messengercompose.xul
@@ -3,16 +3,17 @@
 # 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/.
 
 <?xml-stylesheet href="chrome://messenger/content/bindings.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/messengercompose/messengercompose.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/folderMenus.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/attachmentList.css" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/skin/smime/msgCompSMIMEOverlay.css" type="text/css"?>
+<?xml-stylesheet href="chrome://messenger/skin/compacttheme.css" type="text/css" alternate="yes" title="Light/Dark"?>
 <?xul-overlay href="chrome://editor/content/editorOverlay.xul"?>
 <?xul-overlay href="chrome://communicator/content/charsetOverlay.xul"?>
 
 <!DOCTYPE window [
   <!ENTITY % messengercomposeDTD SYSTEM "chrome://messenger/locale/messengercompose/messengercompose.dtd" >
   %messengercomposeDTD;
   <!ENTITY % brandDTD SYSTEM "chrome://branding/locale/brand.dtd" >
   %brandDTD;
@@ -50,16 +51,17 @@
   <stringbundle id="bundle_messenger"   src="chrome://messenger/locale/messenger.properties"/>
   <stringbundle id="brandBundle"        src="chrome://branding/locale/brand.properties"/>
   <stringbundle id="bundle_comp_smime"  src="chrome://messenger-smime/locale/msgCompSMIMEOverlay.properties"/>
 </stringbundleset>
 
 <script type="application/javascript" src="chrome://global/content/printUtils.js"/>
 <script type="application/javascript" src="chrome://messenger/content/accountUtils.js"/>
 <script type="application/javascript" src="chrome://messenger/content/mailCore.js"/>
+<script type="application/javascript" src="chrome://messenger/content/mail-compacttheme.js"/>
 <script type="application/javascript" src="chrome://communicator/content/contentAreaClick.js"/>
 <script type="application/javascript" src="chrome://editor/content/editor.js"/>
 <script type="application/javascript" src="chrome://messenger/content/messengercompose/MsgComposeCommands.js"/>
 <script type="application/javascript" src="chrome://messenger/content/messengercompose/bigFileObserver.js"/>
 <script type="application/javascript" src="chrome://messenger/content/messengercompose/cloudAttachmentLinkManager.js"/>
 
 <!-- drag and drop -->
 <script type="application/javascript" src="chrome://messenger/content/addressbook/abDragDrop.js"/>
--- a/mail/components/mailGlue.js
+++ b/mail/components/mailGlue.js
@@ -6,16 +6,30 @@
 ChromeUtils.import("resource://gre/modules/XPCOMUtils.jsm");
 ChromeUtils.import("resource://gre/modules/Services.jsm");
 ChromeUtils.import("resource://gre/modules/AddonManager.jsm");
 ChromeUtils.import("resource://gre/modules/LightweightThemeConsumer.jsm");
 ChromeUtils.import("resource:///modules/distribution.js");
 ChromeUtils.import("resource:///modules/mailMigrator.js");
 ChromeUtils.import("resource:///modules/extensionSupport.jsm");
 
+// lazy module getters
+
+XPCOMUtils.defineLazyModuleGetters(this, {
+  LightweightThemeManager: "resource://gre/modules/LightweightThemeManager.jsm",
+});
+
+XPCOMUtils.defineLazyGetter(this, "gBrandBundle", function() {
+  return Services.strings.createBundle("chrome://branding/locale/brand.properties");
+});
+
+XPCOMUtils.defineLazyGetter(this, "gMailBundle", function() {
+  return Services.strings.createBundle("chrome://messenger/locale/messenger.properties");
+});
+
 /**
  * Glue code that should be executed before any windows are opened. Any
  * window-independent helper methods (a la nsBrowserGlue.js) should go in
  * MailUtils.js instead.
  */
 
 function MailGlue() {
   XPCOMUtils.defineLazyGetter(this, "_sanitizer",
@@ -90,16 +104,40 @@ MailGlue.prototype = {
     // handle any migration work that has to happen at profile startup
     MailMigrator.migrateAtProfileStartup();
 
     // check if we're in safe mode
     if (Services.appinfo.inSafeMode) {
       Services.ww.openWindow(null, "chrome://messenger/content/safeMode.xul",
                              "_blank", "chrome,centerscreen,modal,resizable=no", null);
     }
+
+    let vendorShortName = gBrandBundle.GetStringFromName("vendorShortName");
+
+    LightweightThemeManager.addBuiltInTheme({
+      id: "thunderbird-compact-light@mozilla.org",
+      name: gMailBundle.GetStringFromName("lightTheme.name"),
+      description: gMailBundle.GetStringFromName("lightTheme.description"),
+      iconURL: "resource:///chrome/messenger/content/messenger/light.icon.svg",
+      textcolor: "black",
+      accentcolor: "white",
+      author: vendorShortName,
+    });
+    LightweightThemeManager.addBuiltInTheme({
+      id: "thunderbird-compact-dark@mozilla.org",
+      name: gMailBundle.GetStringFromName("darkTheme.name"),
+      description: gMailBundle.GetStringFromName("darkTheme.description"),
+      iconURL: "resource:///chrome/messenger/content/messenger/dark.icon.svg",
+      textcolor: "white",
+      accentcolor: "black",
+      popup: "#4a4a4f",
+      popup_text: "rgb(249, 249, 250)",
+      popup_border: "#27272b",
+      author: vendorShortName,
+    });
   },
 
   _onMailStartupDone: function MailGlue__onMailStartupDone() {
     // On Windows 7 and above, initialize the jump list module.
     const WINTASKBAR_CONTRACTID = "@mozilla.org/windows-taskbar;1";
     if (WINTASKBAR_CONTRACTID in Cc &&
         Cc[WINTASKBAR_CONTRACTID].getService(Ci.nsIWinTaskbar).available) {
       ChromeUtils.import("resource:///modules/windowsJumpLists.js");
--- a/mail/locales/en-US/chrome/messenger/messenger.properties
+++ b/mail/locales/en-US/chrome/messenger/messenger.properties
@@ -745,16 +745,24 @@ threadPane.columnPicker.confirmFolder.wi
 # the "columnPicker.applyToFolderAndChildren.label" menu option, this is the
 # text of the confirmation dialog used to verify they selected the correct
 # folder.  The string '%S' is replaced with the name of the folder the user
 # selected in order to help them confirm they picked what they thought they
 # picked.  This is the case in which we apply the columns to the folder and all
 # of its children.
 threadPane.columnPicker.confirmFolder.withChildren.message=Apply the current folder's columns to %S and its children?
 
+# LOCALIZATION NOTE (lightTheme.name): This is displayed in about:addons -> Appearance
+lightTheme.name=Light
+lightTheme.description=A theme with a light color scheme.
+
+# LOCALIZATION NOTE (darkTheme.name): This is displayed in about:addons -> Appearance
+darkTheme.name=Dark
+darkTheme.description=A theme with a dark color scheme.
+
 # LOCALIZATION NOTE (lwthemeInstallRequest.message): %S will be replaced with
 # the host name of the site.
 lwthemeInstallRequest.message=This site (%S) attempted to install a theme.
 lwthemeInstallRequest.allowButton=Allow
 lwthemeInstallRequest.allowButton.accesskey=a
 
 lwthemePostInstallNotification.message=A new theme has been installed.
 lwthemePostInstallNotification.undoButton=Undo
--- a/mail/themes/linux/jar.mn
+++ b/mail/themes/linux/jar.mn
@@ -16,16 +16,17 @@ classic.jar:
 * skin/classic/messenger/imAccountWizard.css                  (../../components/im/themes/imAccountWizard.css)
   skin/classic/messenger/imMenulist.css                       (../../components/im/themes/imMenulist.css)
 * skin/classic/messenger/imRichlistbox.css                    (../../components/im/themes/imRichlistbox.css)
   skin/classic/messenger/founder.png                          (../../components/im/themes/founder.png)
   skin/classic/messenger/operator.png                         (../../components/im/themes/operator.png)
   skin/classic/messenger/half-operator.png                    (../../components/im/themes/half-operator.png)
   skin/classic/messenger/voice.png                            (../../components/im/themes/voice.png)
   skin/classic/messenger/browserRequest.css                   (mail/browserRequest.css)
+  skin/classic/messenger/compacttheme.css                     (mail/compacttheme.css)
   skin/classic/messenger/customizeToolbar.css                 (mail/customizeToolbar.css)
   skin/classic/messenger/datetimepicker.css                   (mail/datetimepicker.css)
   skin/classic/messenger/section_collapsed.png                (mail/section_collapsed.png)
   skin/classic/messenger/section_expanded.png                 (mail/section_expanded.png)
   skin/classic/messenger/messageBody.css                      (mail/messageBody.css)
   skin/classic/messenger/messageHeader.css                    (mail/messageHeader.css)
   skin/classic/messenger/messageIcons.css                     (mail/messageIcons.css)
   skin/classic/messenger/messageQuotes.css                    (mail/messageQuotes.css)
new file mode 100644
--- /dev/null
+++ b/mail/themes/linux/mail/compacttheme.css
@@ -0,0 +1,20 @@
+/* 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/. */
+
+@import url("chrome://messenger/skin/shared/compacttheme.css");
+
+#tabs-toolbar,
+#mail-toolbar-menubar2 {
+  -moz-appearance: none !important;
+}
+
+#mail-menubar {
+  color: var(--chrome-color);
+}
+
+#mail-menubar > menu:not([open]) {
+  color: inherit;
+}
+
+
--- a/mail/themes/linux/mail/messenger.css
+++ b/mail/themes/linux/mail/messenger.css
@@ -234,16 +234,20 @@ toolbox[labelalign="end"] .toolbarbutton
   -moz-appearance: none;
   min-height: 24px;
   min-width: 32px;
   margin: 4px 1px;
   padding: 1px 6px;
   color: inherit;
 }
 
+.toolbarbutton-1[type="menu-button"] {
+  -moz-appearance: none;
+}
+
 .findbar-button,
 .toolbarbutton-1:not([type="menu-button"]),
 .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
   border: 1px solid transparent;
   border-radius: var(--toolbarbutton-border-radius);
   transition-property: background-color, border-color;
   transition-duration: 150ms;
--- a/mail/themes/osx/jar.mn
+++ b/mail/themes/osx/jar.mn
@@ -21,16 +21,17 @@ classic.jar:
 * skin/classic/messenger/imAccountWizard.css                     (../../components/im/themes/imAccountWizard.css)
   skin/classic/messenger/imMenulist.css                          (../../components/im/themes/imMenulist.css)
 * skin/classic/messenger/imRichlistbox.css                       (../../components/im/themes/imRichlistbox.css)
   skin/classic/messenger/founder.png                             (../../components/im/themes/founder.png)
   skin/classic/messenger/operator.png                            (../../components/im/themes/operator.png)
   skin/classic/messenger/half-operator.png                       (../../components/im/themes/half-operator.png)
   skin/classic/messenger/voice.png                               (../../components/im/themes/voice.png)
   skin/classic/messenger/browserRequest.css                      (mail/browserRequest.css)
+  skin/classic/messenger/compacttheme.css                        (mail/compacttheme.css)
   skin/classic/messenger/customizeToolbar.css                    (mail/customizeToolbar.css)
   skin/classic/messenger/datetimepicker.css                      (mail/datetimepicker.css)
   skin/classic/messenger/section_collapsed.png                   (mail/section_collapsed.png)
   skin/classic/messenger/section_expanded.png                    (mail/section_expanded.png)
   skin/classic/messenger/messageBody.css                         (mail/messageBody.css)
   skin/classic/messenger/messageHeader.css                       (mail/messageHeader.css)
   skin/classic/messenger/messageIcons.css                        (mail/messageIcons.css)
   skin/classic/messenger/messageQuotes.css                       (mail/messageQuotes.css)
new file mode 100644
--- /dev/null
+++ b/mail/themes/osx/mail/compacttheme.css
@@ -0,0 +1,23 @@
+/* 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/. */
+
+@import url("chrome://messenger/skin/shared/compacttheme.css");
+
+/* Get rid of 1px bright strip at the top of window */
+#messengerWindow[tabsintitlebar] #titlebar-content {
+  background: var(--chrome-background-color);
+}
+
+#tabs-toolbar:-moz-lwtheme-brighttext {
+  -moz-appearance: -moz-mac-vibrant-titlebar-dark;
+  -moz-font-smoothing-background-color: -moz-mac-vibrant-titlebar-dark;
+  background-color: #232323;
+  color: hsl(240, 9%, 98%);
+  text-shadow: none;
+}
+
+#tabs-toolbar:-moz-lwtheme-darktext {
+  -moz-appearance: -moz-mac-vibrant-titlebar-light;
+  -moz-font-smoothing-background-color: -moz-mac-vibrant-titlebar-light;
+}
--- a/mail/themes/shared/jar.inc.mn
+++ b/mail/themes/shared/jar.inc.mn
@@ -71,16 +71,17 @@
   skin/classic/messenger/icons/starred.svg                    (../shared/mail/icons/starred.svg)
   skin/classic/messenger/icons/sticky.svg                     (../shared/mail/icons/sticky.svg)
   skin/classic/messenger/icons/stop.svg                       (../shared/mail/icons/stop.svg)
   skin/classic/messenger/icons/tag.svg                        (../shared/mail/icons/tag.svg)
   skin/classic/messenger/icons/timeline.svg                   (../shared/mail/icons/timeline.svg)
   skin/classic/messenger/icons/toolbarbutton-arrow.svg        (../shared/mail/icons/toolbarbutton-arrow.svg)
   skin/classic/messenger/shared/accountProvisioner.css        (../shared/mail/accountProvisioner.css)
   skin/classic/messenger/shared/addressbook.css               (../shared/mail/addressbook.css)
+  skin/classic/messenger/shared/compacttheme.css              (../shared/mail/compacttheme.css)
   skin/classic/messenger/shared/in-content/dialog.css         (../shared/mail/incontentprefs/dialog.css)
   skin/classic/messenger/shared/in-content/aboutPreferences.css (../shared/mail/incontentprefs/aboutPreferences.css)
   skin/classic/messenger/shared/in-content/account.svg        (../shared/mail/incontentprefs/account.svg)
   skin/classic/messenger/shared/in-content/advanced.svg       (../shared/mail/incontentprefs/advanced.svg)
   skin/classic/messenger/shared/in-content/attachment.svg     (../shared/mail/incontentprefs/attachment.svg)
   skin/classic/messenger/shared/in-content/calendar.svg       (../shared/mail/incontentprefs/calendar.svg)
   skin/classic/messenger/shared/in-content/chat.svg           (../shared/mail/incontentprefs/chat.svg)
   skin/classic/messenger/shared/in-content/compose.svg        (../shared/mail/incontentprefs/compose.svg)
new file mode 100644
--- /dev/null
+++ b/mail/themes/shared/mail/compacttheme.css
@@ -0,0 +1,90 @@
+/* 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/. */
+
+/* compacttheme.css is loaded in messenger.xul after messenger.css when it
+   is preffed on.  The bulk of the styling is here in the shared file, but
+   there are overrides for each platform in their compacttheme.css files. */
+
+:root:-moz-lwtheme {
+  --toolbar-color: var(--chrome-color);
+  --toolbar-bgcolor: var(--chrome-secondary-background-color);
+  --toolbar-non-lwt-bgcolor: var(--toolbar-bgcolor);
+  --toolbar-non-lwt-textcolor: var(--chrome-color);
+  --toolbar-non-lwt-bgimage: none;
+
+  --toolbarbutton-icon-fill-opacity: .7;
+
+  --tab-line-color: #0a84ff;
+}
+
+:root:-moz-lwtheme-brighttext {
+  /* Chrome */
+  --chrome-background-color: hsl(240, 5%, 5%);
+  --chrome-color: rgb(249, 249, 250);
+  --chrome-secondary-background-color: hsl(240, 1%, 20%);
+  --toolbox-border-bottom-color: hsla(240, 5%, 5%, .1);
+  --chrome-nav-bar-controls-border-color: hsla(240, 5%, 5%, .3);
+  --chrome-selection-color: #fff;
+  --chrome-selection-background-color: #5675b9;
+
+  /* Toolbar buttons */
+  --lwt-toolbarbutton-hover-background: rgba(179, 179, 179, 0.4);
+  --lwt-toolbarbutton-active-background: rgba(179, 179, 179, 0.6);
+
+  /* Search bars */
+  --url-and-searchbar-background-color: rgb(71, 71, 73);
+  --url-and-searchbar-color: var(--chrome-color);
+  --urlbar-separator-color: #5F6670;
+}
+
+:root:-moz-lwtheme-darktext {
+  --url-and-searchbar-background-color: #fff;
+
+  --chrome-background-color: #e3e4e6;
+  --chrome-color: #18191a;
+  --chrome-secondary-background-color: #f5f6f7;
+  --toolbox-border-bottom-color: #cccccc;
+  --chrome-nav-bar-controls-border-color: #ccc;
+  --chrome-selection-color: #f5f7fa;
+  --chrome-selection-background-color: #4c9ed9;
+}
+
+toolbar[brighttext] .toolbarbutton-1 {
+  fill: rgb(249, 249, 250);
+}
+
+#searchInput ::-moz-selection,
+#IMSearchInput ::-moz-selection,
+#peopleSearchInput ::-moz-selection,
+.remote-gloda-search ::-moz-selection,
+findbar ::-moz-selection {
+  background-color: var(--chrome-selection-background-color);
+  color: var(--chrome-selection-color);
+}
+
+/* Change the base colors for the mail chrome */
+
+#navigation-toolbox,
+.mail-toolbox,
+.contentTabToolbox {
+  background-color: var(--chrome-background-color);
+  color: var(--chrome-color);
+}
+
+.mail-toolbox,
+.contentTabToolbox,
+findbar,
+#browser-bottombox {
+  background-color: var(--chrome-secondary-background-color) !important;
+  background-image: none !important;
+  color: var(--chrome-color);
+}
+
+/* Search bar*/
+#searchInput:not([focused="true"]),
+#IMSearchInput:not([focused="true"]),
+#peopleSearchInput:not([focused="true"]),
+.remote-gloda-search:not([focused="true"]) {
+  border-color: var(--chrome-nav-bar-controls-border-color);
+}
--- a/mail/themes/windows/jar.mn
+++ b/mail/themes/windows/jar.mn
@@ -16,16 +16,17 @@ classic.jar:
 * skin/classic/messenger/imAccountWizard.css                  (../../components/im/themes/imAccountWizard.css)
   skin/classic/messenger/imMenulist.css                       (../../components/im/themes/imMenulist.css)
 * skin/classic/messenger/imRichlistbox.css                    (../../components/im/themes/imRichlistbox.css)
   skin/classic/messenger/founder.png                          (../../components/im/themes/founder.png)
   skin/classic/messenger/operator.png                         (../../components/im/themes/operator.png)
   skin/classic/messenger/half-operator.png                    (../../components/im/themes/half-operator.png)
   skin/classic/messenger/voice.png                            (../../components/im/themes/voice.png)
   skin/classic/messenger/browserRequest.css                   (mail/browserRequest.css)
+  skin/classic/messenger/compacttheme.css                     (mail/compacttheme.css)
   skin/classic/messenger/customizeToolbar.css                 (mail/customizeToolbar.css)
   skin/classic/messenger/datetimepicker.css                   (mail/datetimepicker.css)
   skin/classic/messenger/section_collapsed.png                (mail/section_collapsed.png)
   skin/classic/messenger/section_expanded.png                 (mail/section_expanded.png)
   skin/classic/messenger/messageBody.css                      (mail/messageBody.css)
   skin/classic/messenger/messageHeader.css                    (mail/messageHeader.css)
   skin/classic/messenger/messageIcons.css                     (mail/messageIcons.css)
   skin/classic/messenger/messageQuotes.css                    (mail/messageQuotes.css)
new file mode 100644
--- /dev/null
+++ b/mail/themes/windows/mail/compacttheme.css
@@ -0,0 +1,152 @@
+/* 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/. */
+
+@import url("chrome://messenger/skin/shared/compacttheme.css");
+
+/* The window background is white due to no accentcolor in the lightweight
+   theme. It can't be changed to transparent when there is no compositor
+   (Win 7 in classic / basic theme), or else dragging and focus become
+   broken. So instead just show the normal titlebar in that case, and override
+   the window color as transparent when the compositor is available. */
+@media (-moz-windows-compositor: 0) {
+  #messengerWindow[tabsintitlebar] #titlebar:-moz-lwtheme {
+    visibility: visible;
+  }
+
+  /* Prevent accent color overriding the window background for
+   * light and dark theme on Aero Basic. This is copied from browser-aero.css. */
+  @media (-moz-windows-default-theme) {
+    #messengerWindow {
+      background-color: rgb(185,209,234) !important;
+    }
+    #messengerWindow:-moz-window-inactive {
+      background-color: rgb(215,228,242) !important;
+    }
+  }
+}
+
+@media (-moz-os-version: windows-win7) {
+  @media (-moz-windows-default-theme) {
+    /* Always show light toolbar elements on aero surface. */
+    #tabs-toolbar {
+      color: hsl(240,9%,98%);
+    }
+
+    /* Keep showing the correct color inside the tabs. */
+    .tabmail-tab {
+      color: var(--chrome-color) !important;
+    }
+
+    /* Because we're forcing the tabs toolbar to be [brighttext] to
+     * get white toolbar button icons, we need to manually set the
+     * correct color for the tab hover state for the light theme. */
+    .tabmail-tab:hover > .tab-stack > .tab-background:not([selected=true]):-moz-lwtheme-darktext {
+      background-color: rgba(0,0,0,.1) !important;
+    }
+    .tabmail-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]):-moz-lwtheme-darktext {
+      background-color: rgba(0,0,0,.2) !important;
+    }
+  }
+}
+
+@media (-moz-windows-glass) {
+  /* Set to full fill-opacity to improve visibility of toolbar buttons on aero glass. */
+  #tabs-toolbar {
+    --toolbarbutton-icon-fill-opacity: 1;
+  }
+
+  #navigation-toolbox {
+    background-color: transparent;
+  }
+}
+
+@media (-moz-os-version: windows-win7),
+       (-moz-os-version: windows-win8) {
+  #messengerWindow > statusbar {
+    background-color: var(--lwt-accent-color);
+  }
+
+  @media (-moz-windows-compositor) {
+    #messengerWindow {
+      background: transparent !important;
+    }
+  }
+
+  /* Always show full-height tab separators on tabs with borders. */
+  .tabmail-tab::before,
+  .tabmail-tab::after {
+    border-image: none !important;
+  }
+
+  /* Show border on tabs with background colors and
+   * show the tabs toolbar background color inside tabs. */
+  .tabmail-tab {
+    background-color: var(--chrome-background-color) !important;
+    border-top: 1px solid var(--tabs-border-color);
+    background-clip: padding-box;
+  }
+
+  /* The top border on top of the tab background is replaced
+   * by the slightly transparent outside tabs-border-color. */
+  .tab-background {
+    border-top-style: none !important;
+  }
+
+  /* The border at the start of the tab strip is replaced
+   * by the slightly transparent outside tabs-border-color. */
+  .tabmail-tab:first-child {
+    margin-inline-start: 0 !important;
+    border-inline-start: 1px solid var(--tabs-border-color);
+  }
+
+  /* The border at the end of the tab strip is replaced
+   * by the slightly transparent outside tabs-border-color. */
+  .tabmail-tab:last-child {
+    border-inline-end: 1px solid var(--tabs-border-color);
+  }
+
+  .tabmail-tab:first-child::before,
+  .tabmail-tab:last-child::after {
+    display: none !important;
+  }
+
+  /* Use default window colors */
+  #tabs-toolbar,
+  #navigator-toolbox {
+    background-color: transparent;
+  }
+
+  /* Use proper menu text styling in Win7 classic mode (copied from browser.css) */
+  @media (-moz-windows-compositor: 0),
+         (-moz-windows-default-theme: 0) {
+    :root[tabsintitlebar]:not([inFullscreen]) #mail-menubar {
+      color: CaptionText;
+    }
+
+    :root[tabsintitlebar]:not([inFullscreen]) #mail-menubar:-moz-window-inactive {
+      color: InactiveCaptionText;
+    }
+
+    #messengerWindow[tabsintitlebar] #mail-menubar > menu {
+      color: inherit;
+    }
+
+    #tabs-toolbar .toolbarbutton-1,
+    .tabmail-arrowscrollbox > .scrollbutton-up,
+    .tabmail-arrowscrollbox > stack > .scrollbutton-down {
+      fill: CaptionText;
+    }
+  }
+}
+
+/* Restored windows get an artificial border on windows, because the lwtheme background
+ * overlaps the regular window border. That isn't the case for us, so we avoid painting
+ * over the native border with our custom borders: */
+#navigator-toolbox {
+  /* These are !important to avoid specificity-wars with the selectors that add borders here. */
+  background-image: none !important;
+  border-top: none !important;
+  box-shadow: none !important;
+  padding-top: 0 !important;
+}