Bug 1495112 - Reference only one PNG file for the status icons in chat. r=jorgk DONTBUILD

--HG--
rename : mail/themes/osx/mail/icons/status@2x.png => mail/themes/linux/mail/icons/status@2x.png
rename : mail/themes/osx/mail/icons/status@2x.png => mail/themes/windows/mail/icons/status@2x.png

chat/themes/imtooltip.css

@@ -2,33 +2,15 @@
  * 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://chat/skin/status.css");
-
 .displayNameMessageBox {
   margin-left: 4px;
   margin-top: 2px;
 }
 
-.statusTypeIcon {
-  margin: 32px 0 0;
-  max-width: 16px;
-  max-height: 16px;
-  min-width: 16px;
-  min-height: 16px;
-  width: 16px;
-  height: 16px;
-  background-color: transparent;
-  border: none;
-}
-
 .statusTypeIcon[left][status="chat"] {
   list-style-image: url('chrome://chat/skin/chat-left-16.png') !important;
 }
 
-.userIconHolder[userIcon] + .statusTypeIcon {
-  margin-left: 32px;
-}
-
 .tooltipBuddies {
   margin-left: -3px;
   --blist-item-height: 20px; /* 16px icon plus padding */
@@ -69,24 +51,6 @@
   margin-left: 3px;
 }
 
-.userIconHolder {
-  border: 2px solid rgba(0, 0, 0, 0.15);
-  border-radius: 5px;
-  overflow: hidden;
-}
-
-.userIcon,
-.userIconHolder {
-  max-width: 48px;
-  max-height: 48px;
-  min-width: 48px;
-  min-height: 48px;
-  width: 48px;
-  height: 48px;
-}
-
-.userIcon:not([src]),
-.statusTypeIcon:not([status]),
-.userIconHolder:not([userIcon]) {
+.statusTypeIcon:not([status]) {
   display: none;
 }

chat/themes/jar.mn

@@ -4,15 +4,11 @@
 
 chat.jar:
 % skin chat classic/1.0 %skin/classic/chat/
-	skin/classic/chat/available-16.png
 	skin/classic/chat/available.png
-	skin/classic/chat/away-16.png
 	skin/classic/chat/away.png
-	skin/classic/chat/idle-16.png
 	skin/classic/chat/idle.png
 	skin/classic/chat/mobile-16.png
 	skin/classic/chat/mobile.png
-	skin/classic/chat/offline-16.png
 	skin/classic/chat/offline.png
 	skin/classic/chat/typing-16.png
 	skin/classic/chat/typed-16.png

chat/themes/status.css

@@ -37,24 +37,6 @@
   list-style-image: url('chrome://chat/skin/chat-16.png');
 }
 
-.statusTypeIcon[status="available"] {
-  list-style-image: url('chrome://chat/skin/available-16.png');
-}
-
-.statusTypeIcon[status="unavailable"],
-.statusTypeIcon[status="away"] {
-  list-style-image: url('chrome://chat/skin/away-16.png');
-}
-
-.statusTypeIcon[status="offline"],
-.statusTypeIcon[status="invisible"] {
-  list-style-image: url('chrome://chat/skin/offline-16.png');
-}
-
-.statusTypeIcon[status="idle"] {
-  list-style-image: url('chrome://chat/skin/idle-16.png');
-}
-
 .statusTypeIcon[status="mobile"] {
   list-style-image: url('chrome://chat/skin/mobile-16.png');
 }

mail/components/im/themes/chat.css

