Bug 1299211 - Move icon transparency into identity-icon.svg and tracking-protection-16.svg and remove !important from .plugin-icon.plugin-blocked opacity. r=johannh
authorDão Gottwald <dao@mozilla.com>
Tue, 06 Sep 2016 13:04:01 +0200
changeset 312821 f5ba84cadbc99ef9cf6f508834da5ce4aa1eebbb
parent 312808 30689f91602f7bca209426bd296f275620747f9d
child 312822 8ef9025fbcd34dab99a1eb8a70089722cda93ae1
push id30661
push userkwierso@gmail.com
push dateWed, 07 Sep 2016 00:28:11 +0000
treeherdermozilla-central@3ba67e3bb588 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjohannh
bugs1299211
milestone51.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1299211 - Move icon transparency into identity-icon.svg and tracking-protection-16.svg and remove !important from .plugin-icon.plugin-blocked opacity. r=johannh
browser/themes/shared/identity-block/identity-block.inc.css
browser/themes/shared/identity-block/identity-icon.svg
browser/themes/shared/identity-block/tracking-protection-16.svg
browser/themes/shared/notification-icons.inc.css
--- a/browser/themes/shared/identity-block/identity-block.inc.css
+++ b/browser/themes/shared/identity-block/identity-block.inc.css
@@ -50,17 +50,16 @@
 }
 
 /* MAIN IDENTITY ICON */
 
 #identity-icon {
   width: 16px;
   height: 16px;
   list-style-image: url(chrome://browser/skin/identity-icon.svg#normal);
-  opacity: .5;
 }
 
 #identity-box:hover > #identity-icon:not(.no-hover),
 #identity-box[open=true] > #identity-icon {
   list-style-image: url(chrome://browser/skin/identity-icon.svg#hover);
 }
 
 #identity-box.grantedPermissions > #identity-icon {
@@ -69,29 +68,27 @@
 
 #identity-box.grantedPermissions:hover > #identity-icon:not(.no-hover),
 #identity-box.grantedPermissions[open=true] > #identity-icon {
   list-style-image: url(chrome://browser/skin/identity-icon.svg#notice-hover);
 }
 
 #urlbar[pageproxystate="valid"] > #identity-box.chromeUI > #identity-icon {
   list-style-image: url(chrome://branding/content/identity-icons-brand.svg);
-  opacity: 1;
 }
 
 #urlbar[pageproxystate="invalid"] > #identity-box > #identity-icon {
-  opacity: .2;
+  opacity: .3;
 }
 
 #urlbar[actiontype="searchengine"] > #identity-box > #identity-icon {
   -moz-image-region: inherit;
   list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon);
   width: 16px;
   height: 16px;
-  opacity: .5;
 }
 
 /* SHARING ICON */
 
 #sharing-icon {
   width: 16px;
   height: 16px;
   margin-inline-start: -16px;
@@ -135,23 +132,20 @@
 /* TRACKING PROTECTION ICON */
 
 #tracking-protection-icon {
   width: 16px;
   height: 16px;
   margin-inline-start: 2px;
   margin-inline-end: 0;
   list-style-image: url(chrome://browser/skin/tracking-protection-16.svg);
-  opacity: .5;
 }
 
 #tracking-protection-icon[state="loaded-tracking-content"] {
   list-style-image: url(chrome://browser/skin/tracking-protection-disabled-16.svg);
-  filter: none;
-  opacity: 1;
 }
 
 #tracking-protection-icon[animate] {
   transition: margin-left 200ms ease-out, margin-right 200ms ease-out;
 }
 
 #tracking-protection-icon:not([state]) {
   margin-inline-end: -18px;
--- a/browser/themes/shared/identity-block/identity-icon.svg
+++ b/browser/themes/shared/identity-block/identity-icon.svg
@@ -4,16 +4,17 @@
    - 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"
      width="64" height="16" viewBox="0 0 64 16">
   <defs>
     <style>
       path {
         fill-rule: evenodd;
         fill: -moz-fieldtext;
+        fill-opacity: .5;
       }
     </style>
   </defs>
 
   <view id="normal" viewBox="0 0 16 16"/>
   <g>
     <path d="M128,193a7,7,0,1,1,7-7A7,7,0,0,1,128,193Zm0-13a6,6,0,1,0,6,6A6,6,0,0,0,128,180Zm0,10a1,1,0,0,1-1-1v-3a1,1,0,0,1,2,0v3A1,1,0,0,1,128,190Zm0-6a1,1,0,1,1,1-1A1,1,0,0,1,128,184Z" transform="translate(-120 -178)"/>
   </g>
--- a/browser/themes/shared/identity-block/tracking-protection-16.svg
+++ b/browser/themes/shared/identity-block/tracking-protection-16.svg
@@ -12,10 +12,10 @@
     <mask id="mask-shield-cutout">
       <rect width="16" height="16" fill="#000" />
       <use xlink:href="#shape-shield-outer" fill="#fff" />
       <use xlink:href="#shape-shield-inner" fill="#000" />
       <use xlink:href="#shape-shield-detail" fill="#fff" />
     </mask>
   </defs>
 
-  <use xlink:href="#shape-shield-outer" mask="url(#mask-shield-cutout)" fill="-moz-fieldtext"/>
+  <use xlink:href="#shape-shield-outer" mask="url(#mask-shield-cutout)" fill="-moz-fieldtext" fill-opacity=".5"/>
 </svg>
--- a/browser/themes/shared/notification-icons.inc.css
+++ b/browser/themes/shared/notification-icons.inc.css
@@ -64,17 +64,17 @@
 .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:hover {
+.notification-anchor-icon:not(.plugin-blocked):hover {
   opacity: .6;
 }
 
 /* INDIVIDUAL NOTIFICATIONS */
 
 .popup-notification-icon[popupid="web-notifications"],
 .desktop-notification-icon {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#desktop-notification);
@@ -253,17 +253,17 @@
 
 .plugin-icon {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin);
 }
 
 .plugin-icon.plugin-blocked {
   list-style-image: url(chrome://browser/skin/notification-icons.svg#plugin-blocked);
   fill: #d92215;
-  opacity: 1 !important; /* !important to override the default hover opacity */
+  opacity: 1;
 }
 
 #notification-popup-box[hidden] {
   /* Override display:none to make the pluginBlockedNotification animation work
      when showing the notification repeatedly. */
   display: -moz-box;
   visibility: collapse;
 }