Bug 1041969 - Disabled icons in context menu should use GrayText. r=mdeboer, a=sledru
authorDão Gottwald <dao@mozilla.com>
Mon, 28 Jul 2014 21:23:03 +0200
changeset 208209 011c4355f782
parent 208208 2e2e1357e6ed
child 208210 fd04691e6c71
push id3770
push userryanvm@gmail.com
push date2014-07-31 17:17 +0000
treeherdermozilla-beta@fd04691e6c71 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmdeboer, sledru
bugs1041969
milestone32.0
Bug 1041969 - Disabled icons in context menu should use GrayText. r=mdeboer, a=sledru
browser/themes/linux/content-contextmenu.svg
browser/themes/osx/content-contextmenu.svg
browser/themes/shared/contextmenu.inc.css
browser/themes/windows/content-contextmenu.svg
--- a/browser/themes/linux/content-contextmenu.svg
+++ b/browser/themes/linux/content-contextmenu.svg
@@ -1,97 +1,73 @@
 <?xml version="1.0"?>
 <!-- This Source Code Form is subject to the terms of the Mozilla Public
    - 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/. -->
 <svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
      x="0px" y="0px"
      viewBox="0 0 16 16"
      enable-background="new 0 0 16 16"
      xml:space="preserve">
 <style>
