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

This commit is contained in:
Dão Gottwald 2016-09-23 15:38:51 +02:00
parent cb7550f167
commit 620b145d13
6 changed files with 38 additions and 34 deletions

View File

@ -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;
}

View File

@ -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;
}

View File

@ -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)

View File

@ -45,30 +45,14 @@
margin-inline-end: 10px;
}
.camera-icon,
.geo-icon,
.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"] {
.notification-anchor-icon:not(.plugin-blocked):-moz-lwtheme,
#blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme {
filter: url(chrome://browser/skin/filters.svg#fill);
fill: currentColor;
opacity: .4;
}
.notification-anchor-icon:not(.plugin-blocked):hover {
opacity: .6;
.notification-anchor-icon:not(.plugin-blocked):not(:hover) {
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] {

View File

@ -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"/>

Before

Width:  |  Height:  |  Size: 5.8 KiB

After

Width:  |  Height:  |  Size: 6.3 KiB

View File

@ -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;
}