@@ -314,6 +314,8 @@ imcontact[aliasing] .contactDisplayName {
 .userIconHolder {
   max-width: 48px;
   max-height: 48px;
+  min-width: 48px;
+  min-height: 48px;
   width: 48px;
   height: 48px;
 }
@@ -330,9 +332,11 @@ imcontact[aliasing] .contactDisplayName {
 }
 
 .statusTypeIcon {
-  margin: 0 0;
+  margin: 32px 0 0;
   width: 16px;
   height: 16px;
+  max-width: 16px;
+  max-height: 16px;
   min-height: 16px;
   min-width: 16px;
   -moz-appearance: none;
@@ -340,6 +344,10 @@ imcontact[aliasing] .contactDisplayName {
   border: none;
 }
 
+.userIconHolder[userIcon] + .statusTypeIcon {
+  margin-inline-start: 32px;
+}
+
 .statusTypeIcon[typing] {
   list-style-image: url('chrome://chat/skin/typing-16.png');
 }
@@ -348,6 +356,92 @@ imcontact[aliasing] .contactDisplayName {
   list-style-image: url('chrome://chat/skin/typed-16.png');
 }
 
+#statusTypeIcon[status="available"],
+#statusTypeAvailable,
+.statusTypeIcon[status="available"],
+#imStatusAvailable,
+#appmenu_imStatusAvailable,
+richlistitem[state="connected"] .accountStateIcon {
+  list-style-image: url("chrome://messenger/skin/icons/status.png");
+  -moz-image-region: rect(0 16px 16px 0);
+}
+
+#statusTypeIcon[status="idle"],
+.statusTypeIcon[status="idle"] {
+  list-style-image: url("chrome://messenger/skin/icons/status.png");
+  -moz-image-region: rect(0 32px 16px 16px);
+}
+
+#statusTypeIcon[status="offline"],
+#statusTypeIcon[status="invisible"],
+#statusTypeOffline,
+.statusTypeIcon[status="offline"],
+.statusTypeIcon[status="invisible"],
+#imStatusOffline,
+#appmenu_imStatusOffline,
+richlistitem[state="disconnected"] .accountStateIcon {
+  list-style-image: url("chrome://messenger/skin/icons/status.png");
+  -moz-image-region: rect(0 48px 16px 32px);
+}
+
+#statusTypeIcon[status="unavailable"],
+#statusTypeIcon[status="away"],
+#statusTypeUnavailable,
+.statusTypeIcon[status="unavailable"],
+.statusTypeIcon[status="away"],
+#imStatusUnavailable,
+#appmenu_imStatusUnavailable {
+  list-style-image: url("chrome://messenger/skin/icons/status.png");
+  -moz-image-region: rect(0 64px 16px 48px);
+}
+
+@media (min-resolution: 1.1dppx) {
+  #statusTypeIcon[status="available"],
+  #statusTypeAvailable,
+  .statusTypeIcon[status="available"],
+  #imStatusAvailable,
+  #appmenu_imStatusAvailable,
+  richlistitem[state="connected"] .accountStateIcon {
+    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
+    -moz-image-region: rect(0 32px 32px 0);
+  }
+
+  #statusTypeIcon[status="idle"],
+  .statusTypeIcon[status="idle"] {
+    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
+    -moz-image-region: rect(0 64px 32px 32px);
+  }
+
+  #statusTypeIcon[status="offline"],
+  #statusTypeIcon[status="invisible"],
+  #statusTypeOffline,
+  .statusTypeIcon[status="offline"],
+  .statusTypeIcon[status="invisible"],
+  #imStatusOffline,
+  #appmenu_imStatusOffline,
+  richlistitem[state="disconnected"] .accountStateIcon {
+    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
+    -moz-image-region: rect(0 96px 32px 64px);
+  }
+
+  #statusTypeIcon[status="unavailable"],
+  #statusTypeIcon[status="away"],
+  #statusTypeUnavailable,
+  .statusTypeIcon[status="unavailable"],
+  .statusTypeIcon[status="away"],
+  #imStatusUnavailable,
+  #appmenu_imStatusUnavailable {
+    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
+    -moz-image-region: rect(0 128px 32px 96px);
+  }
+
+  .prplIcon,
+  #statusTypeIcon .button-icon {
+    width: 16px;
+    height: 16px;
+  }
+}
+
 .statusMessage {
   margin: 0 0 !important;
 %ifdef XP_MACOSX
@@ -411,15 +505,10 @@ imcontact[aliasing] .contactDisplayName {
 }
 
 .prplIcon {
-  margin: 0 1px 16px -16px !important;
-}
-
-.statusTypeIcon {
-  margin: 32px 0 0;
-}
-
-.userIconHolder[userIcon] + .statusTypeIcon {
-  margin-left: 32px;
+  margin-top: 0 !important;
+  margin-inline-end: 1px !important;
+  margin-bottom: 16px -16px !important;
+  margin-inline-start: -16px !important;
 }
 
 .conv-messages {

mail/components/im/themes/imAccounts.css

@@ -148,12 +148,6 @@ richlistitem[dragover="up"] {
   height: 16px;
 }
 
-richlistitem[state="connected"] .accountStateIcon {
-  list-style-image: url("chrome://chat/skin/available-16.png");
-}
-richlistitem[state="disconnected"] .accountStateIcon {
-  list-style-image: url("chrome://chat/skin/offline-16.png");
-}
 richlistitem[state="connecting"] .accountStateIcon {
   list-style-image: url("chrome://global/skin/icons/loading.png");
 }
@@ -225,24 +219,3 @@ richlistitem[error="true"] .accountStateIcon {
   border: none;
 }
 %endif
-
-#statusTypeIcon[status="available"],
-#statusTypeAvailable {
-  list-style-image: url('chrome://chat/skin/available-16.png');
-}
-
-#statusTypeIcon[status="unavailable"],
-#statusTypeIcon[status="away"],
-#statusTypeUnavailable {
-  list-style-image: url('chrome://chat/skin/away-16.png');
-}
-
-#statusTypeIcon[status="offline"],
-#statusTypeIcon[status="invisible"],
-#statusTypeOffline {
-  list-style-image: url('chrome://chat/skin/offline-16.png');
-}
-
-#statusTypeIcon[status="idle"] {
-  list-style-image: url('chrome://chat/skin/idle-16.png');
-}

