Bug 1000625 - Add namespace for xul elements. r=Unfocused
authorValentin Tsatskin <vtsatskin@mozilla.com>
Thu, 07 Aug 2014 12:56:35 +0200
changeset 198385 b771af2fac6268b600d20361a202667a51d46baf
parent 198384 0138ce9c60408dcee37d6432b0f996d6c3dd51b2
child 198386 977a99c032e71e75d23917da52086b6fcb49959a
push id1
push userroot
push dateMon, 20 Oct 2014 17:29:22 +0000
reviewersUnfocused
bugs1000625
milestone34.0a1
Bug 1000625 - Add namespace for xul elements. r=Unfocused
browser/themes/linux/in-content/common.css
browser/themes/osx/in-content/common.css
browser/themes/shared/in-content/common.inc.css
browser/themes/windows/in-content/common.css
--- a/browser/themes/linux/in-content/common.css
+++ b/browser/themes/linux/in-content/common.css
@@ -1,62 +1,62 @@
 /* - 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/. */
 
 %include ../../shared/in-content/common.inc.css
 
-tab[selected] {
+xul|tab[selected] {
   /* Override styles for tab[selected] from
      toolkit/themes/linux/global/tabbox.css */
   margin-bottom: 0;
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 0;
 }
 
-button,
-colorpicker[type="button"],
-menulist {
+xul|button,
+xul|colorpicker[type="button"],
+xul|menulist {
   margin: 2px 4px;
 }
 
-button > .button-box,
-menulist > .menulist-label-box {
+xul|button > xul|*.button-box,
+xul|menulist > xul|*.menulist-label-box {
   -moz-appearance: none;
 }
 
-button[type="menu"] > .button-box > .button-menu-dropmarker {
+xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
   -moz-appearance: none !important;
 }
 
-.help-button > .button-box > .button-icon {
+xul|*.help-button > xul|*.button-box > xul|*.button-icon {
   -moz-margin-end: 0;
 }
 
-menulist {
+xul|menulist {
   font-size: inherit;
 }
 
-menulist:not([editable="true"]) > .menulist-dropmarker {
+xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
   display: -moz-box;
   margin-top: 6px;
   margin-bottom: 6px;
 }
 
-checkbox {
+xul|checkbox {
   -moz-binding: url("chrome://global/content/bindings/checkbox.xml#checkbox");
   -moz-box-align: center;
 }
 
-radio {
+xul|radio {
   -moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
   -moz-box-align: center;
   -moz-margin-start: 0;
 }
 
-.radio-label-box {
+xul|*.radio-label-box {
   -moz-appearance: none;
 }
 
-.numberbox-input-box {
+xul|*.numberbox-input-box {
   -moz-appearance: none;
   border-width: 0;
 }
--- a/browser/themes/osx/in-content/common.css
+++ b/browser/themes/osx/in-content/common.css
@@ -1,60 +1,60 @@
 /* - 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/. */
 
 %include ../../shared/in-content/common.inc.css
 
-tabs {
+xul|tabs {
   padding-right: 0;
   padding-left: 0;
 }
 
-tab[selected] {
+xul|tab[selected] {
   text-shadow: none;
 }
 
-button,
-colorpicker[type="button"],
-menulist {
+xul|button,
+xul|colorpicker[type="button"],
+xul|menulist {
   margin-top: 3px;
 }
 
-menulist:not([editable="true"]) > menupopup > menuitem[checked="true"]::before,
-menulist:not([editable="true"]) > menupopup > menuitem[selected="true"]::before {
+xul|menulist:not([editable="true"]) > xul|menupopup > xul|menuitem[checked="true"]::before,
+xul|menulist:not([editable="true"]) > xul|menupopup > xul|menuitem[selected="true"]::before {
   display: none;
 }
 
-menulist:not([editable="true"]) > .menulist-dropmarker {
+xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
   display: -moz-box;
   margin-top: 1px;
   margin-bottom: 1px;
 }
 
-menulist > menupopup menu,
-menulist > menupopup menuitem,
-button[type="menu"] > menupopup menu,
-button[type="menu"] > menupopup menuitem {
+xul|menulist > xul|menupopup xul|menu,
+xul|menulist > xul|menupopup xul|menuitem,
+xul|button[type="menu"] > xul|menupopup xul|menu,
+xul|button[type="menu"] > xul|menupopup xul|menuitem {
   -moz-padding-end: 34px;
 }
 
-.help-button > .button-box > .button-icon {
+xul|*.help-button > xul|*.button-box > xul|*.button-icon {
   -moz-margin-start: 0;
 }
 
-.checkbox-icon {
+xul|*.checkbox-icon {
   margin-right: 0;
 }
 
-.radio-icon {
+xul|*.radio-icon {
   -moz-margin-end: 0;
 }
 
-.numberbox-input-box {
+xul|*.numberbox-input-box {
   -moz-appearance: none;
   border-width: 0;
 }
 
-description {
+xul|description {
   font-size: 1.25rem;
   line-height: 22px;
 }
--- a/browser/themes/shared/in-content/common.inc.css
+++ b/browser/themes/shared/in-content/common.inc.css
@@ -1,28 +1,29 @@
 %if 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/. */
 %endif
 @namespace html "http://www.w3.org/1999/xhtml";
+@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 
 html|body,
-page {
+xul|page {
   font: message-box;
   -moz-appearance: none;
   background-color: #f1f1f1;
   color: #424e5a;
 }
 
-* {
+*|* {
   -moz-user-select: text;
 }
 
-treecol {
+xul|treecol {
   /* override the * rule to let the treecol be sortable */
   -moz-user-select: none;
 }
 
 html|body {
   font-size: 15px;
   font-weight: normal;
   margin: 0;
@@ -31,560 +32,562 @@ html|body {
 html|h1 {
   font-size: 2.5em;
   font-weight: lighter;
   line-height: 1.2;
   margin: 0;
   margin-bottom: .5em;
 }
 
-caption {
+xul|caption {
   -moz-appearance: none;
   margin: 0;
 }
 
-caption > label {
+xul|caption > xul|label {
   font-size: 1.3rem;
   font-weight: bold;
   line-height: 22px;
   margin: 0 !important;
 }
 
-.main-content {
+*|*.main-content {
   padding: 40px 48px 48px;
   overflow: auto;
 }
 
-prefpane > .content-box {
+xul|prefpane > xul|*.content-box {
   overflow: visible;
 }
 
 /* groupboxes */
 
-groupbox {
+xul|groupbox {
   -moz-appearance: none;
   border: none;
   margin-top: 15px;
   margin-bottom: 15px;
   -moz-margin-end: 0;
   -moz-padding-start: 0;
   -moz-padding-end: 0;
   font-size: 1.25rem;
 }
 
-groupbox label {
+xul|groupbox xul|label {
   /* !important needed to override toolkit !important rule */
   -moz-margin-start: 0 !important;
   -moz-margin-end: 0 !important;
 }
 
 /* tabpanels and tabs */
 
-tabpanels {
+xul|tabpanels {
   -moz-appearance: none;
   font-size: 1.25rem;
   line-height: 22px;
   border: none;
   padding: 0;
   background-color: transparent;
 }
 
-tabs {
+xul|tabs {
   margin-bottom: 15px;
   border-top: 1px solid #c1c1c1;
   border-bottom: 1px solid #c1c1c1;
   background-color: #fbfbfb;
 }
 
-.tabs-left,
-.tabs-right {
+xul|*.tabs-left,
+xul|*.tabs-right {
   border-bottom: none;
 }
 
-tab {
+xul|tab {
   -moz-appearance: none;
   margin-top: 0;
   padding: 0 20px;
   min-height: 44px;
   color: #424f5a;
   background-color: #fbfbfb;
   border-width: 0;
   transition: background-color 50ms ease 0s;
 }
 
-tab:hover {
+xul|tab:hover {
   background-color: #ebebeb;
 }
 
-tab[selected] {
+xul|tab[selected] {
   background-color: #ebebeb;
   box-shadow: inset 0 -4px 0 0 #ff9500;
 }
 
-.tab-text {
+xul|*.tab-text {
   font-size: 1.3rem;
   line-height: 22px;
 }
 
 /* html buttons */
 
 html|button {
   padding: 3px;
   /* override forms.css */
   font: inherit;
 }
 
 /* xul buttons and menulists */
 
-button,
-colorpicker[type="button"],
-menulist {
+*|button,
+xul|colorpicker[type="button"],
+xul|menulist {
   -moz-appearance: none;
   height: 30px;
   color: #333;
   line-height: 20px;
   text-shadow: 0 1px 1px #fefffe;
   border: 1px solid #c1c1c1;
   -moz-border-top-colors: none !important;
   -moz-border-right-colors: none !important;
   -moz-border-bottom-colors: none !important;
   -moz-border-left-colors: none !important;
   border-radius: 2px;
   background-color: #fbfbfb;
 }
 
 html|button:enabled:hover,
-button:not([disabled="true"]):hover,
-colorpicker[type="button"]:not([disabled="true"]):hover,
-menulist:not([disabled="true"]):hover {
+xul|button:not([disabled="true"]):hover,
+xul|colorpicker[type="button"]:not([disabled="true"]):hover,
+xul|menulist:not([disabled="true"]):hover {
   background-color: #ebebeb;
 }
 
 html|button:enabled:hover:active,
-button:not([disabled="true"]):hover:active,
-colorpicker[type="button"]:not([disabled="true"]):hover:active,
-menulist[open="true"]:not([disabled="true"]) {
+xul|button:not([disabled="true"]):hover:active,
+xul|colorpicker[type="button"]:not([disabled="true"]):hover:active,
+xul|menulist[open="true"]:not([disabled="true"]) {
   background-color: #dadada;
 }
 
 html|button:disabled,
-button[disabled="true"],
-colorpicker[type="button"][disabled="true"],
-menulist[disabled="true"] {
+xul|button[disabled="true"],
+xul|colorpicker[type="button"][disabled="true"],
+xul|menulist[disabled="true"] {
   cursor: not-allowed;
   opacity: 0.5;
 }
 
-colorpicker[type="button"] {
+xul|colorpicker[type="button"] {
   padding: 6px;
   width: 50px;
 }
 
-button > .button-box,
-menulist > .menulist-label-box {
+xul|button > xul|*.button-box,
+xul|menulist > xul|*.menulist-label-box {
   padding-right: 10px !important;
   padding-left: 10px !important;
 }
 
-button[type="menu"] > .button-box > .button-menu-dropmarker {
+xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
   -moz-appearance: none;
   margin: 1px 0;
   -moz-margin-start: 10px;
   padding: 0;
   width: 10px;
   height: 16px;
   border: none;
   background-color: transparent;
   list-style-image: url("chrome://browser/skin/in-content/dropdown.png");
 }
 
-.help-button {
+xul|*.help-button {
   min-width: 30px;
   border-radius: 2px;
   border: 1px solid #c1c1c1;
   background-color: #ffcb00;
   background-image: none;
   box-shadow: none;
 }
 
-.help-button:not([disabled="true"]):hover {
+xul|*.help-button:not([disabled="true"]):hover {
   background-color: #f4c200;
   background-image: none;
 }
 
-.help-button:not([disabled="true"]):hover:active {
+xul|*.help-button:not([disabled="true"]):hover:active {
   background-color: #eaba00;
   background-image: none;
 }
 
-.close-icon > .button-box,
-.help-button > .button-box {
+xul|*.close-icon > xul|*.button-box,
+xul|*.help-button > xul|*.button-box {
   padding-top: 0;
   padding-bottom: 0;
   padding-right: 0 !important;
   padding-left: 0 !important;
 }
 
-.help-button > .button-box > .button-icon {
+xul|*.help-button > xul|*.button-box > xul|*.button-icon {
   width: 26px;
   height: 26px;
   background-image: url("chrome://browser/skin/in-content/help-glyph.png");
   background-position: center;
 }
 
 @media (min-resolution: 2dppx) {
-  .help-button > .button-box > .button-icon {
+  xul|*.help-button > xul|*.button-box > xul|*.button-icon {
     background-size: 26px 26px;
     background-image: url("chrome://browser/skin/in-content/help-glyph@2x.png");
   }
 }
 
-.help-button > .button-box > .button-text {
+xul|*.help-button > xul|*.button-box > xul|*.button-text {
   display: none;
 }
 
-.spinbuttons-button {
+xul|*.spinbuttons-button {
   -moz-margin-start: 10px !important;
   -moz-margin-end: 2px !important;
 }
 
-.spinbuttons-up {
+xul|*.spinbuttons-up {
   margin-top: 2px !important;
   border-radius: 1px 1px 0 0;
 }
 
-.spinbuttons-down  {
+xul|*.spinbuttons-down  {
   margin-bottom: 2px !important;
   border-radius: 0 0 1px 1px;
 }
 
-.spinbuttons-button > .button-box {
+xul|*.spinbuttons-button > xul|*.button-box {
   padding: 1px 5px 2px !important;
 }
 
-.spinbuttons-up > .button-box > .button-icon {
+xul|*.spinbuttons-up > xul|*.button-box > xul|*.button-icon {
   list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
 }
 
-.spinbuttons-up[disabled="true"] > .button-box > .button-icon {
+xul|*.spinbuttons-up[disabled="true"] > xul|*.button-box > xul|*.button-icon {
   list-style-image: url("chrome://global/skin/arrow/arrow-up-dis.gif");
 }
 
-.spinbuttons-down > .button-box > .button-icon {
+xul|*.spinbuttons-down > xul|*.button-box > xul|*.button-icon {
   list-style-image: url("chrome://global/skin/arrow/arrow-dn.gif");
 }
 
-.spinbuttons-down[disabled="true"] > .button-box > .button-icon {
+xul|*.spinbuttons-down[disabled="true"] > xul|*.button-box > xul|*.button-icon {
   list-style-image: url("chrome://global/skin/arrow/arrow-dn-dis.gif");
 }
 
-menulist:not([editable="true"]) > .menulist-dropmarker {
+xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
   -moz-appearance: none;
   -moz-margin-end: 10px;
   padding: 0;
   border: none;
   background-color: transparent;
   list-style-image: url("chrome://browser/skin/in-content/dropdown.png");
 }
 
-menulist[disabled="true"]:not([editable="true"]) > .menulist-dropmarker {
+xul|menulist[disabled="true"]:not([editable="true"]) > xul|*.menulist-dropmarker {
   list-style-image: url("chrome://browser/skin/in-content/dropdown-disabled.png")
 }
 
 @media (min-resolution: 2dppx) {
-  menulist:not([editable="true"]) > .menulist-dropmarker,
-  button[type="menu"] > .button-box > .button-menu-dropmarker {
+  xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker,
+  xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
     list-style-image: url("chrome://browser/skin/in-content/dropdown@2x.png");
   }
 
-  menulist[disabled="true"]:not([editable="true"]) > .menulist-dropmarker {
+  xul|menulist[disabled="true"]:not([editable="true"]) > xul|*.menulist-dropmarker {
     list-style-image: url("chrome://browser/skin/in-content/dropdown-disabled@2x.png")
   }
 
-  menulist:not([editable="true"]) > .menulist-dropmarker > .dropmarker-icon,
-  button[type="menu"] > .button-box > .button-menu-dropmarker > .dropmarker-icon {
+  xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker > xul|*.dropmarker-icon,
+  xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker > xul|*.dropmarker-icon {
     width: 10px;
     height: 16px;
   }
 }
 
-menulist > menupopup,
-button[type="menu"] > menupopup {
+xul|menulist > xul|menupopup,
+xul|button[type="menu"] > xul|menupopup {
   -moz-appearance: none;
   border: 1px solid rgba(23,50,77,0.4);
   border-radius: 2px;
   background-color: #fff;
 }
 
-menulist > menupopup menu,
-menulist > menupopup menuitem,
-button[type="menu"] > menupopup menu,
-button[type="menu"] > menupopup menuitem {
+xul|menulist > xul|menupopup xul|menu,
+xul|menulist > xul|menupopup xul|menuitem,
+xul|button[type="menu"] > xul|menupopup xul|menu,
+xul|button[type="menu"] > xul|menupopup xul|menuitem {
   -moz-appearance: none;
   font-size: 1.25rem;
   line-height: 22px;
   height: 40px;
   color: #333;
   -moz-padding-start: 10px;
   -moz-padding-end: 30px;
 }
 
-menulist > menupopup > menu[_moz-menuactive="true"],
-menulist > menupopup > menuitem[_moz-menuactive="true"],
-button[type="menu"] > menupopup > menu[_moz-menuactive="true"],
-button[type="menu"] > menupopup > menuitem[_moz-menuactive="true"] {
+xul|menulist > xul|menupopup > xul|menu[_moz-menuactive="true"],
+xul|menulist > xul|menupopup > xul|menuitem[_moz-menuactive="true"],
+xul|button[type="menu"] > xul|menupopup > xul|menu[_moz-menuactive="true"],
+xul|button[type="menu"] > xul|menupopup > xul|menuitem[_moz-menuactive="true"] {
   color: #333;
   background-color: transparent;
   background-image: linear-gradient(rgba(76,177,255,0.25), rgba(23,146,229,0.25));
 }
 
-menulist > menupopup > menu[selected="true"],
-menulist > menupopup > menuitem[selected="true"],
-button[type="menu"] > menupopup > menu[selected="true"],
-button[type="menu"] > menupopup > menuitem[selected="true"] {
+xul|menulist > xul|menupopup > xul|menu[selected="true"],
+xul|menulist > xul|menupopup > xul|menuitem[selected="true"],
+xul|button[type="menu"] > xul|menupopup > xul|menu[selected="true"],
+xul|button[type="menu"] > xul|menupopup > xul|menuitem[selected="true"] {
   color: #fff;
   background-image: linear-gradient(#4cb1ff, #1792e5);
 }
 
-menulist > menupopup menuseparator,
-button[type="menu"] > menupopup menuseparator {
+xul|menulist > xul|menupopup xul|menuseparator,
+xul|button[type="menu"] > xul|menupopup xul|menuseparator {
   -moz-appearance: none;
   margin-top: 2px;
   margin-bottom: 2px;
   padding: 0;
   border-top: 1px solid rgba(23,50,77,0.4);
   border-bottom: none;
 }
 
 /* textboxes */
 
-textbox {
+*|textbox {
   -moz-appearance: none;
   height: 30px;
   color: #333;
   line-height: 20px;
   text-shadow: 0 1px 1px #fefffe;
   padding-right: 10px;
   padding-left: 10px;
   border: 1px solid #c1c1c1;
   -moz-border-top-colors: none !important;
   -moz-border-right-colors: none !important;
   -moz-border-bottom-colors: none !important;
   -moz-border-left-colors: none !important;
   border-radius: 2px;
   background-color: #fff;
 }
 
-textbox[focused] {
+html|textbox:focus,
+xul|textbox[focused] {
   border-color: #0095dd;
 }
 
-textbox[disabled="true"] {
+html|textbox:disabled,
+xul|textbox[disabled="true"] {
   opacity: 0.5;
 }
 
 /* Links */
 
-.text-link,
-.inline-link,
+xul|*.text-link,
+xul|*.inline-link,
 html|a.inline-link {
   font-size: 1.25rem;
   line-height: 22px;
   color: #0095dd;
 }
 
-.text-link:hover,
-.inline-link:hover {
+xul|*.text-link:hover,
+xul|*.inline-link:hover {
   color: #4cb1ff;
   text-decoration: none;
 }
 
-.text-link:hover:active,
-.inline-link:hover:active {
+xul|*.text-link:hover:active,
+xul|*.inline-link:hover:active {
   color: #ff9500;
   text-decoration: none;
 }
 
 /* Checkboxes and radio buttons */
 
-checkbox {
+xul|checkbox {
   -moz-margin-start: 0;
 }
 
-.checkbox-check {
+xul|*.checkbox-check {
   -moz-appearance: none;
   width: 23px;
   height: 23px;
   border-radius: 2px;
   border: 1px solid #c1c1c1;
   -moz-margin-end: 10px;
   background-color: #f1f1f1;
   background-image: linear-gradient(#fff, rgba(255,255,255,0.8));
   background-position: center center;
   background-repeat: no-repeat;
   box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
 }
 
-checkbox:not([disabled="true"]):hover > .checkbox-check {
+xul|checkbox:not([disabled="true"]):hover > xul|*.checkbox-check {
   border-color: #0095dd;
 }
 
-.checkbox-check[checked] {
+xul|*.checkbox-check[checked] {
   background-image: url("chrome://browser/skin/in-content/check.png"),
                     /* !important needed to override toolkit !important rule */
                     linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
 }
 
-checkbox[disabled="true"] > .checkbox-check {
+xul|checkbox[disabled="true"] > xul|*.checkbox-check {
   opacity: 0.5;
 }
 
-.checkbox-label-box {
+xul|*.checkbox-label-box {
   -moz-margin-start: -1px; /* negative margin for the transparent border */
   -moz-padding-start: 0;
 }
 
 @media (min-resolution: 2dppx) {
-  .checkbox-check[checked] {
+  xul|*.checkbox-check[checked] {
     background-size: 12px 12px, auto;
     background-image: url("chrome://browser/skin/in-content/check@2x.png"),
                       linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
   }
 }
 
-.radio-check {
+xul|*.radio-check {
   -moz-appearance: none;
   width: 23px;
   height: 23px;
   border: 1px solid #c1c1c1;
   border-radius: 50%;
   -moz-margin-end: 10px;
   background-color: #f1f1f1;
   background-image: linear-gradient(#fff, rgba(255,255,255,0.80));
   box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
 }
 
-radio:not([disabled="true"]):hover > .radio-check {
+xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
   border-color: #0095dd;
 }
 
-.radio-check[selected] {
+xul|*.radio-check[selected] {
   background-image: radial-gradient(circle, rgb(23,146,229),
                     rgb(76,177,255) 5.5px, rgba(76,177,255,0.2) 6px,
                     transparent 6px),
                     linear-gradient(rgb(255,255,255), rgba(255,255,255,0.8));
 }
 
-radio[disabled="true"] > .radio-check {
+xul|radio[disabled="true"] > xul|*.radio-check {
   opacity: 0.5;
 }
 
-.radio-label-box {
+xul|*.radio-label-box {
   -moz-margin-start: -1px; /* negative margin for the transparent border */
   -moz-margin-end: 10px;
   -moz-padding-start: 0;
 }
 
 /* Category List */
 
-#categories {
+xul|*#categories {
   -moz-appearance: none;
   background-color: #424f5a;
   padding-top: 39px;
   margin: 0;
 }
 
-.category {
+xul|*.category {
   -moz-appearance: none;
   color: #c1c1c1;
   -moz-border-end-width: 0;
   -moz-padding-start: 15px;
   -moz-padding-end: 21px;
   min-height: 40px;
   transition: background-color 150ms;
 }
 
-.category:hover {
+xul|*.category:hover {
   background-color: #5e6972;
 }
 
-.category[selected] {
+xul|*.category[selected] {
   background-color: #343f48;
   color: #f2f2f2;
   box-shadow: inset 4px 0 0 0 #ff9500;
 }
 
-#categories[keyboard-navigation="true"]:-moz-focusring > .category[current] {
+xul|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
   border-top: 1px #ffffff dotted;
   border-bottom: 1px #ffffff dotted;
 }
 
-.category-name {
+*|*.category-name {
   line-height: 22px;
   font-size: 1.25rem;
   padding-bottom: 2px;
   -moz-padding-start: 9px;
   margin: 0;
 }
 
-.category-icon {
+*|*.category-icon {
   width: 24px;
   height: 24px;
 }
 
 /* header */
 
-.header {
+*|*.header {
   border-bottom: 1px solid #c8c8c8;
   margin-bottom: 15px;
   padding-bottom: 15px;
 }
 
-.header-name {
+*|*.header-name {
   font-size: 2.5rem;
   font-weight: normal;
   line-height: 40px;
   margin: 0;
 }
 
 /* File fields */
 
-filefield {
+xul|filefield {
   -moz-appearance: none;
   background-color: transparent;
   border: none;
   padding: 0;
 }
 
-.fileFieldContentBox {
+xul|*.fileFieldContentBox {
   background-color: transparent;
 }
 
-.fileFieldIcon {
+xul|*.fileFieldIcon {
   -moz-margin-start: 10px;
   -moz-margin-end: 0;
 }
 
-.fileFieldLabel {
+xul|*.fileFieldLabel {
   -moz-margin-start: -26px;
   -moz-padding-start: 36px;
 }
 
-textbox:-moz-locale-dir(rtl),
-.fileFieldLabel:-moz-locale-dir(rtl),
-textbox + button:-moz-locale-dir(ltr),
-filefield + button:-moz-locale-dir(ltr) {
+xul|textbox:-moz-locale-dir(rtl),
+xul|*.fileFieldLabel:-moz-locale-dir(rtl),
+xul|textbox + xul|button:-moz-locale-dir(ltr),
+xul|filefield + xul|button:-moz-locale-dir(ltr) {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
 
-textbox:-moz-locale-dir(ltr),
-.fileFieldLabel:-moz-locale-dir(ltr),
-textbox + button:-moz-locale-dir(rtl),
-filefield + button:-moz-locale-dir(rtl) {
+xul|textbox:-moz-locale-dir(ltr),
+xul|*.fileFieldLabel:-moz-locale-dir(ltr),
+xul|textbox + xul|button:-moz-locale-dir(rtl),
+xul|filefield + xul|button:-moz-locale-dir(rtl) {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
 }
 
-textbox + button,
-filefield + button {
+xul|textbox + xul|button,
+xul|filefield + xul|button {
   -moz-border-start: none;
 }
--- a/browser/themes/windows/in-content/common.css
+++ b/browser/themes/windows/in-content/common.css
@@ -1,35 +1,35 @@
 /* - 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/. */
 
 %include ../../shared/in-content/common.inc.css
 
-caption {
+xul|caption {
   background-color: transparent;
 }
 
-button,
-colorpicker[type="button"],
-menulist {
+xul|button,
+xul|colorpicker[type="button"],
+xul|menulist {
   margin: 2px 4px;
 }
 
-menulist:not([editable="true"]) > .menulist-dropmarker {
+xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
   margin-top: 1px;
   margin-bottom: 1px;
 }
 
-checkbox {
+xul|checkbox {
   -moz-padding-start: 0;
 }
 
-radio {
+xul|radio {
   -moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
   -moz-margin-start: 0;
   -moz-padding-start: 0;
 }
 
-.radio-icon,
-.checkbox-icon {
+xul|*.radio-icon,
+xul|*.checkbox-icon {
   -moz-margin-end: 0;
 }