Use toolkit close button styling where applicable

4 files changed, 7 insertions, 65 deletions

diff --git a/mail/components/compose/content/messengercompose.xul b/mail/components/compose/content/messengercompose.xul
index 598f025cd..8c56fc7f5 100644
--- a/mail/components/compose/content/messengercompose.xul
+++ b/mail/components/compose/content/messengercompose.xul
@@ -881,7 +881,7 @@
       <sidebarheader id="sidebarHeader" align="center">
         <label id="sidebar-title" value="&addressesSidebarTitle.label;"/>
         <spacer flex="1"/>
-        <toolbarbutton class="ab-closebutton" oncommand="toggleAddressPicker();"/>
+        <toolbarbutton class="ab-closebutton close-icon" oncommand="toggleAddressPicker();"/>
       </sidebarheader>
       <browser id="sidebar" flex="1" src="" disablehistory="true"
                style="min-width: 150px; width: 200px; max-width: 400px;"/>
diff --git a/mail/themes/classic/messenger/messengercompose/messengercompose.css b/mail/themes/classic/messenger/messengercompose/messengercompose.css
index b8a2cfd70..b6ba0b30a 100644
--- a/mail/themes/classic/messenger/messengercompose/messengercompose.css
+++ b/mail/themes/classic/messenger/messengercompose/messengercompose.css
@@ -489,19 +489,9 @@ toolbarbutton.formatting-button {
 }

 

 .ab-closebutton {

-  list-style-image: url("chrome://global/skin/icons/close.png");

-  -moz-image-region: rect(0px, 56px, 14px, 42px);

   -moz-appearance: none;

   border: none !important;

-  padding: 2px;

-}

-

-.ab-closebutton:hover {

-  -moz-image-region: rect(0px, 28px, 14px, 14px);

-}

-

-.ab-closebutton:hover:active {

-  -moz-image-region: rect(0px, 42px, 14px, 28px);

+  padding: 0 3px;

 }

 

 .ab-closebutton > .toolbarbutton-icon {

diff --git a/mail/themes/classic/messenger/newmailalert.css b/mail/themes/classic/messenger/newmailalert.css
index dd20e6216..35fa95d4e 100644
--- a/mail/themes/classic/messenger/newmailalert.css
+++ b/mail/themes/classic/messenger/newmailalert.css
@@ -77,17 +77,7 @@
 }

 

 #closeButton {

-  list-style-image: url("chrome://global/skin/icons/close.svg");

-  -moz-image-region: rect(0px, 16px, 16px, 0px);

   -moz-appearance: none;

   border: none !important;

   padding: 2px;

 }

-

-#closeButton:hover {

-  -moz-image-region: rect(0px, 32px, 16px, 16px);

-}

-

-#closeButton:hover:active {

-  -moz-image-region: rect(0px, 48px, 16px, 32px);

-}

diff --git a/mail/themes/classic/messenger/tabmail.css b/mail/themes/classic/messenger/tabmail.css
index 401056a9e..d419a3328 100644
--- a/mail/themes/classic/messenger/tabmail.css
+++ b/mail/themes/classic/messenger/tabmail.css
@@ -252,7 +252,7 @@ tabpanels {
 .tabs-closebutton-box {

   margin-top: 2px;

   margin-bottom: 4px;

-}

+} 

 

 .tab-close-button > .toolbarbutton-icon {

   -moz-margin-end: 0px !important;

@@ -262,55 +262,17 @@ tabpanels {
 .tab-close-button,

 .tabs-closebutton {

   -moz-appearance: none;

-  -moz-image-region: rect(0, 16px, 16px, 0);

   border: none !important;

-  padding: 1px;

+  padding: 0px;

   cursor: default;

-  list-style-image: url("chrome://global/skin/icons/close.svg");

 }

 

 .tabs-closebutton {

-  padding: 1px 3px;

-}

-

-.tabmail-tab:not([selected="true"]) > .tab-close-button {

-  margin-bottom: 1px;

-}

-

-.tabmail-tab:not([selected="true"]) > .tab-close-button > .toolbarbutton-icon {

-  margin-top: 2px;

-}

-

-.tab-close-button:hover,

-.tabs-closebutton:hover,

-.tabmail-tab[selected="true"] > .tab-close-button:hover {

-  -moz-image-region: rect(0px, 28px, 14px, 14px);

-  opacity: 1.0;

-}

-

-.tab-close-button:hover:active,

-.tabs-closebutton:hover:active,

-.tabmail-tab[selected="true"] > .tab-close-button:hover:active {

-  -moz-image-region: rect(0px, 42px, 14px, 28px);

-  opacity: 1.0;

-}

-

-

-.close-icon {

-  list-style-image: url("chrome://global/skin/icons/close.svg");

-  -moz-image-region: rect(0, 16px, 16px, 0);

-}

-

-.close-icon:hover {

-  -moz-image-region: rect(0, 32px, 16px, 16px);

-}

-

-.close-icon:hover:active {

-  -moz-image-region: rect(0, 48px, 16px, 32px);

+  padding: 0 3px;

 }

 

-.tabmail-tab[selected="true"] > .tab-close-button {

-  -moz-image-region: rect(0px, 14px, 14px, 0px);

+.tabmail-tab:not([selected="true"]) > .tab-stack > .tab-content > .tab-close-button:not(:hover):not(:active) {

+  -moz-image-region: rect(0px, 64px, 16px, 48px);

   /* Make this button focusable so clicking on it will not focus the tab while

      it's getting closed */

   -moz-user-focus: normal;