Bug 1304708 - Use icon-colors.inc.svg in notification-icons.svg. r=jhofmann

browser/themes/shared/controlcenter/panel.inc.css

@@ -376,8 +376,6 @@ description#identity-popup-content-verifier,
 }
 
 .identity-popup-permission-icon.in-use {
-  fill: rgb(224, 41, 29);
-  opacity: 1;
   animation: 1.5s ease in-use-blink infinite;
 }
 

browser/themes/shared/identity-block/identity-block.inc.css

@@ -109,21 +109,19 @@
 }
 
 #identity-box[sharing="camera"] > #sharing-icon {
-  list-style-image: url("chrome://browser/skin/notification-icons.svg#camera");
+  list-style-image: url("chrome://browser/skin/notification-icons.svg#camera-sharing");
 }
 
 #identity-box[sharing="microphone"] > #sharing-icon {
-  list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone");
+  list-style-image: url("chrome://browser/skin/notification-icons.svg#microphone-sharing");
 }
 
 #identity-box[sharing="screen"] > #sharing-icon {
-  list-style-image: url("chrome://browser/skin/notification-icons.svg#screen");
+  list-style-image: url("chrome://browser/skin/notification-icons.svg#screen-sharing");
 }
 
 #identity-box[sharing] > #sharing-icon {
   display: -moz-box;
-  filter: url("chrome://browser/skin/filters.svg#fill");
-  fill: rgb(224, 41, 29);
   animation-delay: -1.5s;
 }
 

browser/themes/shared/jar.inc.mn

@@ -68,7 +68,7 @@
   skin/classic/browser/info.svg                                (../shared/info.svg)
 * skin/classic/browser/menuPanel.svg                           (../shared/menuPanel.svg)
 * skin/classic/browser/menuPanel-small.svg                     (../shared/menuPanel-small.svg)
-  skin/classic/browser/notification-icons.svg                  (../shared/notification-icons.svg)
+* skin/classic/browser/notification-icons.svg                  (../shared/notification-icons.svg)
 * skin/classic/browser/tracking-protection-16.svg              (../shared/identity-block/tracking-protection-16.svg)
   skin/classic/browser/newtab/close.png                        (../shared/newtab/close.png)
   skin/classic/browser/newtab/controls.svg                     (../shared/newtab/controls.svg)

browser/themes/shared/notification-icons.inc.css

@@ -45,30 +45,14 @@
   margin-inline-end: 10px;
 }
 
-.camera-icon,
+.notification-anchor-icon:not(.plugin-blocked):-moz-lwtheme,
-.geo-icon,
+#blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme {
-.indexedDB-icon,
-.install-icon,
-.login-icon,
-.microphone-icon,
-.plugin-icon,
-.popup-icon,
-.screen-icon,
-.desktop-notification-icon,
-.popup-notification-icon[popupid="geolocation"],
-.popup-notification-icon[popupid="indexedDB-permissions-prompt"],
-.popup-notification-icon[popupid="password"],
-.popup-notification-icon[popupid="webRTC-shareDevices"],
-.popup-notification-icon[popupid="webRTC-shareMicrophone"],
-.popup-notification-icon[popupid="webRTC-shareScreen"],
-.popup-notification-icon[popupid="web-notifications"] {
   filter: url(chrome://browser/skin/filters.svg#fill);
   fill: currentColor;
-  opacity: .4;
 }
 
-.notification-anchor-icon:not(.plugin-blocked):hover {
+.notification-anchor-icon:not(.plugin-blocked):not(:hover) {
-  opacity: .6;
+  opacity: .8;
 }
 
 /* INDIVIDUAL NOTIFICATIONS */
@@ -134,6 +118,10 @@
   list-style-image: url(chrome://browser/skin/notification-icons.svg#camera);
 }
 
+.camera-icon.in-use {
+  list-style-image: url(chrome://browser/skin/notification-icons.svg#camera-sharing);
+}
+
 .camera-icon.blocked-permission-icon {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#camera-blocked);
 }
@@ -142,6 +130,10 @@
   list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone);
 }
 
+.microphone-icon.in-use {
+  list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone-sharing);
+}
+
 .microphone-icon.blocked-permission-icon {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#microphone-blocked);
 }
@@ -155,6 +147,10 @@
   list-style-image: url(chrome://browser/skin/notification-icons.svg#screen);
 }
 
+.screen-icon.in-use {
+  list-style-image: url(chrome://browser/skin/notification-icons.svg#screen-sharing);
+}
+
 .screen-icon.blocked-permission-icon {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#screen-blocked);
 }
@@ -241,8 +237,6 @@
 
 .plugin-icon.plugin-blocked {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked);
-  fill: #d92215;
-  opacity: 1;
 }
 
 #notification-popup-box[hidden] {

browser/themes/shared/notification-icons.svg

@@ -4,7 +4,9 @@
    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
 <svg xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink"
+     class="fieldtext"
      width="32" height="32" viewBox="0 0 32 32">
+#include icon-colors.inc.svg
   <style>
     use:not(:target) {
       display: none;
@@ -18,6 +20,19 @@
     .blocked {
       clip-path: url(#clip);
     }
+
+    #plugin-blocked,
+    #plugin-blocked:target ~ #strikeout {
+      fill: #d92215;
+      fill-opacity: 1;
+    }
+
+    #camera-sharing,
+    #microphone-sharing,
+    #screen-sharing {
+      fill: rgb(224, 41, 29);
+      fill-opacity: 1;
+    }
   </style>
 
   <defs>
@@ -43,6 +58,7 @@
   </defs>
 
   <use id="camera" xlink:href="#camera-icon" />
+  <use id="camera-sharing" xlink:href="#camera-icon"/>
   <use id="camera-blocked" class="blocked" xlink:href="#camera-icon" />
   <use id="desktop-notification" xlink:href="#desktop-notification-icon" />
   <use id="desktop-notification-blocked" class="blocked" xlink:href="#desktop-notification-icon" />
@@ -59,12 +75,14 @@
   <use id="login" xlink:href="#login-icon" />
   <use id="login-detailed" xlink:href="#login-detailed-icon" />
   <use id="microphone" xlink:href="#microphone-icon" />
+  <use id="microphone-sharing" xlink:href="#microphone-icon"/>
   <use id="microphone-blocked" class="blocked" xlink:href="#microphone-icon" />
   <use id="microphone-detailed" xlink:href="#microphone-detailed-icon" />
   <use id="plugin" xlink:href="#plugin-icon" />
   <use id="plugin-blocked" class="blocked" xlink:href="#plugin-icon" />
   <use id="popup" xlink:href="#popup-icon" />
   <use id="screen" xlink:href="#screen-icon" />
+  <use id="screen-sharing" xlink:href="#screen-icon"/>
   <use id="screen-blocked" class="blocked" xlink:href="#screen-icon" />
 
   <path id="strikeout" d="m 2,28 2,2 26,-26 -2,-2 z"/>

browser/themes/shared/plugin-doorhanger.inc.css

@@ -51,8 +51,6 @@
 
 .messageImage[value="plugin-hidden"] {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin);
-  filter: url(chrome://browser/skin/filters.svg#fill);
-  fill: #808080;
 }
 
 /* Keep any changes to this style in sync with pluginProblem.css */
@@ -64,6 +62,4 @@ notification.pluginVulnerable {
 
 notification.pluginVulnerable .messageImage {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked);
-  filter: url(chrome://browser/skin/filters.svg#fill);
-  fill: #d92215;
 }