mail/themes/linux/jar.mn

@@ -154,6 +154,7 @@ classic.jar:
   skin/classic/messenger/icons/dropmarker.svg                 (mail/icons/dropmarker.svg)
   skin/classic/messenger/icons/dragIndicator.png              (mail/icons/dragIndicator.png)
   skin/classic/messenger/icons/status.png                     (mail/icons/status.png)
+  skin/classic/messenger/icons/status@2x.png                  (mail/icons/status@2x.png)
   skin/classic/messenger/icons/status-small.png               (mail/icons/status-small.png)
   skin/classic/messenger/accountcentral/read-messages.png     (mail/accountcentral/read-messages.png)
   skin/classic/messenger/accountcentral/write-message.png     (mail/accountcentral/write-message.png)

mail/themes/linux/mail/chat.css

@@ -90,45 +90,6 @@
   -moz-box-align: center;
 }
 
-#statusTypeIcon[status="available"],
-#statusTypeAvailable,
-.statusTypeIcon[status="available"],
-#imStatusAvailable,
-#appmenu_imStatusAvailable,
-richlistitem[state="connected"] .accountStateIcon {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-}
-
-#statusTypeIcon[status="idle"],
-.statusTypeIcon[status="idle"] {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-#statusTypeIcon[status="offline"],
-#statusTypeIcon[status="invisible"],
-#statusTypeOffline,
-.statusTypeIcon[status="offline"],
-.statusTypeIcon[status="invisible"],
-#imStatusOffline,
-#appmenu_imStatusOffline,
-richlistitem[state="disconnected"] .accountStateIcon {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 48px 16px 32px);
-}
-
-#statusTypeIcon[status="unavailable"],
-#statusTypeIcon[status="away"],
-#statusTypeUnavailable,
-.statusTypeIcon[status="unavailable"],
-.statusTypeIcon[status="away"],
-#imStatusUnavailable,
-#appmenu_imStatusUnavailable {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 64px 16px 48px);
-}
-
 #displayNameAndstatusMessageStack #statusMessage {
   margin: 32px 0 0;
 }

mail/themes/osx/mail/chat.css

@@ -137,92 +137,6 @@
   background-color: #fff;
 }
 