-g:not(:target) {
+use:not(:target) {
   display: none;
 }
 
-path {
+use {
   fill: menutext;
 }
 
-g.active > path {
+use[id$="-active"] {
   fill: -moz-menuhovertext;
 }
+
+use[id$="-disabled"] {
+  fill: graytext;
+}
 </style>
-<g id="back">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
+<defs style="display:none">
+  <path id="back-shape" fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
     l5.199,5.301c0.607,0.63,1.465,0.764,1.915,0.297l1.02-1.082c0.449-0.467,0.32-1.357-0.288-1.99l-2.116-2.158h5.705
     c0.671,0,1.215-0.544,1.215-1.215v-2.43c0-0.671-0.544-1.215-1.215-1.215H8.094l2.271-2.309c0.609-0.626,0.737-1.512,0.288-1.974
     L9.635,0.278C9.184-0.188,8.327-0.055,7.718,0.575L2.479,5.901C2.38,5.946,2.289,6.008,2.21,6.089L1.192,7.171
     c-0.21,0.219-0.293,0.53-0.26,0.864C0.899,8.367,0.981,8.676,1.192,8.893z"/>
-</g>
-<g id="forward">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
+  <path id="forward-shape" fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
     L8.377,0.576C7.77-0.054,6.912-0.189,6.461,0.278L5.441,1.36c-0.449,0.467-0.32,1.357,0.288,1.99l2.116,2.158H2.14
     c-0.671,0-1.215,0.544-1.215,1.215v2.43c0,0.671,0.544,1.215,1.215,1.215h5.765l-2.271,2.309c-0.609,0.626-0.737,1.512-0.288,1.974
     l1.019,1.072c0.451,0.465,1.308,0.332,1.917-0.297l5.238-5.326c0.1-0.045,0.191-0.107,0.269-0.188l1.019-1.082
     c0.21-0.219,0.293-0.53,0.26-0.864C15.101,7.633,15.019,7.324,14.808,7.107z"/>
-</g>
-<g id="reload">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
+  <path id="reload-shape" fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
     c-2.554,0-4.625,2.071-4.625,4.625S5.446,13.196,8,13.196c1.638,0,3.069-0.857,3.891-2.141l2.576,1.104
     C13.199,14.439,10.794,16,8,16c-4.103,0-7.429-3.326-7.429-7.429S3.897,1.143,8,1.143c1.762,0,3.366,0.624,4.631,1.654L15.429,0V8z"/>
-</g>
-<g id="stop">
-  <polygon fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
+  <polygon id="stop-shape" fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
     5.377,8.059 0.157,13.292 2.819,15.961 8.039,10.728 13.298,16 15.959,13.331 10.701,8.06"/>
-</g>
-<g id="bookmark">
-  <path d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
+  <path id="bookmark-shape" d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
     L10.896,13l-1.959-1.039l-0.937-0.497l-0.937,0.497l-1.957,1.038L5.468,10.6l0.146-0.968L4.937,8.924L3.219,7.126l2.351-0.39
     l1.023-0.17l0.45-0.934L8.008,3.632 M8,0C7.72,0,7.44,0.217,7.228,0.65L5.242,4.766L0.907,5.485c-0.958,0.159-1.195,0.861-0.53,1.56
     l3.113,3.258l-0.69,4.583c-0.105,0.689,0.172,1.092,0.658,1.092c0.185,0,0.399-0.058,0.635-0.181l3.906-2.072l3.906,2.072
     c0.236,0.123,0.45,0.181,0.635,0.181c0.486,0,0.762-0.403,0.659-1.092l-0.687-4.583l3.109-3.255c0.666-0.702,0.428-1.404-0.53-1.564
     l-4.303-0.719L8.772,0.65C8.56,0.217,8.28,0,8,0L8,0z"/>
-</g>
-<g id="bookmark-starred">
-  <path d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
+  <path id="bookmarked-shape" d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
     l3.124,3.262l-0.692,4.589C2.679,15.596,2.957,16,3.444,16c0.185,0,0.401-0.058,0.637-0.181L8,13.744l3.919,2.075
     C12.156,15.942,12.372,16,12.557,16c0.487,0,0.764-0.404,0.661-1.094l-0.69-4.589l3.12-3.259c0.668-0.703,0.43-1.406-0.532-1.566
     l-4.317-0.72L8.775,0.651C8.562,0.217,8.281,0,8,0L8,0z"/>
-</g>
-<g id="back-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
-    l5.199,5.301c0.607,0.63,1.465,0.764,1.915,0.297l1.02-1.082c0.449-0.467,0.32-1.357-0.288-1.99l-2.116-2.158h5.705
-    c0.671,0,1.215-0.544,1.215-1.215v-2.43c0-0.671-0.544-1.215-1.215-1.215H8.094l2.271-2.309c0.609-0.626,0.737-1.512,0.288-1.974
-    L9.635,0.278C9.184-0.188,8.327-0.055,7.718,0.575L2.479,5.901C2.38,5.946,2.289,6.008,2.21,6.089L1.192,7.171
-    c-0.21,0.219-0.293,0.53-0.26,0.864C0.899,8.367,0.981,8.676,1.192,8.893z"/>
-</g>
-<g id="forward-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
-    L8.377,0.576C7.77-0.054,6.912-0.189,6.461,0.278L5.441,1.36c-0.449,0.467-0.32,1.357,0.288,1.99l2.116,2.158H2.14
-    c-0.671,0-1.215,0.544-1.215,1.215v2.43c0,0.671,0.544,1.215,1.215,1.215h5.765l-2.271,2.309c-0.609,0.626-0.737,1.512-0.288,1.974
-    l1.019,1.072c0.451,0.465,1.308,0.332,1.917-0.297l5.238-5.326c0.1-0.045,0.191-0.107,0.269-0.188l1.019-1.082
-    c0.21-0.219,0.293-0.53,0.26-0.864C15.101,7.633,15.019,7.324,14.808,7.107z"/>
-</g>
-<g id="reload-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
-    c-2.554,0-4.625,2.071-4.625,4.625S5.446,13.196,8,13.196c1.638,0,3.069-0.857,3.891-2.141l2.576,1.104
-    C13.199,14.439,10.794,16,8,16c-4.103,0-7.429-3.326-7.429-7.429S3.897,1.143,8,1.143c1.762,0,3.366,0.624,4.631,1.654L15.429,0V8z"/>
-</g>
-<g id="stop-active" class="active">
-  <polygon fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
-    5.377,8.059 0.157,13.292 2.819,15.961 8.039,10.728 13.298,16 15.959,13.331 10.701,8.06"/>
-</g>
-<g id="bookmark-active" class="active">
-  <path d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
-    L10.896,13l-1.959-1.039l-0.937-0.497l-0.937,0.497l-1.957,1.038L5.468,10.6l0.146-0.968L4.937,8.924L3.219,7.126l2.351-0.39
-    l1.023-0.17l0.45-0.934L8.008,3.632 M8,0C7.72,0,7.44,0.217,7.228,0.65L5.242,4.766L0.907,5.485c-0.958,0.159-1.195,0.861-0.53,1.56
-    l3.113,3.258l-0.69,4.583c-0.105,0.689,0.172,1.092,0.658,1.092c0.185,0,0.399-0.058,0.635-0.181l3.906-2.072l3.906,2.072
-    c0.236,0.123,0.45,0.181,0.635,0.181c0.486,0,0.762-0.403,0.659-1.092l-0.687-4.583l3.109-3.255c0.666-0.702,0.428-1.404-0.53-1.564
-    l-4.303-0.719L8.772,0.65C8.56,0.217,8.28,0,8,0L8,0z"/>
-</g>
-<g id="bookmark-starred-active" class="active">
-  <path d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
-    l3.124,3.262l-0.692,4.589C2.679,15.596,2.957,16,3.444,16c0.185,0,0.401-0.058,0.637-0.181L8,13.744l3.919,2.075
-    C12.156,15.942,12.372,16,12.557,16c0.487,0,0.764-0.404,0.661-1.094l-0.69-4.589l3.12-3.259c0.668-0.703,0.43-1.406-0.532-1.566
-    l-4.317-0.72L8.775,0.651C8.562,0.217,8.281,0,8,0L8,0z"/>
-</g>
+</defs>
+<use id="back"                xlink:href="#back-shape"/>
+<use id="back-active"         xlink:href="#back-shape"/>
+<use id="back-disabled"       xlink:href="#back-shape"/>
+<use id="forward"             xlink:href="#forward-shape"/>
+<use id="forward-active"      xlink:href="#forward-shape"/>
+<use id="forward-disabled"    xlink:href="#forward-shape"/>
+<use id="reload"              xlink:href="#reload-shape"/>
+<use id="reload-active"       xlink:href="#reload-shape"/>
+<use id="reload-disabled"     xlink:href="#reload-shape"/>
+<use id="stop"                xlink:href="#stop-shape"/>
+<use id="stop-active"         xlink:href="#stop-shape"/>
+<use id="stop-disabled"       xlink:href="#stop-shape"/>
+<use id="bookmark"            xlink:href="#bookmark-shape"/>
+<use id="bookmark-active"     xlink:href="#bookmark-shape"/>
+<use id="bookmark-disabled"   xlink:href="#bookmark-shape"/>
+<use id="bookmarked"          xlink:href="#bookmarked-shape"/>
+<use id="bookmarked-active"   xlink:href="#bookmarked-shape"/>
+<use id="bookmarked-disabled" xlink:href="#bookmarked-shape"/>
 </svg>
--- a/browser/themes/osx/content-contextmenu.svg
+++ b/browser/themes/osx/content-contextmenu.svg
@@ -1,97 +1,73 @@
 <?xml version="1.0"?>
 <!-- This Source Code Form is subject to the terms of the Mozilla Public
    - 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/. -->
 <svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
      x="0px" y="0px"
      viewBox="0 0 16 16"
      enable-background="new 0 0 16 16"
      xml:space="preserve">
 <style>
-g:not(:target) {
+use:not(:target) {
   display: none;
 }
 
-path {
+use {
   fill: menutext;
 }
 
-g.active > path {
+use[id$="-active"] {
   fill: -moz-mac-menutextselect;
 }
+
+use[id$="-disabled"] {
+  fill: -moz-mac-menutextdisable;
+}
 </style>
-<g id="back">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
+<defs style="display:none">
+  <path id="back-shape" fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
     l5.199,5.301c0.607,0.63,1.465,0.764,1.915,0.297l1.02-1.082c0.449-0.467,0.32-1.357-0.288-1.99l-2.116-2.158h5.705
     c0.671,0,1.215-0.544,1.215-1.215v-2.43c0-0.671-0.544-1.215-1.215-1.215H8.094l2.271-2.309c0.609-0.626,0.737-1.512,0.288-1.974
     L9.635,0.278C9.184-0.188,8.327-0.055,7.718,0.575L2.479,5.901C2.38,5.946,2.289,6.008,2.21,6.089L1.192,7.171
     c-0.21,0.219-0.293,0.53-0.26,0.864C0.899,8.367,0.981,8.676,1.192,8.893z"/>
-</g>
-<g id="forward">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
+  <path id="forward-shape" fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
     L8.377,0.576C7.77-0.054,6.912-0.189,6.461,0.278L5.441,1.36c-0.449,0.467-0.32,1.357,0.288,1.99l2.116,2.158H2.14
     c-0.671,0-1.215,0.544-1.215,1.215v2.43c0,0.671,0.544,1.215,1.215,1.215h5.765l-2.271,2.309c-0.609,0.626-0.737,1.512-0.288,1.974
     l1.019,1.072c0.451,0.465,1.308,0.332,1.917-0.297l5.238-5.326c0.1-0.045,0.191-0.107,0.269-0.188l1.019-1.082
     c0.21-0.219,0.293-0.53,0.26-0.864C15.101,7.633,15.019,7.324,14.808,7.107z"/>
-</g>
-<g id="reload">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
+  <path id="reload-shape" fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
     c-2.554,0-4.625,2.071-4.625,4.625S5.446,13.196,8,13.196c1.638,0,3.069-0.857,3.891-2.141l2.576,1.104
     C13.199,14.439,10.794,16,8,16c-4.103,0-7.429-3.326-7.429-7.429S3.897,1.143,8,1.143c1.762,0,3.366,0.624,4.631,1.654L15.429,0V8z"/>
-</g>
-<g id="stop">
-  <polygon fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
+  <polygon id="stop-shape" fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
     5.377,8.059 0.157,13.292 2.819,15.961 8.039,10.728 13.298,16 15.959,13.331 10.701,8.06"/>
-</g>
-<g id="bookmark">
-  <path d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
+  <path id="bookmark-shape" d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
     L10.896,13l-1.959-1.039l-0.937-0.497l-0.937,0.497l-1.957,1.038L5.468,10.6l0.146-0.968L4.937,8.924L3.219,7.126l2.351-0.39
     l1.023-0.17l0.45-0.934L8.008,3.632 M8,0C7.72,0,7.44,0.217,7.228,0.65L5.242,4.766L0.907,5.485c-0.958,0.159-1.195,0.861-0.53,1.56
     l3.113,3.258l-0.69,4.583c-0.105,0.689,0.172,1.092,0.658,1.092c0.185,0,0.399-0.058,0.635-0.181l3.906-2.072l3.906,2.072
     c0.236,0.123,0.45,0.181,0.635,0.181c0.486,0,0.762-0.403,0.659-1.092l-0.687-4.583l3.109-3.255c0.666-0.702,0.428-1.404-0.53-1.564
     l-4.303-0.719L8.772,0.65C8.56,0.217,8.28,0,8,0L8,0z"/>
-</g>
-<g id="bookmark-starred">
-  <path d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
+  <path id="bookmarked-shape" d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
     l3.124,3.262l-0.692,4.589C2.679,15.596,2.957,16,3.444,16c0.185,0,0.401-0.058,0.637-0.181L8,13.744l3.919,2.075
     C12.156,15.942,12.372,16,12.557,16c0.487,0,0.764-0.404,0.661-1.094l-0.69-4.589l3.12-3.259c0.668-0.703,0.43-1.406-0.532-1.566
     l-4.317-0.72L8.775,0.651C8.562,0.217,8.281,0,8,0L8,0z"/>
-</g>
-<g id="back-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
-    l5.199,5.301c0.607,0.63,1.465,0.764,1.915,0.297l1.02-1.082c0.449-0.467,0.32-1.357-0.288-1.99l-2.116-2.158h5.705
-    c0.671,0,1.215-0.544,1.215-1.215v-2.43c0-0.671-0.544-1.215-1.215-1.215H8.094l2.271-2.309c0.609-0.626,0.737-1.512,0.288-1.974
-    L9.635,0.278C9.184-0.188,8.327-0.055,7.718,0.575L2.479,5.901C2.38,5.946,2.289,6.008,2.21,6.089L1.192,7.171
-    c-0.21,0.219-0.293,0.53-0.26,0.864C0.899,8.367,0.981,8.676,1.192,8.893z"/>
-</g>
-<g id="forward-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
-    L8.377,0.576C7.77-0.054,6.912-0.189,6.461,0.278L5.441,1.36c-0.449,0.467-0.32,1.357,0.288,1.99l2.116,2.158H2.14
-    c-0.671,0-1.215,0.544-1.215,1.215v2.43c0,0.671,0.544,1.215,1.215,1.215h5.765l-2.271,2.309c-0.609,0.626-0.737,1.512-0.288,1.974
-    l1.019,1.072c0.451,0.465,1.308,0.332,1.917-0.297l5.238-5.326c0.1-0.045,0.191-0.107,0.269-0.188l1.019-1.082
-    c0.21-0.219,0.293-0.53,0.26-0.864C15.101,7.633,15.019,7.324,14.808,7.107z"/>
-</g>
-<g id="reload-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
-    c-2.554,0-4.625,2.071-4.625,4.625S5.446,13.196,8,13.196c1.638,0,3.069-0.857,3.891-2.141l2.576,1.104
-    C13.199,14.439,10.794,16,8,16c-4.103,0-7.429-3.326-7.429-7.429S3.897,1.143,8,1.143c1.762,0,3.366,0.624,4.631,1.654L15.429,0V8z"/>
-</g>
-<g id="stop-active" class="active">
-  <polygon fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
-    5.377,8.059 0.157,13.292 2.819,15.961 8.039,10.728 13.298,16 15.959,13.331 10.701,8.06"/>
-</g>
-<g id="bookmark-active" class="active">
-  <path d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
-    L10.896,13l-1.959-1.039l-0.937-0.497l-0.937,0.497l-1.957,1.038L5.468,10.6l0.146-0.968L4.937,8.924L3.219,7.126l2.351-0.39
-    l1.023-0.17l0.45-0.934L8.008,3.632 M8,0C7.72,0,7.44,0.217,7.228,0.65L5.242,4.766L0.907,5.485c-0.958,0.159-1.195,0.861-0.53,1.56
-    l3.113,3.258l-0.69,4.583c-0.105,0.689,0.172,1.092,0.658,1.092c0.185,0,0.399-0.058,0.635-0.181l3.906-2.072l3.906,2.072
-    c0.236,0.123,0.45,0.181,0.635,0.181c0.486,0,0.762-0.403,0.659-1.092l-0.687-4.583l3.109-3.255c0.666-0.702,0.428-1.404-0.53-1.564
-    l-4.303-0.719L8.772,0.65C8.56,0.217,8.28,0,8,0L8,0z"/>
-</g>
-<g id="bookmark-starred-active" class="active">
-  <path d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
-    l3.124,3.262l-0.692,4.589C2.679,15.596,2.957,16,3.444,16c0.185,0,0.401-0.058,0.637-0.181L8,13.744l3.919,2.075
-    C12.156,15.942,12.372,16,12.557,16c0.487,0,0.764-0.404,0.661-1.094l-0.69-4.589l3.12-3.259c0.668-0.703,0.43-1.406-0.532-1.566
-    l-4.317-0.72L8.775,0.651C8.562,0.217,8.281,0,8,0L8,0z"/>
-</g>
+</defs>
+<use id="back"                xlink:href="#back-shape"/>
+<use id="back-active"         xlink:href="#back-shape"/>
+<use id="back-disabled"       xlink:href="#back-shape"/>
+<use id="forward"             xlink:href="#forward-shape"/>
+<use id="forward-active"      xlink:href="#forward-shape"/>
+<use id="forward-disabled"    xlink:href="#forward-shape"/>
+<use id="reload"              xlink:href="#reload-shape"/>
+<use id="reload-active"       xlink:href="#reload-shape"/>
+<use id="reload-disabled"     xlink:href="#reload-shape"/>
+<use id="stop"                xlink:href="#stop-shape"/>
+<use id="stop-active"         xlink:href="#stop-shape"/>
+<use id="stop-disabled"       xlink:href="#stop-shape"/>
+<use id="bookmark"            xlink:href="#bookmark-shape"/>
+<use id="bookmark-active"     xlink:href="#bookmark-shape"/>
+<use id="bookmark-disabled"   xlink:href="#bookmark-shape"/>
+<use id="bookmarked"          xlink:href="#bookmarked-shape"/>
+<use id="bookmarked-active"   xlink:href="#bookmarked-shape"/>
+<use id="bookmarked-disabled" xlink:href="#bookmarked-shape"/>
 </svg>
--- a/browser/themes/shared/contextmenu.inc.css
+++ b/browser/themes/shared/contextmenu.inc.css
@@ -1,63 +1,78 @@
-
-menugroup > .menuitem-iconic[disabled="true"] > .menu-iconic-left {
-  opacity: .3;
-}
-
 #context-navigation > .menuitem-iconic {
   -moz-box-flex: 1;
   -moz-box-pack: center;
   -moz-box-align: center;
 }
 
 #context-navigation > .menuitem-iconic > .menu-iconic-left {
   -moz-appearance: none;
 }
 
-#context-back > .menu-iconic-left {
+#context-back {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#back");
 }
 
-#context-back[_moz-menuactive=true]:not([disabled]) > .menu-iconic-left {
+#context-back[_moz-menuactive=true] {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#back-active");
 }
 
-#context-forward > .menu-iconic-left {
+#context-back[disabled=true] {
+  list-style-image: url("chrome://browser/skin/content-contextmenu.svg#back-disabled");
+}
+
+#context-forward {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#forward");
 }
 
-#context-forward[_moz-menuactive=true]:not([disabled]) > .menu-iconic-left {
+#context-forward[_moz-menuactive=true] {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#forward-active");
 }
 
-#context-reload > .menu-iconic-left {
+#context-forward[disabled=true] {
+  list-style-image: url("chrome://browser/skin/content-contextmenu.svg#forward-disabled");
+}
+
+#context-reload {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#reload");
 }
 
-#context-reload[_moz-menuactive=true]:not([disabled]) > .menu-iconic-left {
+#context-reload[_moz-menuactive=true] {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#reload-active");
 }
 
-#context-stop > .menu-iconic-left {
+#context-reload[disabled=true] {
+  list-style-image: url("chrome://browser/skin/content-contextmenu.svg#reload-disabled");
+}
+
+#context-stop {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#stop");
 }
 
-#context-stop[_moz-menuactive=true]:not([disabled]) > .menu-iconic-left {
+#context-stop[_moz-menuactive=true] {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#stop-active");
 }
 
-#context-bookmarkpage > .menu-iconic-left {
+#context-stop[disabled=true] {
+  list-style-image: url("chrome://browser/skin/content-contextmenu.svg#stop-disabled");
+}
+
+#context-bookmarkpage {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark");
 }
 
-#context-bookmarkpage[_moz-menuactive=true]:not([disabled]) > .menu-iconic-left {
+#context-bookmarkpage[_moz-menuactive=true] {
   list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark-active");
 }
 