-#statusTypeIcon[status="available"],
-#statusTypeAvailable,
-.statusTypeIcon[status="available"],
-#imStatusAvailable,
-#appmenu_imStatusAvailable,
-richlistitem[state="connected"] .accountStateIcon {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-}
-
-#statusTypeIcon[status="idle"],
-.statusTypeIcon[status="idle"] {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-#statusTypeIcon[status="offline"],
-#statusTypeIcon[status="invisible"],
-#statusTypeOffline,
-.statusTypeIcon[status="offline"],
-.statusTypeIcon[status="invisible"],
-#imStatusOffline,
-#appmenu_imStatusOffline,
-richlistitem[state="disconnected"] .accountStateIcon {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 48px 16px 32px);
-}
-
-#statusTypeIcon[status="unavailable"],
-#statusTypeIcon[status="away"],
-#statusTypeUnavailable,
-.statusTypeIcon[status="unavailable"],
-.statusTypeIcon[status="away"],
-#imStatusUnavailable,
-#appmenu_imStatusUnavailable {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0px 64px 16px 48px);
-}
-
-@media (min-resolution: 2dppx) {
-  #statusTypeIcon[status="available"],
-  #statusTypeAvailable,
-  .statusTypeIcon[status="available"],
-  #imStatusAvailable,
-  #appmenu_imStatusAvailable,
-  richlistitem[state="connected"] .accountStateIcon {
-    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
-    -moz-image-region: rect(0px 32px 32px 0px);
-  }
-
-  #statusTypeIcon[status="idle"],
-  .statusTypeIcon[status="idle"] {
-    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
-    -moz-image-region: rect(0px 64px 32px 32px);
-  }
-
-  #statusTypeIcon[status="offline"],
-  #statusTypeIcon[status="invisible"],
-  #statusTypeOffline,
-  .statusTypeIcon[status="offline"],
-  .statusTypeIcon[status="invisible"],
-  #imStatusOffline,
-  #appmenu_imStatusOffline,
-  richlistitem[state="disconnected"] .accountStateIcon {
-    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
-    -moz-image-region: rect(0px 96px 32px 64px);
-  }
-
-  #statusTypeIcon[status="unavailable"],
-  #statusTypeIcon[status="away"],
-  #statusTypeUnavailable,
-  .statusTypeIcon[status="unavailable"],
-  .statusTypeIcon[status="away"],
-  #imStatusUnavailable,
-  #appmenu_imStatusUnavailable {
-    list-style-image: url("chrome://messenger/skin/icons/status@2x.png");
-    -moz-image-region: rect(0px 128px 32px 96px);
-  }
-
-  .prplIcon,
-  #statusTypeIcon .button-icon {
-    width: 16px;
-    height: 16px;
-  }
-}
-
 #displayNameAndstatusMessageStack #statusMessage {
   margin: 32px 0 0;
   min-height: 16px;

mail/themes/windows/jar.mn

@@ -169,6 +169,7 @@ classic.jar:
   skin/classic/messenger/icons/connecting.png                 (mail/icons/connecting.png)
   skin/classic/messenger/icons/notloading.png                 (mail/icons/notloading.png)
   skin/classic/messenger/icons/status.png                     (mail/icons/status.png)
+  skin/classic/messenger/icons/status@2x.png                  (mail/icons/status@2x.png)
   skin/classic/messenger/icons/status-small.png               (mail/icons/status-small.png)
   skin/classic/messenger/accountcentral/read-messages.png     (mail/accountcentral/read-messages.png)
   skin/classic/messenger/accountcentral/write-message.png     (mail/accountcentral/write-message.png)

mail/themes/windows/mail/chat.css

@@ -183,45 +183,6 @@
   }
 }
 
-#statusTypeIcon[status="available"],
-#statusTypeAvailable,
-.statusTypeIcon[status="available"],
-#imStatusAvailable,
-#appmenu_imStatusAvailable,
-richlistitem[state="connected"] .accountStateIcon {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0 16px 16px 0);
-}
-
-#statusTypeIcon[status="idle"],
-.statusTypeIcon[status="idle"] {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0 32px 16px 16px);
-}
-
-#statusTypeIcon[status="offline"],
-#statusTypeIcon[status="invisible"],
-#statusTypeOffline,
-.statusTypeIcon[status="offline"],
-.statusTypeIcon[status="invisible"],
-#imStatusOffline,
-#appmenu_imStatusOffline,
-richlistitem[state="disconnected"] .accountStateIcon {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0 48px 16px 32px);
-}
-
-#statusTypeIcon[status="unavailable"],
-#statusTypeIcon[status="away"],
-#statusTypeUnavailable,
-.statusTypeIcon[status="unavailable"],
-.statusTypeIcon[status="away"],
-#imStatusUnavailable,
-#appmenu_imStatusUnavailable {
-  list-style-image: url("chrome://messenger/skin/icons/status.png");
-  -moz-image-region: rect(0 64px 16px 48px);
-}
-
 @media (-moz-os-version: windows-win7) and (-moz-windows-default-theme) {
   :root:not([lwt-tree]) #listPaneBox {
     background-color: rgb(238, 243, 250);