+#context-bookmarkpage[disabled=true] {
+  list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark-disabled");
+}
+
 #context-back:-moz-locale-dir(rtl),
 #context-forward:-moz-locale-dir(rtl),
 #context-reload:-moz-locale-dir(rtl) {
   transform: scaleX(-1);
 }
 
 #context-navigation > .menuitem-iconic > .menu-iconic-left > .menu-iconic-icon {
   width: 16px;
--- a/browser/themes/windows/content-contextmenu.svg
+++ b/browser/themes/windows/content-contextmenu.svg
@@ -1,97 +1,73 @@
 <?xml version="1.0"?>
 <!-- This Source Code Form is subject to the terms of the Mozilla Public
    - 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/. -->
 <svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink"
      x="0px" y="0px"
      viewBox="0 0 16 16"
      enable-background="new 0 0 16 16"
      xml:space="preserve">
 <style>
-g:not(:target) {
+use:not(:target) {
   display: none;
 }
 
-path {
+use {
   fill: menutext;
 }
 
-g.active > path {
+use[id$="-active"] {
   fill: -moz-menuhovertext;
 }
+
+use[id$="-disabled"] {
+  fill: graytext;
+}
 </style>
-<g id="back">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
+<defs style="display:none">
+  <path id="back-shape" fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
     l5.199,5.301c0.607,0.63,1.465,0.764,1.915,0.297l1.02-1.082c0.449-0.467,0.32-1.357-0.288-1.99l-2.116-2.158h5.705
     c0.671,0,1.215-0.544,1.215-1.215v-2.43c0-0.671-0.544-1.215-1.215-1.215H8.094l2.271-2.309c0.609-0.626,0.737-1.512,0.288-1.974
     L9.635,0.278C9.184-0.188,8.327-0.055,7.718,0.575L2.479,5.901C2.38,5.946,2.289,6.008,2.21,6.089L1.192,7.171
     c-0.21,0.219-0.293,0.53-0.26,0.864C0.899,8.367,0.981,8.676,1.192,8.893z"/>
-</g>
-<g id="forward">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
+  <path id="forward-shape" fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
     L8.377,0.576C7.77-0.054,6.912-0.189,6.461,0.278L5.441,1.36c-0.449,0.467-0.32,1.357,0.288,1.99l2.116,2.158H2.14
     c-0.671,0-1.215,0.544-1.215,1.215v2.43c0,0.671,0.544,1.215,1.215,1.215h5.765l-2.271,2.309c-0.609,0.626-0.737,1.512-0.288,1.974
     l1.019,1.072c0.451,0.465,1.308,0.332,1.917-0.297l5.238-5.326c0.1-0.045,0.191-0.107,0.269-0.188l1.019-1.082
     c0.21-0.219,0.293-0.53,0.26-0.864C15.101,7.633,15.019,7.324,14.808,7.107z"/>
-</g>
-<g id="reload">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
+  <path id="reload-shape" fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
     c-2.554,0-4.625,2.071-4.625,4.625S5.446,13.196,8,13.196c1.638,0,3.069-0.857,3.891-2.141l2.576,1.104
     C13.199,14.439,10.794,16,8,16c-4.103,0-7.429-3.326-7.429-7.429S3.897,1.143,8,1.143c1.762,0,3.366,0.624,4.631,1.654L15.429,0V8z"/>
-</g>
-<g id="stop">
-  <polygon fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
+  <polygon id="stop-shape" fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
     5.377,8.059 0.157,13.292 2.819,15.961 8.039,10.728 13.298,16 15.959,13.331 10.701,8.06"/>
-</g>
-<g id="bookmark">
-  <path d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
+  <path id="bookmark-shape" d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
     L10.896,13l-1.959-1.039l-0.937-0.497l-0.937,0.497l-1.957,1.038L5.468,10.6l0.146-0.968L4.937,8.924L3.219,7.126l2.351-0.39
     l1.023-0.17l0.45-0.934L8.008,3.632 M8,0C7.72,0,7.44,0.217,7.228,0.65L5.242,4.766L0.907,5.485c-0.958,0.159-1.195,0.861-0.53,1.56
     l3.113,3.258l-0.69,4.583c-0.105,0.689,0.172,1.092,0.658,1.092c0.185,0,0.399-0.058,0.635-0.181l3.906-2.072l3.906,2.072
     c0.236,0.123,0.45,0.181,0.635,0.181c0.486,0,0.762-0.403,0.659-1.092l-0.687-4.583l3.109-3.255c0.666-0.702,0.428-1.404-0.53-1.564
     l-4.303-0.719L8.772,0.65C8.56,0.217,8.28,0,8,0L8,0z"/>
-</g>
-<g id="bookmark-starred">
-  <path d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
+  <path id="bookmarked-shape" d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
     l3.124,3.262l-0.692,4.589C2.679,15.596,2.957,16,3.444,16c0.185,0,0.401-0.058,0.637-0.181L8,13.744l3.919,2.075
     C12.156,15.942,12.372,16,12.557,16c0.487,0,0.764-0.404,0.661-1.094l-0.69-4.589l3.12-3.259c0.668-0.703,0.43-1.406-0.532-1.566
     l-4.317-0.72L8.775,0.651C8.562,0.217,8.281,0,8,0L8,0z"/>
-</g>
-<g id="back-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M1.192,8.893L2.21,9.964c0.064,0.065,0.136,0.117,0.214,0.159
-    l5.199,5.301c0.607,0.63,1.465,0.764,1.915,0.297l1.02-1.082c0.449-0.467,0.32-1.357-0.288-1.99l-2.116-2.158h5.705
-    c0.671,0,1.215-0.544,1.215-1.215v-2.43c0-0.671-0.544-1.215-1.215-1.215H8.094l2.271-2.309c0.609-0.626,0.737-1.512,0.288-1.974
-    L9.635,0.278C9.184-0.188,8.327-0.055,7.718,0.575L2.479,5.901C2.38,5.946,2.289,6.008,2.21,6.089L1.192,7.171
-    c-0.21,0.219-0.293,0.53-0.26,0.864C0.899,8.367,0.981,8.676,1.192,8.893z"/>
-</g>
-<g id="forward-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M14.808,7.107L13.79,6.036c-0.064-0.065-0.136-0.117-0.214-0.159
-    L8.377,0.576C7.77-0.054,6.912-0.189,6.461,0.278L5.441,1.36c-0.449,0.467-0.32,1.357,0.288,1.99l2.116,2.158H2.14
-    c-0.671,0-1.215,0.544-1.215,1.215v2.43c0,0.671,0.544,1.215,1.215,1.215h5.765l-2.271,2.309c-0.609,0.626-0.737,1.512-0.288,1.974
-    l1.019,1.072c0.451,0.465,1.308,0.332,1.917-0.297l5.238-5.326c0.1-0.045,0.191-0.107,0.269-0.188l1.019-1.082
-    c0.21-0.219,0.293-0.53,0.26-0.864C15.101,7.633,15.019,7.324,14.808,7.107z"/>
-</g>
-<g id="reload-active" class="active">
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M15.429,8h-8l3.207-3.207C9.889,4.265,8.986,3.947,8,3.947
-    c-2.554,0-4.625,2.071-4.625,4.625S5.446,13.196,8,13.196c1.638,0,3.069-0.857,3.891-2.141l2.576,1.104
-    C13.199,14.439,10.794,16,8,16c-4.103,0-7.429-3.326-7.429-7.429S3.897,1.143,8,1.143c1.762,0,3.366,0.624,4.631,1.654L15.429,0V8z"/>
-</g>
-<g id="stop-active" class="active">
-  <polygon fill-rule="evenodd" clip-rule="evenodd" points="16,2.748 13.338,0.079 8.038,5.391 2.661,0 0,2.669
-    5.377,8.059 0.157,13.292 2.819,15.961 8.039,10.728 13.298,16 15.959,13.331 10.701,8.06"/>
-</g>
-<g id="bookmark-active" class="active">
-  <path d="M8.008,3.632l0.986,2.012l0.452,0.922l1.014,0.169l2.326,0.389l-1.719,1.799l-0.676,0.708l0.145,0.967
-    L10.896,13l-1.959-1.039l-0.937-0.497l-0.937,0.497l-1.957,1.038L5.468,10.6l0.146-0.968L4.937,8.924L3.219,7.126l2.351-0.39
-    l1.023-0.17l0.45-0.934L8.008,3.632 M8,0C7.72,0,7.44,0.217,7.228,0.65L5.242,4.766L0.907,5.485c-0.958,0.159-1.195,0.861-0.53,1.56
-    l3.113,3.258l-0.69,4.583c-0.105,0.689,0.172,1.092,0.658,1.092c0.185,0,0.399-0.058,0.635-0.181l3.906-2.072l3.906,2.072
-    c0.236,0.123,0.45,0.181,0.635,0.181c0.486,0,0.762-0.403,0.659-1.092l-0.687-4.583l3.109-3.255c0.666-0.702,0.428-1.404-0.53-1.564
-    l-4.303-0.719L8.772,0.65C8.56,0.217,8.28,0,8,0L8,0z"/>
-</g>
-<g id="bookmark-starred-active" class="active">
-  <path d="M8,0C7.719,0,7.438,0.217,7.225,0.651L5.233,4.773l-4.35,0.72c-0.961,0.159-1.199,0.862-0.531,1.562
-    l3.124,3.262l-0.692,4.589C2.679,15.596,2.957,16,3.444,16c0.185,0,0.401-0.058,0.637-0.181L8,13.744l3.919,2.075
-    C12.156,15.942,12.372,16,12.557,16c0.487,0,0.764-0.404,0.661-1.094l-0.69-4.589l3.12-3.259c0.668-0.703,0.43-1.406-0.532-1.566
-    l-4.317-0.72L8.775,0.651C8.562,0.217,8.281,0,8,0L8,0z"/>
-</g>
+</defs>
+<use id="back"                xlink:href="#back-shape"/>
+<use id="back-active"         xlink:href="#back-shape"/>
+<use id="back-disabled"       xlink:href="#back-shape"/>
+<use id="forward"             xlink:href="#forward-shape"/>
+<use id="forward-active"      xlink:href="#forward-shape"/>
+<use id="forward-disabled"    xlink:href="#forward-shape"/>
+<use id="reload"              xlink:href="#reload-shape"/>
+<use id="reload-active"       xlink:href="#reload-shape"/>
+<use id="reload-disabled"     xlink:href="#reload-shape"/>
+<use id="stop"                xlink:href="#stop-shape"/>
+<use id="stop-active"         xlink:href="#stop-shape"/>
+<use id="stop-disabled"       xlink:href="#stop-shape"/>
+<use id="bookmark"            xlink:href="#bookmark-shape"/>
+<use id="bookmark-active"     xlink:href="#bookmark-shape"/>
+<use id="bookmark-disabled"   xlink:href="#bookmark-shape"/>
+<use id="bookmarked"          xlink:href="#bookmarked-shape"/>
+<use id="bookmarked-active"   xlink:href="#bookmarked-shape"/>
+<use id="bookmarked-disabled" xlink:href="#bookmarked-shape"/>
 </svg>