Bug 941673 - DevTools themes - move toolbar and tab styles into shared CSS file;r=paul
authorBrian Grinstead <bgrinstead@mozilla.com>
Mon, 02 Dec 2013 08:57:58 -0600
changeset 174525 71fcb255a8cf1ed38f530a421d70bf989a824b24
parent 174524 4804c17a1fd513f36c4655e5d68251dce741586d
child 174526 4727303dd8a0c29681632ecb387c37ba4d758165
push id445
push userffxbld
push dateMon, 10 Mar 2014 22:05:19 +0000
treeherdermozilla-release@dc38b741b04e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspaul
bugs941673
milestone28.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 941673 - DevTools themes - move toolbar and tab styles into shared CSS file;r=paul
browser/devtools/framework/options-panel.css
browser/devtools/framework/toolbox-options.xul
browser/devtools/framework/toolbox.css
browser/devtools/framework/toolbox.xul
browser/devtools/jar.mn
browser/themes/linux/devtools/common.css
browser/themes/linux/devtools/toolbox.css
browser/themes/linux/jar.mn
browser/themes/osx/devtools/common.css
browser/themes/osx/devtools/toolbox.css
browser/themes/osx/jar.mn
browser/themes/shared/devtools/common.css
browser/themes/shared/devtools/common.inc.css
browser/themes/shared/devtools/dark-theme.css
browser/themes/shared/devtools/light-theme.css
browser/themes/shared/devtools/toolbars.inc.css
browser/themes/windows/devtools/common.css
browser/themes/windows/devtools/toolbox.css
browser/themes/windows/jar.mn
rename from browser/devtools/framework/toolbox.css
rename to browser/devtools/framework/options-panel.css
--- a/browser/devtools/framework/toolbox.css
+++ b/browser/devtools/framework/options-panel.css
@@ -1,23 +1,12 @@
 /* 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/. */
 
-.devtools-tab {
-  -moz-binding: url("chrome://global/content/bindings/general.xml#control-item");
-  -moz-box-align: center;
-}
-
-#toolbox-controls > toolbarbutton > .toolbarbutton-text,
-#toolbox-dock-buttons > toolbarbutton > .toolbarbutton-text,
-.command-button > .toolbarbutton-text {
-  display: none;
-}
-
 #options-panel-container {
   overflow: auto;
 }
 
 #options-panel {
   overflow-y: auto;
   display: block;
 }
@@ -25,8 +14,46 @@
 .options-vertical-pane {
   display: inline;
   float: left;
 }
 
 .options-vertical-pane > label {
   display: block;
 }
+
+.options-vertical-pane {
+  margin: 5px;
+  width: calc(50% - 30px);
+  min-width: 400px;
+  -moz-padding-start: 5px;
+}
+
+.options-vertical-pane > label {
+  padding: 2px 0;
+  font-size: 1.4rem;
+}
+
+.options-groupbox {
+  -moz-margin-start: 15px;
+  padding: 2px;
+}
+
+.options-groupbox > * {
+  padding: 2px;
+}
+
+.options-citation-label {
+  font-size: 1rem !important;
+  /* !important is required otherwise font-size will still be 1.4rem */
+  font-style: italic;
+  padding: 4px 0 0; /* To align it with the checkbox */
+}
+
+.options-citation-label + label {
+  padding: 3px 0 0 !important; /* To align it with the checkbox */
+  font-style: italic;
+}
+
+.hidden-labels-box:not(.visible) > label,
+.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
+  display: none;
+}
--- a/browser/devtools/framework/toolbox-options.xul
+++ b/browser/devtools/framework/toolbox-options.xul
@@ -2,18 +2,17 @@
 <!-- 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/. -->
 <!DOCTYPE window [
 <!ENTITY % toolboxDTD SYSTEM "chrome://browser/locale/devtools/toolbox.dtd" >
  %toolboxDTD;
 ]>
 <?xml-stylesheet href="chrome://browser/skin/" type="text/css"?>
-<?xml-stylesheet rel="stylesheet" href="chrome://browser/content/devtools/framework/toolbox.css" type="text/css"?>
-<?xml-stylesheet rel="stylesheet" href="chrome://browser/skin/devtools/toolbox.css" type="text/css"?>
+<?xml-stylesheet rel="stylesheet" href="chrome://browser/content/devtools/framework/options-panel.css" type="text/css"?>
 
 <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
 
   <script type="application/javascript;version=1.8"
           src="chrome://browser/content/devtools/theme-switching.js"/>
   <hbox id="options-panel-container" flex="1">
     <hbox id="options-panel" class="theme-body" flex="1">
       <vbox id="tools-box" class="options-vertical-pane" flex="1">
--- a/browser/devtools/framework/toolbox.xul
+++ b/browser/devtools/framework/toolbox.xul
@@ -2,19 +2,17 @@
 <!-- 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/. -->
 <!DOCTYPE window [
 <!ENTITY % toolboxDTD SYSTEM "chrome://browser/locale/devtools/toolbox.dtd" >
  %toolboxDTD;
 ]>
 <?xml-stylesheet href="chrome://browser/skin/" type="text/css"?>
-<?xml-stylesheet href="chrome://browser/content/devtools/framework/toolbox.css" type="text/css"?>
 <?xml-stylesheet href="chrome://browser/skin/devtools/common.css" type="text/css"?>
-<?xml-stylesheet href="chrome://browser/skin/devtools/toolbox.css" type="text/css"?>
 <?xul-overlay href="chrome://global/content/editMenuOverlay.xul"?>
 
 <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
 
   <script type="application/javascript;version=1.8"
           src="chrome://browser/content/devtools/theme-switching.js"/>
   <script type="application/javascript" src="chrome://global/content/globalOverlay.js"/>
 
--- a/browser/devtools/jar.mn
+++ b/browser/devtools/jar.mn
@@ -70,17 +70,17 @@ browser.jar:
     content/browser/devtools/profiler/cleopatra/images/treetwisty.svg  (profiler/cleopatra/images/treetwisty.svg)
     content/browser/devtools/commandline.css                           (commandline/commandline.css)
     content/browser/devtools/commandlineoutput.xhtml                   (commandline/commandlineoutput.xhtml)
     content/browser/devtools/commandlinetooltip.xhtml                  (commandline/commandlinetooltip.xhtml)
     content/browser/devtools/framework/toolbox-window.xul              (framework/toolbox-window.xul)
     content/browser/devtools/framework/toolbox-options.xul             (framework/toolbox-options.xul)
     content/browser/devtools/framework/toolbox-options.js              (framework/toolbox-options.js)
 *   content/browser/devtools/framework/toolbox.xul                     (framework/toolbox.xul)
-    content/browser/devtools/framework/toolbox.css                     (framework/toolbox.css)
+    content/browser/devtools/framework/options-panel.css               (framework/options-panel.css)
     content/browser/devtools/framework/toolbox-process-window.xul      (framework/toolbox-process-window.xul)
     content/browser/devtools/framework/toolbox-process-window.js       (framework/toolbox-process-window.js)
     content/browser/devtools/inspector/inspector.xul                   (inspector/inspector.xul)
     content/browser/devtools/inspector/inspector.css                   (inspector/inspector.css)
     content/browser/devtools/connect.xhtml                             (framework/connect/connect.xhtml)
     content/browser/devtools/connect.css                               (framework/connect/connect.css)
     content/browser/devtools/connect.js                                (framework/connect/connect.js)
     content/browser/devtools/app-manager/template.js                   (app-manager/content/template.js)
deleted file mode 100644
--- a/browser/themes/linux/devtools/common.css
+++ /dev/null
@@ -1,351 +0,0 @@
-/* vim:set ts=2 sw=2 sts=2 et: */
-/* 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/. */
-
-/* Font for code */
-
-:root {
-  font: message-box;
-}
-
-.devtools-monospace {
-  font-family: monospace;
-  font-size: 80%;
-}
-
-/* Toolbar and Toolbar items */
-
-.devtools-toolbar {
-  -moz-appearance: none;
-  padding: 4px 3px;
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-}
-
-.devtools-menulist,
-.devtools-toolbarbutton {
-  -moz-appearance: none;
-  -moz-box-align: center;
-  min-width: 78px;
-  min-height: 22px;
-  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
-  border: 1px solid hsla(210,8%,5%,.45);
-  border-radius: 3px;
-  background: linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
-  box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
-  margin: 0 3px;
-  color: inherit;
-}
-
-.devtools-toolbarbutton > .toolbarbutton-menubutton-button {
-  -moz-box-orient: horizontal;
-}
-
-.devtools-menulist:-moz-focusring,
-.devtools-toolbarbutton:-moz-focusring {
-  outline: 1px dotted hsla(210,30%,85%,0.7);
-  outline-offset: -4px;
-}
-
-.devtools-toolbarbutton:not([label]) {
-  min-width: 32px;
-}
-
-.devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
-  display: none;
-}
-
-.devtools-toolbarbutton:not([checked=true]):hover:active {
-  border-color: hsla(210,8%,5%,.6);
-  background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
-  box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-menulist[open=true],
-.devtools-toolbarbutton[open=true],
-.devtools-toolbarbutton[checked=true] {
-  border-color: hsla(210,8%,5%,.6) !important;
-  background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
-  box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[checked=true] {
-  color: hsl(208,100%,60%) !important;
-}
-
-.devtools-toolbarbutton[checked=true]:hover {
-  background-color: transparent !important;
-}
-
-.devtools-toolbarbutton[checked=true]:hover:active {
-  background-color: hsla(210,8%,5%,.2) !important;
-}
-
-.devtools-option-toolbarbutton {
-  -moz-appearance: none;
-  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-  background: none;
-  border: none;
-}
-
-.devtools-option-toolbarbutton[open=true] {
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-.devtools-menulist > .menulist-label-box {
-  text-align: center;
-}
-
-.devtools-menulist > .menulist-dropmarker {
-  -moz-appearance: none;
-  display: -moz-box;
-  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
-  -moz-box-align: center;
-  min-width: 16px;
-}
-
-.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
-  -moz-appearance: none;
-  color: inherit;
-  border-width: 0;
-  -moz-border-end: 1px solid hsla(210,8%,5%,.45);
-  box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
-  box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[type=menu-button] {
-  padding: 0 1px;
-  -moz-box-align: stretch;
-}
-
-.devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
-.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
-  -moz-appearance: none !important;
-  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
-  -moz-box-align: center;
-  padding: 0 3px;
-}
-
-/* Text input */
-
-.devtools-textinput,
-.devtools-searchinput {
-  -moz-appearance: none;
-  margin: 0 3px;
-  min-height: 22px;
-  border: 1px solid hsla(210,8%,5%,.6);
-  border-radius: 2px;
-  background-color: transparent;
-  background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
-  padding: 3px;
-  box-shadow: 0 1px 1px hsla(210,8%,5%,.3) inset,
-              0 0 0 1px hsla(210,16%,76%,.1) inset,
-              0 1px 0 hsla(210,16%,76%,.15);
-  color: inherit;
-}
-
-.devtools-searchinput {
-  padding-top: 0;
-  padding-bottom: 0;
-  -moz-padding-start: 18px;
-  -moz-padding-end: 12px;
-  background-image: url(magnifying-glass.png), linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
-  background-position: 4px center, top left, top left;
-  background-repeat: no-repeat;
-  font-size: inherit;
-}
-
-.devtools-searchinput:-moz-locale-dir(rtl) {
-  background-position: calc(100% - 4px) center, top left, top left;
-}
-
-.devtools-searchinput > .textbox-input-box > .textbox-search-icons {
-  display: none;
-}
-
-.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
-  color: hsl(208,10%,66%);
-  opacity: 1.0;
-}
-
-.devtools-no-search-result {
-  box-shadow: inset 0 0 0 1px hsla(0,68%,6%,.35);
-  border-color: hsl(10,70%,40%) hsl(10,75%,37%) hsl(10,80%,35%) !important;
-  background-image: url(magnifying-glass.png), linear-gradient(hsla(1,16%,76%,.45), hsla(1,16%,76%,.75));
-}
-
-/* Close button */
-
-.devtools-closebutton {
-  list-style-image: url("chrome://browser/skin/devtools/close.png");
-  -moz-appearance: none;
-  border: none;
-  margin: 0 4px;
-  min-width: 16px;
-  width: 16px;
-  opacity: 0.6;
-}
-
-.devtools-closebutton > .toolbarbutton-icon {
-  /* XXX Buttons have padding in widget/ that we don't want here but can't override with good CSS, so we must
-     use evil CSS to give the impression of smaller content */
-  margin: -4px;
-}
-
-.devtools-closebutton > .toolbarbutton-text {
-  display: none;
-}
-
-.devtools-closebutton:hover {
-  opacity: 0.8;
-}
-
-.devtools-closebutton:hover:active {
-  opacity: 1;
-}
-
-/* Splitters */
-
-.devtools-horizontal-splitter {
-  -moz-appearance: none;
-  border-top: 1px solid black;
-  border-bottom-width: 0;
-  min-height: 3px;
-  height: 3px;
-  margin-bottom: -3px;
-  position: relative;
-}
-
-.devtools-side-splitter {
-  -moz-appearance: none;
-  border: 0;
-  -moz-border-start: 1px solid black;
-  min-width: 0;
-  width: 3px;
-  background-color: transparent;
-  -moz-margin-end: -3px;
-  position: relative;
-  cursor: e-resize;
-}
-
-/* In-tools sidebar */
-
-.devtools-toolbox-side-iframe {
-  min-width: 465px;
-}
-
-.devtools-sidebar-tabs {
-  -moz-appearance: none;
-  margin: 0;
-}
-
-.devtools-sidebar-tabs > tabpanels {
-  -moz-appearance: none;
-  padding: 0;
-  border: 0;
-}
-
-.devtools-sidebar-tabs > tabs {
-  -moz-appearance: none;
-  position: static;
-  color: #b6babf;
-  margin-bottom: 0;
-  padding: 0;
-  background-color: #343c45;
-  border-width: 0 0 1px 0;
-  border-color: hsla(210,8%,5%,.6);
-  border-style: solid;
-  overflow: hidden;
-}
-
-.devtools-sidebar-tabs > tabs > .tabs-right,
-.devtools-sidebar-tabs > tabs > .tabs-left {
-  display: none;
-}
-
-.devtools-sidebar-tabs > tabs > tab {
-  -moz-appearance: none;
-  /* We want to match the height of a toolbar with a toolbarbutton
-   * First, we need to replicated the padding of toolbar (4px),
-   * then we need to take the border of the buttons into account (1px).
-   */
-  padding: 5px 3px;
-  -moz-padding-start: 6px;
-  margin: 0;
-  min-width: 78px;
-  /* toolbar's min-height is button min-height (25px) + padding (2 * 4px): 33px.
-   * -1px because the parent element (<tabs>) comes with a 1px bottom border.
-   */
-  min-height: 32px;
-  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
-  text-align: center;
-  color: inherit;
-  -moz-box-flex: 1;
-  border-width: 0;
-  background: transparent;
-  border-radius: 0;
-  position: static;
-  -moz-margin-start: -1px;
-}
-
-.devtools-sidebar-tabs > tabs > tab:first-of-type {
-  -moz-margin-start: -3px;
-}
-
-.devtools-sidebar-tabs > tabs > tab {
-  background-size: calc(100% - 2px) 100%, 1px 100%;
-  background-repeat: no-repeat;
-  background-position: 1px, 0;
-}
-
-.devtools-sidebar-tabs:-moz-locale-dir(rtl) > tabs > tab {
-  background-position: calc(100% - 1px), 100%;
-}
-
-%filter substitution
-%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
-%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
-
-.devtools-sidebar-tabs > tabs > tab {
-  background-image: linear-gradient(transparent, transparent), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab:hover {
-  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab:hover:active {
-  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab {
-  background-image: linear-gradient(transparent, transparent), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover {
-  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover:active {
-  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] {
-  color: #f5f7fa;
-  background-image: linear-gradient(#1d4f73, #1d4f73), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true]:hover {
-  background-image: linear-gradient(#274f64, #274f64), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true]:hover:active {
-  background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
-}
-
-%include ../../shared/devtools/common.inc.css
deleted file mode 100644
--- a/browser/themes/linux/devtools/toolbox.css
+++ /dev/null
@@ -1,288 +0,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/. */
-
-#toolbox-controls {
-  margin: 0 4px;
-}
-
-#toolbox-controls > toolbarbutton,
-#toolbox-dock-buttons > toolbarbutton {
-  -moz-appearance: none;
-  margin: 0 4px;
-  min-width: 16px;
-  width: 16px;
-}
-
-#toolbox-dock-bottom {
-  list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
-}
-
-#toolbox-dock-side {
-  list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
-}
-
-#toolbox-dock-window {
-  list-style-image: url("chrome://browser/skin/devtools/undock.png");
-}
-
-#toolbox-dock-window,
-#toolbox-dock-bottom,
-#toolbox-dock-side {
-  opacity: 0.6;
-}
-
-#toolbox-dock-window:hover,
-#toolbox-dock-bottom:hover,
-#toolbox-dock-side:hover {
-  opacity: 1;
-}
-
-#toolbox-controls-separator {
-  width: 3px;
-  background-image: linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0)),
-                    linear-gradient(hsla(206,37%,4%,0), hsla(206,37%,4%,.6), hsla(206,37%,4%,0)),
-                    linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0));
-  background-size: 1px 100%;
-  background-repeat: no-repeat;
-  background-position: 0, 1px, 2px;
-  -moz-margin-start: 8px;
-}
-
-/* Command buttons */
-
-.command-button {
-  -moz-appearance: none;
-  padding: 0 8px;
-  margin: 0;
-  width: 16px;
-}
-
-.command-button:hover {
-  background-color: hsla(206,37%,4%,.2);
-}
-.command-button:hover:active, .command-button[checked=true]:not(:hover) {
-  background-color: hsla(206,37%,4%,.4);
-}
-
-#command-button-paintflashing {
-  list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-paintflashing:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-#command-button-paintflashing:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-#command-button-paintflashing[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-responsive {
-  list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-responsive:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-#command-button-responsive:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-#command-button-responsive[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-tilt {
-  list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-tilt:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-#command-button-tilt:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-
-#command-button-tilt[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-scratchpad {
-  list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-
-#command-button-scratchpad:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-#command-button-scratchpad:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-
-/* Tabs */
-
-.devtools-tabbar {
-  -moz-appearance: none;
-  background-image: url("background-noise-toolbar.png"),
-                    linear-gradient(#303840, #2d3640);
-  border-color: #060a0d;
-  border-style: solid;
-  border-width: 1px 0;
-  box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
-              0 -1px 0 hsla(206,37%,4%,.1) inset;
-  min-height: 32px;
-  padding: 0;
-}
-
-#toolbox-tabs {
-  margin: 0;
-}
-
-.devtools-tab {
-  -moz-appearance: none;
-  min-width: 32px;
-  min-height: 32px;
-  max-width: 127px;
-  color: #b6babf;
-  margin: 0;
-  padding: 0;
-  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
-  background-size: 1px 100%;
-  background-repeat: no-repeat;
-  background-position: left, right;
-  border-right: 1px solid hsla(206,37%,4%,.45);
-  -moz-box-align: center;
-}
-
-.devtools-tab > image {
-  border: none;
-  -moz-margin-end: 0;
-  -moz-margin-start: 4px;
-  opacity: 0.6;
-  max-height: 16px;
-  width: 16px; /* Prevents collapse during theme switching */
-}
-
-#toolbox-tab-options > image {
-  margin: 0 8px;
-}
-
-.devtools-tab > label {
-  white-space: nowrap;
-}
-
-.devtools-tab:hover > image {
-  opacity: 0.8;
-}
-
-.devtools-tab:active > image,
-.devtools-tab[selected=true] > label {
-  opacity: 1;
-}
-
-.devtools-tab:hover {
-  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
-  background-size: 1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: left, right;
-  color: #ced3d9;
-}
-.devtools-tab:hover:active {
-  background-color: hsla(206,37%,4%,.2);
-  color: #f5f7fa;
-}
-
-.devtools-tab[selected=true] {
-  color: #f5f7fa;
-  background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
-                    radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
-                    linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
-  background-size: 100% 1px,
-                   100% 5px,
-                   1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: top right, top left, left, right;
-  box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
-}
-
-.devtools-tab:not([selected=true]).highlighted {
-  color: #f5f7fa;
-  background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
-                    radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
-  background-size: 100% 1px,
-                   100% 5px,
-                   1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: top right, top left, left, right;
-}
-
-.devtools-tab:not(.highlighted) > .highlighted-icon,
-.devtools-tab[selected=true] > .highlighted-icon,
-.devtools-tab:not([selected=true]).highlighted > .default-icon {
-  visibility: collapse;
-}
-
-.options-vertical-pane {
-  margin: 5px;
-  width: calc(50% - 30px);
-  min-width: 400px;
-  -moz-padding-start: 5px;
-}
-
-.options-vertical-pane > label {
-  padding: 2px 0;
-  font-size: 1.4rem;
-}
-
-.options-groupbox {
-  -moz-margin-start: 15px;
-  padding: 2px;
-}
-
-.options-groupbox > * {
-  padding: 2px;
-}
-
-.options-citation-label {
-  font-size: 1rem !important;
-  /* !important is required otherwise font-size will still be 1.4rem */
-  font-style: italic;
-  padding: 4px 0 0; /* To align it with the checkbox */
-}
-
-.options-citation-label + label {
-  padding: 3px 0 0 !important; /* To align it with the checkbox */
-  font-style: italic;
-}
-
-.hidden-labels-box:not(.visible) > label,
-.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
-  display: none;
-}
--- a/browser/themes/linux/jar.mn
+++ b/browser/themes/linux/jar.mn
@@ -141,19 +141,19 @@ browser.jar:
   skin/classic/browser/tabbrowser/tab-stroke-start.png      (tabbrowser/tab-stroke-start.png)
   skin/classic/browser/tabbrowser/tabDragIndicator.png      (tabbrowser/tabDragIndicator.png)
   skin/classic/browser/tabbrowser/tab-separator.png         (tabbrowser/tab-separator.png)
   skin/classic/browser/tabview/edit-light.png         (tabview/edit-light.png)
   skin/classic/browser/tabview/search.png             (tabview/search.png)
   skin/classic/browser/tabview/stack-expander.png     (tabview/stack-expander.png)
   skin/classic/browser/tabview/tabview.png            (tabview/tabview.png)
   skin/classic/browser/tabview/tabview.css            (tabview/tabview.css)
-* skin/classic/browser/devtools/common.css            (devtools/common.css)
-  skin/classic/browser/devtools/dark-theme.css        (../shared/devtools/dark-theme.css)
-  skin/classic/browser/devtools/light-theme.css       (../shared/devtools/light-theme.css)
+* skin/classic/browser/devtools/common.css            (../shared/devtools/common.css)
+* skin/classic/browser/devtools/dark-theme.css        (../shared/devtools/dark-theme.css)
+* skin/classic/browser/devtools/light-theme.css       (../shared/devtools/light-theme.css)
   skin/classic/browser/devtools/controls.png          (../shared/devtools/controls.png)
 * skin/classic/browser/devtools/widgets.css           (devtools/widgets.css)
   skin/classic/browser/devtools/commandline-icon.png  (devtools/commandline-icon.png)
   skin/classic/browser/devtools/command-paintflashing.png  (devtools/command-paintflashing.png)
   skin/classic/browser/devtools/command-responsivemode.png (devtools/command-responsivemode.png)
   skin/classic/browser/devtools/command-scratchpad.png (devtools/command-scratchpad.png)
   skin/classic/browser/devtools/command-tilt.png      (devtools/command-tilt.png)
   skin/classic/browser/devtools/alerticon-warning.png (devtools/alerticon-warning.png)
@@ -224,17 +224,16 @@ browser.jar:
   skin/classic/browser/devtools/responsive-background.png (devtools/responsive-background.png)
   skin/classic/browser/devtools/toggle-tools.png          (devtools/toggle-tools.png)
   skin/classic/browser/devtools/dock-bottom.png           (devtools/dock-bottom.png)
   skin/classic/browser/devtools/dock-side.png             (devtools/dock-side.png)
   skin/classic/browser/devtools/floating-scrollbars.css   (devtools/floating-scrollbars.css)
   skin/classic/browser/devtools/floating-scrollbars-light.css (devtools/floating-scrollbars-light.css)
   skin/classic/browser/devtools/inspector.css             (devtools/inspector.css)
   skin/classic/browser/devtools/profiler-stopwatch.png    (devtools/profiler-stopwatch.png)
-  skin/classic/browser/devtools/toolbox.css               (devtools/toolbox.css)
   skin/classic/browser/devtools/tool-options.png          (devtools/tool-options.png)
   skin/classic/browser/devtools/tool-webconsole.png       (devtools/tool-webconsole.png)
   skin/classic/browser/devtools/tool-debugger.png         (devtools/tool-debugger.png)
   skin/classic/browser/devtools/tool-debugger-paused.png  (devtools/tool-debugger-paused.png)
   skin/classic/browser/devtools/tool-inspector.png        (devtools/tool-inspector.png)
   skin/classic/browser/devtools/tool-styleeditor.png      (devtools/tool-styleeditor.png)
   skin/classic/browser/devtools/tool-profiler.png         (devtools/tool-profiler.png)
   skin/classic/browser/devtools/tool-network.png          (devtools/tool-network.png)
deleted file mode 100644
--- a/browser/themes/osx/devtools/common.css
+++ /dev/null
@@ -1,354 +0,0 @@
-/* vim:set ts=2 sw=2 sts=2 et: */
-/* 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.inc
-
-/* Font for code */
-
-:root {
-  font: message-box;
-}
-
-.devtools-monospace {
-  font-family: Menlo, monospace;
-}
-
-/* Toolbar and Toolbar items */
-
-.devtools-toolbar {
-  -moz-appearance: none;
-  padding: 4px 3px;
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-}
-
-.devtools-menulist,
-.devtools-toolbarbutton {
-  -moz-appearance: none;
-  -moz-box-align: center;
-  min-width: 78px;
-  min-height: 22px;
-  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
-  border: 1px solid hsla(210,8%,5%,.45);
-  border-radius: @toolbarbuttonCornerRadius@;
-  background: linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
-  box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
-  color: inherit;
-}
-
-.devtools-toolbarbutton > .toolbarbutton-menubutton-button {
-  -moz-box-orient: horizontal;
-}
-
-.devtools-menulist {
-  margin: 0 2px;
-}
-
-.devtools-menulist:-moz-focusring,
-.devtools-toolbarbutton:-moz-focusring {
-  outline: 1px dotted hsla(210,30%,85%,0.7);
-  outline-offset: -4px;
-}
-
-.devtools-toolbarbutton > .toolbarbutton-text {
-  margin: 1px 6px;
-}
-
-.devtools-toolbarbutton:not([label]) {
-  min-width: 32px;
-}
-
-.devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
-  display: none;
-}
-
-.devtools-toolbarbutton:not([checked=true]):hover:active {
-  border-color: hsla(210,8%,5%,.6);
-  background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
-  box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-menulist[open=true],
-.devtools-toolbarbutton[open=true],
-.devtools-toolbarbutton[checked=true] {
-  border-color: hsla(210,8%,5%,.6);
-  background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
-  box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[checked=true] {
-  color: hsl(208,100%,60%) !important;
-}
-
-.devtools-toolbarbutton[checked=true]:hover:active {
-  background-color: hsla(210,8%,5%,.2);
-}
-
-.devtools-option-toolbarbutton {
-  -moz-appearance: none;
-  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-  background: none;
-  border: none;
-}
-
-.devtools-option-toolbarbutton[open=true] {
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-.devtools-menulist > .menulist-label-box {
-  text-align: center;
-}
-
-.devtools-menulist > .menulist-dropmarker {
-  -moz-appearance: none;
-  background-color: transparent;
-  display: -moz-box;
-  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
-  border-width: 0;
-  min-width: 18px;
-}
-
-.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
-  -moz-appearance: none;
-  border-width: 0;
-  -moz-border-end: 1px solid hsla(210,8%,5%,.45);
-  box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);
-  padding: 0 1px;
-}
-
-.devtools-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
-  box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[type=menu-button] {
-  padding: 0 1px;
-  -moz-box-align: stretch;
-}
-
-.devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
-.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
-  -moz-appearance: none !important;
-  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
-  border: 0;
-}
-
-/* Text input */
-
-.devtools-textinput,
-.devtools-searchinput {
-  -moz-appearance: none;
-  margin: 0 3px;
-  min-height: 22px;
-  background-color: transparent;
-  border: 1px solid hsla(210,8%,5%,.6);
-  border-radius: 20px;
-  background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
-  padding: 3px 8px;
-  box-shadow: 0 1px 1px hsla(210,8%,5%,.3) inset,
-              0 0 0 1px hsla(210,16%,76%,.1) inset,
-              0 1px 0 hsla(210,16%,76%,.15);
-  color: inherit;
-}
-
-.devtools-searchinput {
-  background-image: url(magnifying-glass.png), linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
-  background-repeat: no-repeat;
-  background-position: 4px center, top left, top left;
-  padding-top: 0;
-  padding-bottom: 0;
-  -moz-padding-start: 18px;
-  -moz-padding-end: 12px;
-  font-size: inherit;
-}
-
-.devtools-searchinput:-moz-locale-dir(rtl) {
-  background-position: calc(100% - 4px) center, top left, top left;
-}
-
-.devtools-searchinput > .textbox-input-box > .textbox-search-icons {
-  display: none;
-}
-
-.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
-  opacity: 1.0;
-  color: hsl(208,10%,66%);
-}
-
-.devtools-no-search-result {
-  box-shadow: inset 0 0 0 1px hsla(0,68%,6%,.35);
-  border-color: hsl(10,70%,40%) hsl(10,75%,37%) hsl(10,80%,35%) !important;
-  background-image: url(magnifying-glass.png), linear-gradient(hsla(1,16%,76%,.45), hsla(1,16%,76%,.75));
-}
-
-/* Close button */
-
-.devtools-closebutton {
-  list-style-image: url("chrome://browser/skin/devtools/close.png");
-  -moz-appearance: none;
-  border: none;
-  margin: 0 4px;
-  min-width: 16px;
-  width: 16px;
-  opacity: 0.6;
-}
-
-.devtools-closebutton > .toolbarbutton-text {
-  display: none;
-}
-
-.devtools-closebutton:hover {
-  opacity: 0.8;
-}
-
-.devtools-closebutton:active {
-  opacity: 1;
-}
-
-/* Splitters */
-
-.devtools-horizontal-splitter {
-  -moz-appearance: none;
-  background-image: none;
-  border-top: 1px solid black;
-  border-bottom-width: 0;
-  min-height: 3px;
-  height: 3px;
-  margin-bottom: -3px;
-  position: relative;
-}
-
-.devtools-side-splitter {
-  -moz-appearance: none;
-  background-image: none;
-  border: 0;
-  -moz-border-start: 1px solid black;
-  min-width: 0;
-  width: 3px;
-  -moz-margin-end: -3px;
-  position: relative;
-  cursor: e-resize;
-}
-
-/* In-tools sidebar */
-
-.devtools-toolbox-side-iframe {
-  min-width: 465px;
-}
-
-.devtools-sidebar-tabs {
-  -moz-appearance: none;
-  margin: 0;
-}
-
-.devtools-sidebar-tabs > tabpanels {
-  padding: 0;
-}
-
-.devtools-sidebar-tabs > tabs {
-  -moz-appearance: none;
-  font: inherit;
-  position: static;
-  color: #b6babf;
-  margin-bottom: 0;
-  padding: 0;
-  background-color: #343c45;
-  border-width: 0 0 1px 0;
-  border-color: hsla(210,8%,5%,.6);
-  border-style: solid;
-  overflow: hidden;
-}
-
-.devtools-sidebar-tabs > tabs > .tabs-right,
-.devtools-sidebar-tabs > tabs > .tabs-left {
-  display: none;
-}
-
-.devtools-sidebar-tabs > tabs > tab {
-  -moz-appearance: none;
-  /* We want to match the height of a toolbar with a toolbarbutton
-   * First, we need to replicated the padding of toolbar (4px),
-   * then we need to take the border of the buttons into account (1px).
-   */
-  padding: 5px 3px !important;
-  -moz-padding-start: 6px;
-  padding: 0;
-  min-width: 78px;
-  /* toolbar's min-height is button min-height (25px) + padding (2 * 4px): 33px.
-   * -1px because the parent element (<tabs>) comes with a 1px bottom border.
-   */
-  min-height: 32px;
-  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
-  text-align: center;
-  color: inherit;
-  -moz-box-flex: 1;
-  border-width: 0;
-  position: static;
-  -moz-margin-start: -1px;
-}
-
-.devtools-sidebar-tabs > tabs > tab:-moz-focusring {
-  position: static;
-}
-
-.devtools-sidebar-tabs > tabs > tab:first-of-type {
-  -moz-margin-start: -3px;
-}
-
-.devtools-sidebar-tabs > tabs > tab {
-  background-size: calc(100% - 2px) 100%, 1px 100%;
-  background-repeat: no-repeat;
-  background-position: 1px, 0;
-}
-
-.devtools-sidebar-tabs:-moz-locale-dir(rtl) > tabs > tab {
-  background-position: calc(100% - 1px), 100%;
-}
-
-.devtools-sidebar-tabs > tabs > tab:last-of-type {
-  -moz-border-end-width: 0;
-}
-
-%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
-%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
-
-.devtools-sidebar-tabs > tabs > tab {
-  background-image: linear-gradient(transparent, transparent), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab:hover {
-  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab:hover:active {
-  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab {
-  background-image: linear-gradient(transparent, transparent), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover {
-  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover:active {
-  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] {
-  color: #f5f7fa;
-  background-image: linear-gradient(#1d4f73, #1d4f73), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true]:hover {
-  background-image: linear-gradient(#274f64, #274f64), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true]:hover:active {
-  background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
-}
-
-%include ../../shared/devtools/common.inc.css
deleted file mode 100644
--- a/browser/themes/osx/devtools/toolbox.css
+++ /dev/null
@@ -1,274 +0,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/. */
-
-#toolbox-controls {
-  margin: 0 4px;
-}
-
-#toolbox-controls > toolbarbutton,
-#toolbox-dock-buttons > toolbarbutton {
-  margin: 0 4px;
-  min-width: 16px;
-  width: 16px;
-}
-
-#toolbox-dock-bottom {
-  list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
-}
-
-#toolbox-dock-side {
-  list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
-}
-
-#toolbox-dock-window {
-  list-style-image: url("chrome://browser/skin/devtools/undock.png");
-}
-
-#toolbox-dock-window,
-#toolbox-dock-bottom,
-#toolbox-dock-side {
-  opacity: 0.6;
-}
-
-#toolbox-dock-window:hover,
-#toolbox-dock-bottom:hover,
-#toolbox-dock-side:hover {
-  opacity: 1;
-}
-
-/* Command buttons */
-
-.command-button {
-  padding: 0 8px;
-  margin: 0;
-  border-width: 0;
-  width: 16px;
-}
-
-.command-button:hover {
-  background-color: hsla(206,37%,4%,.2);
-}
-.command-button:hover:active, .command-button[checked=true]:not(:hover) {
-  background-color: hsla(206,37%,4%,.4);
-}
-
-#command-button-paintflashing {
-  list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-paintflashing:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-#command-button-paintflashing:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-#command-button-paintflashing[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-responsive {
-  list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-responsive:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-#command-button-responsive:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-#command-button-responsive[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-tilt {
-  list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-tilt:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-#command-button-tilt:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-
-#command-button-tilt[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-scratchpad {
-  list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-
-#command-button-scratchpad:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-#command-button-scratchpad:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-
-/* Tabs */
-
-.devtools-tabbar {
-  -moz-appearance: none;
-  background-image: url("background-noise-toolbar.png"),
-                    linear-gradient(#303840, #2d3640);
-  border-color: #060a0d;
-  border-style: solid;
-  border-width: 1px 0;
-  box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
-              0 -1px 0 hsla(206,37%,4%,.1) inset;
-  min-height: 32px;
-  padding: 0;
-}
-
-#toolbox-tabs {
-  margin: 0;
-  border-left: 1px solid hsla(206,37%,4%,.45);
-}
-
-.devtools-tab {
-  -moz-appearance: none;
-  min-width: 32px;
-  min-height: 32px;
-  max-width: 110px;
-  color: #b6babf;
-  margin: 0;
-  padding: 0;
-  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
-  background-size: 1px 100%;
-  background-repeat: no-repeat;
-  background-position: left, right;
-  border-right: 1px solid hsla(206,37%,4%,.45);
-}
-
-.devtools-tab > image {
-  -moz-margin-end: 0;
-  -moz-margin-start: 4px;
-  opacity: 0.6;
-  width: 16px; /* Prevents collapse during theme switching */
-}
-
-#toolbox-tab-options > image {
-  margin: 0 8px;
-}
-
-.devtools-tab > label {
-  white-space: nowrap;
-}
-
-.devtools-tab:hover > image {
-  opacity: 0.8;
-}
-
-.devtools-tab:active > image,
-.devtools-tab[selected=true] > image {
-  opacity: 1;
-}
-
-.devtools-tab:hover {
-  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
-  background-size: 1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: left, right;
-  color: #ced3d9;
-}
-.devtools-tab:hover:active {
-  background-color: hsla(206,37%,4%,.2);
-  color: #f5f7fa;
-}
-
-.devtools-tab[selected=true] {
-  color: #f5f7fa;
-  background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
-                    radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
-                    linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
-  background-size: 100% 1px,
-                   100% 5px,
-                   1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: top right, top left, left, right;
-  box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
-}
-
-.devtools-tab:not([selected=true]).highlighted {
-  color: #f5f7fa;
-  background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
-                    radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
-  background-size: 100% 1px,
-                   100% 5px,
-                   1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: top right, top left, left, right;
-}
-
-.devtools-tab:not(.highlighted) > .highlighted-icon,
-.devtools-tab[selected=true] > .highlighted-icon,
-.devtools-tab:not([selected=true]).highlighted > .default-icon {
-  visibility: collapse;
-}
-
-.options-vertical-pane {
-  margin: 5px;
-  width: calc(50% - 30px);
-  min-width: 400px;
-  -moz-padding-start: 5px;
-}
-
-.options-vertical-pane > label {
-  padding: 2px 0;
-  font-size: 1.4rem;
-}
-
-.options-groupbox {
-  -moz-margin-start: 15px;
-  padding: 2px;
-}
-
-.options-groupbox > * {
-  padding: 2px;
-}
-
-.options-citation-label {
-  font-size: 1rem !important;
-  /* !important is required otherwise font-size will still be 1.4rem */
-  font-style: italic;
-  padding: 4px 0 0; /* To align it with the checkbox */
-}
-
-.options-citation-label + label {
-  padding: 3px 0 0 !important; /* To align it with the checkbox */
-  font-style: italic;
-}
-
-.hidden-labels-box:not(.visible) > label,
-.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
-  display: none;
-}
--- a/browser/themes/osx/jar.mn
+++ b/browser/themes/osx/jar.mn
@@ -243,19 +243,19 @@ browser.jar:
   skin/classic/browser/tabbrowser/tab-separator.png                      (tabbrowser/tab-separator.png)
   skin/classic/browser/tabbrowser/tab-separator@2x.png                   (tabbrowser/tab-separator@2x.png)
   skin/classic/browser/tabview/close.png                    (tabview/close.png)
   skin/classic/browser/tabview/edit-light.png               (tabview/edit-light.png)
   skin/classic/browser/tabview/search.png                   (tabview/search.png)
   skin/classic/browser/tabview/stack-expander.png           (tabview/stack-expander.png)
   skin/classic/browser/tabview/tabview.png                  (tabview/tabview.png)
   skin/classic/browser/tabview/tabview.css                  (tabview/tabview.css)
-* skin/classic/browser/devtools/common.css                  (devtools/common.css)
-  skin/classic/browser/devtools/dark-theme.css              (../shared/devtools/dark-theme.css)
-  skin/classic/browser/devtools/light-theme.css             (../shared/devtools/light-theme.css)
+* skin/classic/browser/devtools/common.css                  (../shared/devtools/common.css)
+* skin/classic/browser/devtools/dark-theme.css              (../shared/devtools/dark-theme.css)
+* skin/classic/browser/devtools/light-theme.css             (../shared/devtools/light-theme.css)
   skin/classic/browser/devtools/controls.png                (../shared/devtools/controls.png)
 * skin/classic/browser/devtools/widgets.css                 (devtools/widgets.css)
   skin/classic/browser/devtools/commandline-icon.png        (devtools/commandline-icon.png)
   skin/classic/browser/devtools/command-paintflashing.png   (devtools/command-paintflashing.png)
   skin/classic/browser/devtools/command-responsivemode.png  (devtools/command-responsivemode.png)
   skin/classic/browser/devtools/command-scratchpad.png      (devtools/command-scratchpad.png)
   skin/classic/browser/devtools/command-tilt.png            (devtools/command-tilt.png)
   skin/classic/browser/devtools/alerticon-warning.png       (devtools/alerticon-warning.png)
@@ -326,17 +326,16 @@ browser.jar:
   skin/classic/browser/devtools/responsive-vertical-resizer.png (devtools/responsive-vertical-resizer.png)
   skin/classic/browser/devtools/responsive-horizontal-resizer.png (devtools/responsive-horizontal-resizer.png)
   skin/classic/browser/devtools/responsive-background.png   (devtools/responsive-background.png)
   skin/classic/browser/devtools/toggle-tools.png            (devtools/toggle-tools.png)
   skin/classic/browser/devtools/dock-bottom.png             (devtools/dock-bottom.png)
   skin/classic/browser/devtools/dock-side.png               (devtools/dock-side.png)
 * skin/classic/browser/devtools/inspector.css               (devtools/inspector.css)
   skin/classic/browser/devtools/profiler-stopwatch.png      (devtools/profiler-stopwatch.png)
-  skin/classic/browser/devtools/toolbox.css                 (devtools/toolbox.css)
   skin/classic/browser/devtools/tool-options.png            (devtools/tool-options.png)
   skin/classic/browser/devtools/tool-webconsole.png         (devtools/tool-webconsole.png)
   skin/classic/browser/devtools/tool-debugger.png           (devtools/tool-debugger.png)
   skin/classic/browser/devtools/tool-debugger-paused.png    (devtools/tool-debugger-paused.png)
   skin/classic/browser/devtools/tool-inspector.png          (devtools/tool-inspector.png)
   skin/classic/browser/devtools/tool-styleeditor.png        (devtools/tool-styleeditor.png)
   skin/classic/browser/devtools/tool-profiler.png           (devtools/tool-profiler.png)
   skin/classic/browser/devtools/tool-network.png            (devtools/tool-network.png)
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/devtools/common.css
@@ -0,0 +1,219 @@
+%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
+
+:root {
+  font: message-box;
+}
+
+.devtools-monospace {
+%ifdef XP_MACOSX
+  font-family: Menlo, monospace;
+%endif
+%ifdef XP_LINUX
+  font-family: monospace;
+  font-size: 80%;
+%endif
+%ifdef XP_WIN
+  font-family: Consolas, monospace;
+%endif
+}
+
+/* Splitters */
+.devtools-horizontal-splitter {
+  -moz-appearance: none;
+  border-top: 1px solid black;
+  border-bottom-width: 0;
+  min-height: 3px;
+  height: 3px;
+  margin-bottom: -3px;
+  position: relative;
+}
+
+.devtools-side-splitter {
+  -moz-appearance: none;
+  border: 0;
+  -moz-border-start: 1px solid black;
+  min-width: 0;
+  width: 3px;
+  background-color: transparent;
+  -moz-margin-end: -3px;
+  position: relative;
+  cursor: e-resize;
+}
+
+.devtools-toolbox-side-iframe {
+  min-width: 465px;
+}
+
+/* Autocomplete Popup */
+/* Dark and light theme */
+
+.devtools-autocomplete-popup {
+  -moz-appearance: none !important;
+  border: 1px solid hsl(210,11%,10%);
+  box-shadow: 0 1px 0 hsla(209,29%,72%,.25) inset;
+  background-color: transparent;
+  background-image: linear-gradient(to bottom, hsla(209,18%,18%,0.9), hsl(210,11%,16%));
+  border-radius: 3px;
+  overflow-x: hidden;
+%ifdef XP_LINUX
+  max-height: 32rem;
+%else
+  max-height: 40rem;
+%endif
+}
+
+.devtools-autocomplete-listbox {
+  -moz-appearance: none !important;
+  background-color: transparent;
+  border-width: 0px !important;
+}
+
+.devtools-autocomplete-listbox > richlistitem,
+.devtools-autocomplete-listbox > richlistitem[selected] {
+  width: 100%;
+  background-color: transparent;
+  border-radius: 4px;
+}
+
+.devtools-autocomplete-listbox.dark-theme > richlistitem[selected],
+.devtools-autocomplete-listbox.dark-theme > richlistitem:hover {
+  background-color: rgba(0,0,0,0.5);
+}
+
+.devtools-autocomplete-listbox.dark-theme > richlistitem[selected] > .autocomplete-value,
+.devtools-autocomplete-listbox:focus.dark-theme > richlistitem[selected] > .initial-value {
+  color: hsl(208,100%,60%);
+}
+
+.devtools-autocomplete-listbox.dark-theme > richlistitem[selected] > label {
+  color: #eee;
+}
+
+.devtools-autocomplete-listbox.dark-theme > richlistitem > label {
+  color: #ccc;
+}
+
+.devtools-autocomplete-listbox > richlistitem > .initial-value,
+.devtools-autocomplete-listbox > richlistitem > .autocomplete-value {
+  margin: 0;
+  padding: 1px 0;
+}
+
+.devtools-autocomplete-listbox > richlistitem > .autocomplete-count {
+  text-align: right;
+}
+
+/* Rest of the light theme */
+
+.devtools-autocomplete-popup.light-theme {
+  border: 1px solid hsl(210,24%,90%);
+  box-shadow: 0 1px 0 hsla(209,29%,90%,.25) inset;
+  background-image: linear-gradient(to bottom, hsla(209,18%,100%,0.9), hsl(210,24%,95%));
+}
+
+.devtools-autocomplete-listbox.light-theme > richlistitem[selected],
+.devtools-autocomplete-listbox.light-theme > richlistitem:hover {
+  background-color: rgba(128,128,128,0.3);
+}
+
+.devtools-autocomplete-listbox.light-theme > richlistitem[selected] > .autocomplete-value,
+.devtools-autocomplete-listbox:focus.light-theme > richlistitem[selected] > .initial-value {
+  color: #222;
+}
+
+.devtools-autocomplete-listbox.light-theme > richlistitem > label {
+  color: #666;
+}
+
+/* Responsive container */
+
+.devtools-responsive-container {
+  -moz-box-orient: horizontal;
+}
+
+@media (max-width: 700px) {
+  .devtools-responsive-container {
+    -moz-box-orient: vertical;
+  }
+
+  .devtools-responsive-container > .devtools-side-splitter {
+    border: 0;
+    margin: 0;
+    border-top: 1px solid black;
+    min-height: 3px;
+    height: 3px;
+    margin-bottom: -3px;
+    /* In some edge case the cursor is not changed to n-resize */
+    cursor: n-resize;
+  }
+
+  .devtools-responsive-container > .devtools-sidebar-tabs {
+    min-height: 35vh;
+    max-height: 75vh;
+  }
+}
+
+/* Tooltip widget (see browser/devtools/shared/widgets/Tooltip.js) */
+
+.devtools-tooltip .panel-arrowcontent {
+  padding: 4px;
+}
+
+.devtools-tooltip .panel-arrowcontainer {
+  /* Reseting the transition used when panels are shown */
+  transition: none;
+  /* Panels slide up/down/left/right when they appear using a transform.
+  Since we want to remove the transition, we don't need to transform anymore
+  plus it can interfeer by causing mouseleave events on the underlying nodes */
+  transform: none;
+}
+
+.devtools-tooltip[clamped-dimensions] {
+  max-height: 400px;
+  max-width: 400px;
+}
+.devtools-tooltip[clamped-dimensions] .panel-arrowcontent {
+  overflow: hidden;
+}
+
+/* Tooltip: Simple Text */
+
+.devtools-tooltip-simple-text {
+  max-width: 400px;
+  margin: 0 -4px; /* Compensate for the .panel-arrowcontent padding. */
+  padding: 8px 12px;
+  white-space: pre-wrap;
+}
+
+.devtools-tooltip-simple-text:first-child {
+  margin-top: -4px;
+}
+
+.devtools-tooltip-simple-text:last-child {
+  margin-bottom: -4px;
+}
+
+/* Tooltip: Variables View */
+
+.devtools-tooltip-variables-view-box {
+  margin: -4px; /* Compensate for the .panel-arrowcontent padding. */
+}
+
+/* Tooltip: Tiles */
+
+.devtools-tooltip-tiles {
+  background-color: #eee;
+  background-image: linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc),
+    linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc);
+  background-size: 20px 20px;
+  background-position: 0 0, 10px 10px;
+}
+
+.devtools-tooltip-iframe {
+  border: none;
+  background: transparent;
+}
deleted file mode 100644
--- a/browser/themes/shared/devtools/common.inc.css
+++ /dev/null
@@ -1,175 +0,0 @@
-%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
-
-/* Autocomplete Popup */
-/* Dark and light theme */
-
-.devtools-autocomplete-popup {
-  -moz-appearance: none !important;
-  border: 1px solid hsl(210,11%,10%);
-  box-shadow: 0 1px 0 hsla(209,29%,72%,.25) inset;
-  background-color: transparent;
-  background-image: linear-gradient(to bottom, hsla(209,18%,18%,0.9), hsl(210,11%,16%));
-  border-radius: 3px;
-  overflow-x: hidden;
-%ifdef XP_LINUX
-  max-height: 32rem;
-%else
-  max-height: 40rem;
-%endif
-}
-
-.devtools-autocomplete-listbox {
-  -moz-appearance: none !important;
-  background-color: transparent;
-  border-width: 0px !important;
-}
-
-.devtools-autocomplete-listbox > richlistitem,
-.devtools-autocomplete-listbox > richlistitem[selected] {
-  width: 100%;
-  background-color: transparent;
-  border-radius: 4px;
-}
-
-.devtools-autocomplete-listbox.dark-theme > richlistitem[selected],
-.devtools-autocomplete-listbox.dark-theme > richlistitem:hover {
-  background-color: rgba(0,0,0,0.5);
-}
-
-.devtools-autocomplete-listbox.dark-theme > richlistitem[selected] > .autocomplete-value,
-.devtools-autocomplete-listbox:focus.dark-theme > richlistitem[selected] > .initial-value {
-  color: hsl(208,100%,60%);
-}
-
-.devtools-autocomplete-listbox.dark-theme > richlistitem[selected] > label {
-  color: #eee;
-}
-
-.devtools-autocomplete-listbox.dark-theme > richlistitem > label {
-  color: #ccc;
-}
-
-.devtools-autocomplete-listbox > richlistitem > .initial-value,
-.devtools-autocomplete-listbox > richlistitem > .autocomplete-value {
-  margin: 0;
-  padding: 1px 0;
-}
-
-.devtools-autocomplete-listbox > richlistitem > .autocomplete-count {
-  text-align: right;
-}
-
-/* Rest of the light theme */
-
-.devtools-autocomplete-popup.light-theme {
-  border: 1px solid hsl(210,24%,90%);
-  box-shadow: 0 1px 0 hsla(209,29%,90%,.25) inset;
-  background-image: linear-gradient(to bottom, hsla(209,18%,100%,0.9), hsl(210,24%,95%));
-}
-
-.devtools-autocomplete-listbox.light-theme > richlistitem[selected],
-.devtools-autocomplete-listbox.light-theme > richlistitem:hover {
-  background-color: rgba(128,128,128,0.3);
-}
-
-.devtools-autocomplete-listbox.light-theme > richlistitem[selected] > .autocomplete-value,
-.devtools-autocomplete-listbox:focus.light-theme > richlistitem[selected] > .initial-value {
-  color: #222;
-}
-
-.devtools-autocomplete-listbox.light-theme > richlistitem > label {
-  color: #666;
-}
-
-/* Responsive container */
-
-.devtools-responsive-container {
-  -moz-box-orient: horizontal;
-}
-
-@media (max-width: 700px) {
-  .devtools-responsive-container {
-    -moz-box-orient: vertical;
-  }
-
-  .devtools-responsive-container > .devtools-side-splitter {
-    border: 0;
-    margin: 0;
-    border-top: 1px solid black;
-    min-height: 3px;
-    height: 3px;
-    margin-bottom: -3px;
-    /* In some edge case the cursor is not changed to n-resize */
-    cursor: n-resize;
-  }
-
-  .devtools-responsive-container > .devtools-sidebar-tabs {
-    min-height: 35vh;
-    max-height: 75vh;
-  }
-}
-
-/* Tooltip widget (see browser/devtools/shared/widgets/Tooltip.js) */
-
-.devtools-tooltip .panel-arrowcontent {
-  padding: 4px;
-}
-
-.devtools-tooltip .panel-arrowcontainer {
-  /* Reseting the transition used when panels are shown */
-  transition: none;
-  /* Panels slide up/down/left/right when they appear using a transform.
-  Since we want to remove the transition, we don't need to transform anymore
-  plus it can interfeer by causing mouseleave events on the underlying nodes */
-  transform: none;
-}
-
-.devtools-tooltip[clamped-dimensions] {
-  max-height: 400px;
-  max-width: 400px;
-}
-.devtools-tooltip[clamped-dimensions] .panel-arrowcontent {
-  overflow: hidden;
-}
-
-/* Tooltip: Simple Text */
-
-.devtools-tooltip-simple-text {
-  max-width: 400px;
-  margin: 0 -4px; /* Compensate for the .panel-arrowcontent padding. */
-  padding: 8px 12px;
-  white-space: pre-wrap;
-}
-
-.devtools-tooltip-simple-text:first-child {
-  margin-top: -4px;
-}
-
-.devtools-tooltip-simple-text:last-child {
-  margin-bottom: -4px;
-}
-
-/* Tooltip: Variables View */
-
-.devtools-tooltip-variables-view-box {
-  margin: -4px; /* Compensate for the .panel-arrowcontent padding. */
-}
-
-/* Tooltip: Tiles */
-
-.devtools-tooltip-tiles {
-  background-color: #eee;
-  background-image: linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc),
-    linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc);
-  background-size: 20px 20px;
-  background-position: 0 0, 10px 10px;
-}
-
-.devtools-tooltip-iframe {
-  border: none;
-  background: transparent;
-}
--- a/browser/themes/shared/devtools/dark-theme.css
+++ b/browser/themes/shared/devtools/dark-theme.css
@@ -274,8 +274,10 @@ div.CodeMirror span.eval-text {
 .theme-tooltip-panel .devtools-tooltip-simple-text {
   color: white;
   border-bottom: 1px solid #434850;
 }
 
 .theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
   border-bottom: 0;
 }
+
+%include toolbars.inc.css
--- a/browser/themes/shared/devtools/light-theme.css
+++ b/browser/themes/shared/devtools/light-theme.css
@@ -273,8 +273,10 @@ div.CodeMirror span.eval-text {
 .theme-tooltip-panel .devtools-tooltip-simple-text {
   color: black;
   border-bottom: 1px solid #d9e1e8;
 }
 
 .theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
   border-bottom: 0;
 }
+
+%include toolbars.inc.css
\ No newline at end of file
new file mode 100644
--- /dev/null
+++ b/browser/themes/shared/devtools/toolbars.inc.css
@@ -0,0 +1,575 @@
+%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
+%filter substitution
+%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
+%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
+
+.devtools-toolbar {
+  -moz-appearance: none;
+  padding: 4px 3px;
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+}
+
+.devtools-menulist,
+.devtools-toolbarbutton {
+  -moz-appearance: none;
+  -moz-box-align: center;
+  min-width: 78px;
+  min-height: 22px;
+  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
+  border: 1px solid hsla(210,8%,5%,.45);
+  border-radius: 3px;
+  background: linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
+  box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
+  margin: 0 3px;
+  color: inherit;
+}
+
+.devtools-toolbarbutton > .toolbarbutton-menubutton-button {
+  -moz-box-orient: horizontal;
+}
+
+.devtools-menulist:-moz-focusring,
+.devtools-toolbarbutton:-moz-focusring {
+  outline: 1px dotted hsla(210,30%,85%,0.7);
+  outline-offset: -4px;
+}
+
+.devtools-toolbarbutton:not([label]) {
+  min-width: 32px;
+}
+
+.devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
+  display: none;
+}
+
+.devtools-toolbarbutton:not([checked=true]):hover:active {
+  border-color: hsla(210,8%,5%,.6);
+  background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
+  box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
+}
+
+.devtools-menulist[open=true],
+.devtools-toolbarbutton[open=true],
+.devtools-toolbarbutton[checked=true] {
+  border-color: hsla(210,8%,5%,.6) !important;
+  background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
+  box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
+}
+
+.devtools-toolbarbutton[checked=true] {
+  color: hsl(208,100%,60%);
+}
+
+.devtools-toolbarbutton[checked=true]:hover {
+  background-color: transparent !important;
+}
+
+.devtools-toolbarbutton[checked=true]:hover:active {
+  background-color: hsla(210,8%,5%,.2) !important;
+}
+
+.devtools-option-toolbarbutton {
+  -moz-appearance: none;
+  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
+  -moz-image-region: rect(0px 16px 16px 0px);
+  background: none;
+  border: none;
+}
+
+.devtools-option-toolbarbutton[open=true] {
+  -moz-image-region: rect(0px 32px 16px 16px);
+}
+
+.devtools-menulist > .menulist-label-box {
+  text-align: center;
+}
+
+.devtools-menulist > .menulist-dropmarker {
+  -moz-appearance: none;
+  display: -moz-box;
+  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
+  -moz-box-align: center;
+  min-width: 16px;
+}
+
+.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
+  -moz-appearance: none;
+  color: inherit;
+  border-width: 0;
+  -moz-border-end: 1px solid hsla(210,8%,5%,.45);
+  box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);
+}
+
+.devtools-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
+  box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);
+}
+
+.devtools-toolbarbutton[type=menu-button] {
+  padding: 0 1px;
+  -moz-box-align: stretch;
+}
+
+.devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
+.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
+  -moz-appearance: none !important;
+  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
+  -moz-box-align: center;
+  padding: 0 3px;
+}
+
+/* Text input */
+
+.devtools-textinput,
+.devtools-searchinput {
+  -moz-appearance: none;
+  margin: 0 3px;
+  min-height: 22px;
+  border: 1px solid hsla(210,8%,5%,.6);
+  border-radius: 20px;
+  background-color: transparent;
+  background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
+  padding: 3px;
+  box-shadow: 0 1px 1px hsla(210,8%,5%,.3) inset,
+              0 0 0 1px hsla(210,16%,76%,.1) inset,
+              0 1px 0 hsla(210,16%,76%,.15);
+  color: inherit;
+}
+
+.devtools-searchinput {
+  padding-top: 0;
+  padding-bottom: 0;
+  -moz-padding-start: 18px;
+  -moz-padding-end: 12px;
+  background-image: url(magnifying-glass.png), linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
+  background-position: 4px center, top left, top left;
+  background-repeat: no-repeat;
+  font-size: inherit;
+}
+
+.devtools-searchinput:-moz-locale-dir(rtl) {
+  background-position: calc(100% - 4px) center, top left, top left;
+}
+
+.devtools-searchinput > .textbox-input-box > .textbox-search-icons {
+  display: none;
+}
+
+.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
+  color: hsl(208,10%,66%);
+  opacity: 1.0;
+}
+
+.devtools-no-search-result {
+  box-shadow: inset 0 0 0 1px hsla(0,68%,6%,.35);
+  border-color: hsl(10,70%,40%) hsl(10,75%,37%) hsl(10,80%,35%) !important;
+  background-image: url(magnifying-glass.png), linear-gradient(hsla(1,16%,76%,.45), hsla(1,16%,76%,.75));
+}
+
+/* Close button */
+
+.devtools-closebutton {
+  list-style-image: url("chrome://browser/skin/devtools/close.png");
+  -moz-appearance: none;
+  border: none;
+  margin: 0 4px;
+  min-width: 16px;
+  width: 16px;
+  opacity: 0.6;
+}
+
+.devtools-closebutton > .toolbarbutton-icon {
+  /* XXX Buttons have padding in widget/ that we don't want here but can't override with good CSS, so we must
+     use evil CSS to give the impression of smaller content */
+  margin: -4px;
+}
+
+.devtools-closebutton > .toolbarbutton-text {
+  display: none;
+}
+
+.devtools-closebutton:hover {
+  opacity: 0.8;
+}
+
+.devtools-closebutton:hover:active {
+  opacity: 1;
+}
+
+/* In-tools sidebar */
+
+.devtools-sidebar-tabs {
+  -moz-appearance: none;
+  margin: 0;
+}
+
+.devtools-sidebar-tabs > tabpanels {
+  -moz-appearance: none;
+  padding: 0;
+  border: 0;
+}
+
+.devtools-sidebar-tabs > tabs {
+  -moz-appearance: none;
+  position: static;
+  font: inherit;
+  color: #b6babf;
+  margin-bottom: 0;
+  padding: 0;
+  background-color: #343c45;
+  border-width: 0 0 1px 0;
+  border-color: hsla(210,8%,5%,.6);
+  border-style: solid;
+  overflow: hidden;
+}
+
+.devtools-sidebar-tabs > tabs > .tabs-right,
+.devtools-sidebar-tabs > tabs > .tabs-left {
+  display: none;
+}
+
+.devtools-sidebar-tabs > tabs > tab {
+  -moz-appearance: none;
+  /* We want to match the height of a toolbar with a toolbarbutton
+   * First, we need to replicated the padding of toolbar (4px),
+   * then we need to take the border of the buttons into account (1px).
+   */
+  padding: 5px 3px;
+  -moz-padding-start: 6px;
+  margin: 0;
+  min-width: 78px;
+  /* toolbar's min-height is button min-height (25px) + padding (2 * 4px): 33px.
+   * -1px because the parent element (<tabs>) comes with a 1px bottom border.
+   */
+  min-height: 32px;
+  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
+  text-align: center;
+  color: inherit;
+  -moz-box-flex: 1;
+  border-width: 0;
+  position: static;
+  -moz-margin-start: -1px;
+}
+
+.devtools-sidebar-tabs > tabs > tab:first-of-type {
+  -moz-margin-start: -3px;
+}
+
+.devtools-sidebar-tabs > tabs > tab {
+  background-size: calc(100% - 2px) 100%, 1px 100%;
+  background-repeat: no-repeat;
+  background-position: 1px, 0;
+}
+
+.devtools-sidebar-tabs:-moz-locale-dir(rtl) > tabs > tab {
+  background-position: calc(100% - 1px), 100%;
+}
+
+.devtools-sidebar-tabs > tabs > tab {
+  background-color: transparent;
+  background-image: linear-gradient(transparent, transparent), @smallSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab:hover {
+  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @smallSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab:hover:active {
+  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @smallSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab[selected=true] + tab {
+  background-image: linear-gradient(transparent, transparent), @solidSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover {
+  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @solidSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover:active {
+  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @solidSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab[selected=true] {
+  color: #f5f7fa;
+  background-image: linear-gradient(#1d4f73, #1d4f73), @solidSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab[selected=true]:hover {
+  background-image: linear-gradient(#274f64, #274f64), @solidSeparator@;
+}
+
+.devtools-sidebar-tabs > tabs > tab[selected=true]:hover:active {
+  background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
+}
+
+/* Toolbox - moved from toolbox.css.
+ * Rules that apply to the global toolbox like command buttons,
+ * devtools tabs, docking buttons, etc. */
+
+#toolbox-controls {
+  margin: 0 4px;
+}
+
+#toolbox-controls > toolbarbutton,
+#toolbox-dock-buttons > toolbarbutton {
+  -moz-appearance: none;
+  margin: 0 4px;
+  min-width: 16px;
+  width: 16px;
+}
+
+#toolbox-controls > toolbarbutton > .toolbarbutton-text,
+#toolbox-dock-buttons > toolbarbutton > .toolbarbutton-text,
+.command-button > .toolbarbutton-text {
+  display: none;
+}
+
+#toolbox-dock-bottom {
+  list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
+}
+
+#toolbox-dock-side {
+  list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
+}
+
+#toolbox-dock-window {
+  list-style-image: url("chrome://browser/skin/devtools/undock.png");
+}
+
+#toolbox-dock-window,
+#toolbox-dock-bottom,
+#toolbox-dock-side {
+  opacity: 0.6;
+}
+
+#toolbox-dock-window:hover,
+#toolbox-dock-bottom:hover,
+#toolbox-dock-side:hover {
+  opacity: 1;
+}
+
+#toolbox-controls-separator {
+  width: 3px;
+  background-image: linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0)),
+                    linear-gradient(hsla(206,37%,4%,0), hsla(206,37%,4%,.6), hsla(206,37%,4%,0)),
+                    linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0));
+  background-size: 1px 100%;
+  background-repeat: no-repeat;
+  background-position: 0, 1px, 2px;
+  -moz-margin-start: 8px;
+}
+
+/* Command buttons */
+
+.command-button {
+  -moz-appearance: none;
+  padding: 0 8px;
+  margin: 0;
+  width: 16px;
+}
+
+.command-button:hover {
+  background-color: hsla(206,37%,4%,.2);
+}
+.command-button:hover:active, .command-button[checked=true]:not(:hover) {
+  background-color: hsla(206,37%,4%,.4);
+}
+
+#command-button-paintflashing {
+  list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
+  -moz-image-region: rect(0px, 16px, 16px, 0px);
+}
+#command-button-paintflashing:hover {
+  -moz-image-region: rect(0px, 32px, 16px, 16px);
+}
+#command-button-paintflashing:hover:active {
+  -moz-image-region: rect(0px, 48px, 16px, 32px);
+}
+#command-button-paintflashing[checked=true] {
+  -moz-image-region: rect(0px, 64px, 16px, 48px);
+}
+
+#command-button-responsive {
+  list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
+  -moz-image-region: rect(0px, 16px, 16px, 0px);
+}
+#command-button-responsive:hover {
+  -moz-image-region: rect(0px, 32px, 16px, 16px);
+}
+#command-button-responsive:hover:active {
+  -moz-image-region: rect(0px, 48px, 16px, 32px);
+}
+#command-button-responsive[checked=true] {
+  -moz-image-region: rect(0px, 64px, 16px, 48px);
+}
+
+#command-button-tilt {
+  list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
+  -moz-image-region: rect(0px, 16px, 16px, 0px);
+}
+#command-button-tilt:hover {
+  -moz-image-region: rect(0px, 32px, 16px, 16px);
+}
+
+#command-button-tilt:hover:active {
+  -moz-image-region: rect(0px, 48px, 16px, 32px);
+}
+
+#command-button-tilt[checked=true] {
+  -moz-image-region: rect(0px, 64px, 16px, 48px);
+}
+
+#command-button-scratchpad {
+  list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
+  -moz-image-region: rect(0px, 16px, 16px, 0px);
+}
+
+#command-button-scratchpad:hover {
+  -moz-image-region: rect(0px, 32px, 16px, 16px);
+}
+
+#command-button-scratchpad:hover:active {
+  -moz-image-region: rect(0px, 48px, 16px, 32px);
+}
+
+/* Tabs */
+
+.devtools-tabbar {
+  -moz-appearance: none;
+  background-image: url("background-noise-toolbar.png"),
+                    linear-gradient(#303840, #2d3640);
+  border-color: #060a0d;
+  border-style: solid;
+  border-width: 1px 0;
+  box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
+              0 -1px 0 hsla(206,37%,4%,.1) inset;
+  min-height: 32px;
+  padding: 0;
+}
+
+#toolbox-tabs {
+  margin: 0;
+}
+
+.devtools-tab {
+  -moz-binding: url("chrome://global/content/bindings/general.xml#control-item");
+  -moz-box-align: center;
+}
+
+.devtools-tab {
+  -moz-appearance: none;
+  min-width: 32px;
+  min-height: 32px;
+  max-width: 127px;
+  color: #b6babf;
+  margin: 0;
+  padding: 0;
+  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
+                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
+  background-size: 1px 100%;
+  background-repeat: no-repeat;
+  background-position: left, right;
+  border-right: 1px solid hsla(206,37%,4%,.45);
+  -moz-box-align: center;
+}
+
+.devtools-tab > image {
+  border: none;
+  -moz-margin-end: 0;
+  -moz-margin-start: 4px;
+  opacity: 0.6;
+  max-height: 16px;
+  width: 16px; /* Prevents collapse during theme switching */
+}
+
+#toolbox-tab-options > image {
+  margin: 0 8px;
+}
+
+.devtools-tab > label {
+  white-space: nowrap;
+}
+
+.devtools-tab:hover > image {
+  opacity: 0.8;
+}
+
+.devtools-tab:active > image,
+.devtools-tab[selected=true] > label {
+  opacity: 1;
+}
+
+.devtools-tab:hover {
+  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
+                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
+                    linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
+  background-size: 1px 100%,
+                   1px 100%,
+                   100%;
+  background-repeat: no-repeat,
+                     no-repeat,
+                     repeat-x;
+  background-position: left, right;
+  color: #ced3d9;
+}
+.devtools-tab:hover:active {
+  background-color: hsla(206,37%,4%,.2);
+  color: #f5f7fa;
+}
+
+.devtools-tab[selected=true] {
+  color: #f5f7fa;
+  background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
+                    radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
+                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
+                    linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
+                    linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
+  background-size: 100% 1px,
+                   100% 5px,
+                   1px 100%,
+                   1px 100%,
+                   100%;
+  background-repeat: no-repeat,
+                     no-repeat,
+                     no-repeat,
+                     no-repeat,
+                     repeat-x;
+  background-position: top right, top left, left, right;
+  box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
+}
+
+.devtools-tab:not([selected=true]).highlighted {
+  color: #f5f7fa;
+  background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
+                    radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
+                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
+                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
+                    linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
+  background-size: 100% 1px,
+                   100% 5px,
+                   1px 100%,
+                   1px 100%,
+                   100%;
+  background-repeat: no-repeat,
+                     no-repeat,
+                     no-repeat,
+                     no-repeat,
+                     repeat-x;
+  background-position: top right, top left, left, right;
+}
+
+.devtools-tab:not(.highlighted) > .highlighted-icon,
+.devtools-tab[selected=true] > .highlighted-icon,
+.devtools-tab:not([selected=true]).highlighted > .default-icon {
+  visibility: collapse;
+}
+
+.hidden-labels-box:not(.visible) > label,
+.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
+  display: none;
+}
deleted file mode 100644
--- a/browser/themes/windows/devtools/common.css
+++ /dev/null
@@ -1,364 +0,0 @@
-/* vim:set ts=2 sw=2 sts=2 et: */
-/* 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/. */
-
-/* Font for code */
-
-:root {
-  font: message-box;
-}
-
-.devtools-monospace {
-  font-family: Consolas, monospace;
-}
-
-/* Toolbar and Toolbar items */
-
-.devtools-toolbar {
-  -moz-appearance: none;
-  padding: 4px 3px;
-  border-bottom-width: 1px;
-  border-bottom-style: solid;
-}
-
-.devtools-menulist,
-.devtools-toolbarbutton {
-  -moz-appearance: none;
-  -moz-box-align: center;
-  min-width: 78px;
-  min-height: 22px;
-  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
-  border: 1px solid hsla(211,68%,6%,.5);
-  border-radius: 3px;
-  background: linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2)) padding-box;
-  box-shadow: 0 1px 0 hsla(209,29%,72%,.15) inset, 0 0 0 1px hsla(209,29%,72%,.1) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
-  margin: 0;
-  -moz-margin-end: 3px;
-  color: inherit;
-}
-
-.devtools-toolbarbutton > .toolbarbutton-menubutton-button {
-  -moz-box-orient: horizontal;
-}
-
-.devtools-menulist:-moz-focusring,
-.devtools-toolbarbutton:-moz-focusring {
-  outline: 1px dotted hsla(210,30%,85%,0.7);
-  outline-offset: -4px;
-}
-
-.devtools-toolbarbutton > .toolbarbutton-icon {
-  margin: 0;
-}
-
-.devtools-toolbarbutton:not([label]) {
-  min-width: 32px;
-}
-
-.devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
-  display: none;
-}
-
-.devtools-toolbarbutton:not([checked=true]):hover:active {
-  background-color: hsla(210,18%,9%,.1);
-  background-image: linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2));
-  box-shadow: 0 1px 3px hsla(211,68%,6%,.5) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
-}
-
-.devtools-menulist[open=true],
-.devtools-toolbarbutton[open=true],
-.devtools-toolbarbutton[checked=true] {
-  border-color: hsla(211,68%,6%,.6);
-  background: linear-gradient(hsla(211,68%,6%,.1), hsla(211,68%,6%,.2));
-  box-shadow: 0 1px 3px hsla(211,68%,6%,.5) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
-}
-
-.devtools-toolbarbutton[checked=true] {
-  color: hsl(200,100%,60%) !important;
-}
-
-.devtools-toolbarbutton[checked=true]:hover:active {
-  background-color: hsla(211,68%,6%,.2);
-}
-
-.devtools-option-toolbarbutton {
-  -moz-appearance: none;
-  list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-  background: none;
-  border: none;
-}
-
-.devtools-option-toolbarbutton[open=true] {
-  -moz-image-region: rect(0px 32px 16px 16px);
-}
-
-.devtools-menulist > .menulist-label-box {
-  text-align: center;
-}
-
-.devtools-menulist > .menulist-dropmarker {
-  -moz-appearance: none;
-  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
-  border-width: 0;
-  background-color: transparent;
-}
-
-.devtools-menulist:focus:not([open="true"]):not(.menulist-compact) > .menulist-label-box {
-  color: hsl(210,30%,85%) !important;
-  background-color: transparent;
-}
-
-.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
-  -moz-appearance: none;
-  color: inherit;
-  border-width: 0;
-  -moz-border-end: 1px solid hsla(210,8%,5%,.45);
-  box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
-  box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);
-}
-
-.devtools-toolbarbutton[type=menu-button] {
-  padding: 0 1px;
-  -moz-box-align: stretch;
-}
-
-.devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
-.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
-  -moz-appearance: none !important;
-  list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
-  -moz-box-align: center;
-}
-
-/* Text input */
-
-.devtools-textinput,
-.devtools-searchinput {
-  -moz-appearance: none;
-  margin: 0 3px;
-  min-height: 22px;
-  border: 1px solid hsla(211,68%,6%,.6);
-  box-shadow: inset 0 1px 0 hsla(211,68%,6%,.05), 0 0 0 1px hsla(210,40%,83%,.1);
-  border-radius: 2px;
-  background-color: transparent;
-  background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
-  padding: 3px;
-  transition-property: background-color, border-color, box-shadow;
-  transition-duration: 150ms;
-  transition-timing-function: ease;
-  color: inherit;
-}
-
-.devtools-searchinput {
-  background-image: url(magnifying-glass.png), linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
-  background-repeat: no-repeat;
-  background-position: 4px center, top left, top left;
-  padding-top: 0;
-  padding-bottom: 0;
-  -moz-padding-start: 18px;
-  -moz-padding-end: 12px;
-  font-size: inherit;
-}
-
-.devtools-searchinput[focused] {
-  border-color: hsl(200,70%,40%) hsl(200,75%,37%) hsl(200,80%,35%);
-  background-origin: padding-box;
-  background-clip: padding-box;
-  box-shadow: inset 0 0 0 1px hsla(211,68%,6%,.1);
-}
-
-.devtools-searchinput:-moz-locale-dir(rtl) {
-  background-position: calc(100% - 4px) center, top left, top left;
-}
-
-.devtools-searchinput > .textbox-input-box > .textbox-search-icons {
-  display: none;
-}
-
-.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
-  opacity: 1.0;
-  color: hsl(208,10%,66%);
-}
-
-.devtools-no-search-result {
-  box-shadow: inset 0 0 0 1px hsla(0,68%,6%,.35);
-  border-color: hsl(10,70%,40%) hsl(10,75%,37%) hsl(10,80%,35%) !important;
-  background-image: url(magnifying-glass.png), linear-gradient(hsla(1,16%,76%,.45), hsla(1,16%,76%,.75));
-}
-
-/* Close button */
-
-.devtools-closebutton {
-  list-style-image: url("chrome://browser/skin/devtools/close.png");
-  -moz-appearance: none;
-  border: none;
-  margin: 0 4px;
-  min-width: 16px;
-  width: 16px;
-  opacity: 0.6;
-}
-
-.devtools-closebutton > .toolbarbutton-text {
-  display: none;
-}
-
-.devtools-closebutton:hover {
-  opacity: 0.8;
-}
-
-.devtools-closebutton:hover:active {
-  opacity: 1;
-}
-
-/* Splitters */
-
-.devtools-horizontal-splitter {
-  -moz-appearance: none;
-  border-width: 1px 0 0 0;
-  -moz-border-top-colors: black;
-  background-color: transparent;
-  min-height: 3px;
-  height: 3px;
-  margin-bottom: -3px;
-  position: relative;
-}
-
-.devtools-side-splitter {
-  border: 0;
-  -moz-border-start: 1px solid #242b33;
-  min-width: 0;
-  width: 3px;
-  background-color: transparent;
-  -moz-margin-end: -3px;
-  position: relative;
-  cursor: e-resize;
-}
-
-/* In-tools sidebar */
-
-.devtools-toolbox-side-iframe {
-  min-width: 465px;
-}
-
-.devtools-sidebar-tabs {
-  -moz-appearance: none;
-  margin: 0;
-}
-
-.devtools-sidebar-tabs > tabpanels {
-  -moz-appearance: none;
-  padding: 0;
-  border: 0;
-}
-
-.devtools-sidebar-tabs > tabs {
-  -moz-appearance: none;
-  position: static;
-  color: #b6babf;
-  margin-bottom: 0;
-  padding: 0;
-  background-color: #343c45;
-  border-width: 0 0 1px 0;
-  border-color: hsla(210,8%,5%,.6);
-  border-style: solid;
-  overflow: hidden;
-}
-
-.devtools-sidebar-tabs > tabs > .tabs-right,
-.devtools-sidebar-tabs > tabs > .tabs-left {
-  display: none;
-}
-
-.devtools-sidebar-tabs > tabs > tab {
-  -moz-appearance: none;
-  /* We want to match the height of a toolbar with a toolbarbutton
-   * First, we need to replicated the padding of toolbar (4px),
-   * then we need to take the border of the buttons into account (1px).
-   */
-  padding: 5px 3px;
-  -moz-padding-start: 6px;
-  margin: 0;
-  min-width: 78px;
-  /* toolbar's min-height is button min-height (25px) + padding (2 * 4px): 33px.
-   * -1px because the parent element (<tabs>) comes with a 1px bottom border.
-   */
-  min-height: 32px;
-  text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
-  text-align: center;
-  color: inherit;
-  -moz-box-flex: 1;
-  border-width: 0;
-  background: transparent;
-  border-radius: 0;
-  position: static;
-  -moz-margin-start: -1px;
-}
-
-.devtools-sidebar-tabs > tabs > tab:-moz-focusring {
-  position: static;
-}
-
-.devtools-sidebar-tabs > tabs > tab:last-of-type {
-  -moz-border-end-width: 0;
-}
-
-.devtools-sidebar-tabs > tabs > tab:first-of-type {
-  -moz-margin-start: -3px;
-}
-
-.devtools-sidebar-tabs > tabs > tab {
-  background-size: calc(100% - 2px) 100%, 1px 100%;
-  background-repeat: no-repeat;
-  background-position: 1px, 0;
-}
-
-.devtools-sidebar-tabs:-moz-locale-dir(rtl) > tabs > tab {
-  background-position: calc(100% - 1px), 100%;
-}
-
-%filter substitution
-%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
-%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
-
-.devtools-sidebar-tabs > tabs > tab {
-  background-image: linear-gradient(transparent, transparent), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab:hover {
-  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab:hover:active {
-  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @smallSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab {
-  background-image: linear-gradient(transparent, transparent), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover {
-  background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover:active {
-  background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true] {
-  color: #f5f7fa;
-  background-image: linear-gradient(#1d4f73, #1d4f73), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true]:hover {
-  background-image: linear-gradient(#274f64, #274f64), @solidSeparator@;
-}
-
-.devtools-sidebar-tabs > tabs > tab[selected=true]:hover:active {
-  background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
-}
-
-%include ../../shared/devtools/common.inc.css
deleted file mode 100644
--- a/browser/themes/windows/devtools/toolbox.css
+++ /dev/null
@@ -1,283 +0,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/. */
-
-#toolbox-controls {
-  margin: 0 4px;
-}
-
-#toolbox-controls > toolbarbutton,
-#toolbox-dock-buttons > toolbarbutton {
-  -moz-appearance: none;
-  border: none;
-  margin: 0 4px;
-  min-width: 16px;
-  width: 16px;
-}
-
-#toolbox-dock-bottom {
-  list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
-}
-
-#toolbox-dock-side {
-  list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
-}
-
-#toolbox-dock-window {
-  list-style-image: url("chrome://browser/skin/devtools/undock.png");
-}
-
-#toolbox-dock-window,
-#toolbox-dock-bottom,
-#toolbox-dock-side {
-  opacity: 0.6;
-}
-
-#toolbox-dock-window:hover,
-#toolbox-dock-bottom:hover,
-#toolbox-dock-side:hover {
-  opacity: 1;
-}
-
-#toolbox-controls-separator {
-  width: 3px;
-  background-image: linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0)),
-                    linear-gradient(hsla(206,37%,4%,0), hsla(206,37%,4%,.6), hsla(206,37%,4%,0)),
-                    linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0));
-  background-size: 1px 100%;
-  background-repeat: no-repeat;
-  background-position: 0, 1px, 2px;
-  -moz-margin-start: 8px;
-}
-
-
-/* Command buttons */
-
-.command-button {
-  -moz-appearance: none;
-  border: none;
-  margin: 0;
-  padding: 0 8px;
-  width: 16px;
-}
-
-.command-button:hover {
-  background-color: hsla(206,37%,4%,.2);
-}
-.command-button:hover:active, .command-button[checked=true]:not(:hover) {
-  background-color: hsla(206,37%,4%,.4);
-}
-
-#command-button-paintflashing {
-  list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-paintflashing:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-#command-button-paintflashing:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-#command-button-paintflashing[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-responsive {
-  list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-responsive:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-#command-button-responsive:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-#command-button-responsive[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-tilt {
-  list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-#command-button-tilt:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-#command-button-tilt:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-
-#command-button-tilt[checked=true] {
-  -moz-image-region: rect(0px, 64px, 16px, 48px);
-}
-
-#command-button-scratchpad {
-  list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
-  -moz-image-region: rect(0px, 16px, 16px, 0px);
-}
-
-#command-button-scratchpad:hover {
-  -moz-image-region: rect(0px, 32px, 16px, 16px);
-}
-
-#command-button-scratchpad:hover:active {
-  -moz-image-region: rect(0px, 48px, 16px, 32px);
-}
-
-/* Tabs */
-
-.devtools-tabbar {
-  -moz-appearance: none;
-  background-image: url("background-noise-toolbar.png"),
-                    linear-gradient(#303840, #2d3640);
-  border-bottom: 1px solid #060a0d;
-  box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
-              0 -1px 0 hsla(206,37%,4%,.1) inset;
-  min-height: 32px;
-  padding: 0;
-}
-
-#toolbox-tabs {
-  margin: 0;
-}
-
-.devtools-tab {
-  -moz-appearance: none;
-  min-width: 32px;
-  min-height: 32px;
-  max-width: 110px;
-  color: #b6babf;
-  margin: 0;
-  padding: 0;
-  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
-  background-size: 1px 100%;
-  background-repeat: no-repeat;
-  background-position: left, right;
-  border-top: 1px solid #060a0d;
-  border-right: 1px solid hsla(206,37%,4%,.45);
-}
-
-.devtools-tab > image {
-  -moz-margin-end: 0;
-  -moz-margin-start: 4px;
-  opacity: 0.6;
-  width: 16px; /* Prevents collapse during theme switching */
-}
-
-#toolbox-tab-options > image {
-  margin: 0 8px;
-}
-
-.devtools-tab:hover > image {
-  opacity: 0.8;
-}
-
-.devtools-tab:active > image,
-.devtools-tab[selected=true] > image {
-  opacity: 1;
-}
-
-.devtools-tab:hover {
-  background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
-  background-size: 1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: left, right;
-  color: #ced3d9;
-}
-.devtools-tab:hover:active {
-  background-color: hsla(206,37%,4%,.2);
-  color: #f5f7fa;
-}
-
-.devtools-tab[selected=true] {
-  color: #f5f7fa;
-  background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
-                    radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
-                    linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
-  background-size: 100% 1px,
-                   100% 5px,
-                   1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: top right, top left, left, right;
-  box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
-}
-
-.devtools-tab:not([selected=true]).highlighted {
-  color: #f5f7fa;
-  background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
-                    radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
-                    linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
-  background-size: 100% 1px,
-                   100% 5px,
-                   1px 100%,
-                   1px 100%,
-                   100%;
-  background-repeat: no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     no-repeat,
-                     repeat-x;
-  background-position: top right, top left, left, right;
-}
-
-.devtools-tab:not(.highlighted) > .highlighted-icon,
-.devtools-tab[selected=true] > .highlighted-icon,
-.devtools-tab:not([selected=true]).highlighted > .default-icon {
-  visibility: collapse;
-}
-
-.options-vertical-pane {
-  margin: 5px;
-  width: calc(50% - 30px);
-  min-width: 400px;
-  -moz-padding-start: 5px;
-}
-
-.options-vertical-pane > label {
-  padding: 2px 0;
-  font-size: 1.4rem;
-}
-
-.options-groupbox {
-  -moz-margin-start: 15px;
-  padding: 2px;
-}
-
-.options-groupbox > * {
-  padding: 2px;
-}
-
-.options-citation-label {
-  font-size: 1rem !important;
-  /* !important is required otherwise font-size will still be 1.4rem */
-  font-style: italic;
-  padding: 4px 0 0; /* To align it with the checkbox */
-}
-
-.options-citation-label + label {
-  padding: 3px 0 0 !important; /* To align it with the checkbox */
-  font-style: italic;
-}
-
-.hidden-labels-box:not(.visible) > label,
-.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
-  display: none;
-}
--- a/browser/themes/windows/jar.mn
+++ b/browser/themes/windows/jar.mn
@@ -165,19 +165,19 @@ browser.jar:
         skin/classic/browser/tabview/close.png                      (tabview/close.png)
         skin/classic/browser/tabview/edit-light.png                 (tabview/edit-light.png)
         skin/classic/browser/tabview/grain.png                      (tabview/grain.png)
         skin/classic/browser/tabview/search.png                     (tabview/search.png)
         skin/classic/browser/tabview/stack-expander.png             (tabview/stack-expander.png)
         skin/classic/browser/tabview/tabview.png                    (tabview/tabview.png)
         skin/classic/browser/tabview/tabview-inverted.png           (tabview/tabview-inverted.png)
         skin/classic/browser/tabview/tabview.css                    (tabview/tabview.css)
-*       skin/classic/browser/devtools/common.css                    (devtools/common.css)
-        skin/classic/browser/devtools/dark-theme.css                (../shared/devtools/dark-theme.css)
-        skin/classic/browser/devtools/light-theme.css               (../shared/devtools/light-theme.css)
+*       skin/classic/browser/devtools/common.css                    (../shared/devtools/common.css)
+*       skin/classic/browser/devtools/dark-theme.css                (../shared/devtools/dark-theme.css)
+*       skin/classic/browser/devtools/light-theme.css               (../shared/devtools/light-theme.css)
         skin/classic/browser/devtools/controls.png                  (../shared/devtools/controls.png)
 *       skin/classic/browser/devtools/widgets.css                   (devtools/widgets.css)
         skin/classic/browser/devtools/commandline-icon.png          (devtools/commandline-icon.png)
         skin/classic/browser/devtools/alerticon-warning.png         (devtools/alerticon-warning.png)
         skin/classic/browser/devtools/ruleview.css                  (devtools/ruleview.css)
         skin/classic/browser/devtools/commandline.css               (devtools/commandline.css)
         skin/classic/browser/devtools/command-paintflashing.png     (devtools/command-paintflashing.png)
         skin/classic/browser/devtools/command-responsivemode.png    (devtools/command-responsivemode.png)
@@ -248,17 +248,16 @@ browser.jar:
         skin/classic/browser/devtools/responsive-background.png     (devtools/responsive-background.png)
         skin/classic/browser/devtools/toggle-tools.png              (devtools/toggle-tools.png)
         skin/classic/browser/devtools/dock-bottom.png               (devtools/dock-bottom.png)
         skin/classic/browser/devtools/dock-side.png                 (devtools/dock-side.png)
         skin/classic/browser/devtools/floating-scrollbars.css       (devtools/floating-scrollbars.css)
         skin/classic/browser/devtools/floating-scrollbars-light.css (devtools/floating-scrollbars-light.css)
         skin/classic/browser/devtools/inspector.css                 (devtools/inspector.css)
         skin/classic/browser/devtools/profiler-stopwatch.png        (devtools/profiler-stopwatch.png)
-        skin/classic/browser/devtools/toolbox.css                   (devtools/toolbox.css)
         skin/classic/browser/devtools/tool-options.png              (devtools/tool-options.png)
         skin/classic/browser/devtools/tool-webconsole.png           (devtools/tool-webconsole.png)
         skin/classic/browser/devtools/tool-debugger.png             (devtools/tool-debugger.png)
         skin/classic/browser/devtools/tool-debugger-paused.png      (devtools/tool-debugger-paused.png)
         skin/classic/browser/devtools/tool-inspector.png            (devtools/tool-inspector.png)
         skin/classic/browser/devtools/tool-styleeditor.png          (devtools/tool-styleeditor.png)
         skin/classic/browser/devtools/tool-profiler.png             (devtools/tool-profiler.png)
         skin/classic/browser/devtools/tool-network.png              (devtools/tool-network.png)
@@ -467,19 +466,19 @@ browser.jar:
         skin/classic/aero/browser/tabview/close.png                  (tabview/close.png)
         skin/classic/aero/browser/tabview/edit-light.png             (tabview/edit-light.png)
         skin/classic/aero/browser/tabview/grain.png                  (tabview/grain.png)
         skin/classic/aero/browser/tabview/search.png                 (tabview/search.png)
         skin/classic/aero/browser/tabview/stack-expander.png         (tabview/stack-expander.png)
         skin/classic/aero/browser/tabview/tabview.png                (tabview/tabview.png)
         skin/classic/aero/browser/tabview/tabview-inverted.png       (tabview/tabview-inverted.png)
         skin/classic/aero/browser/tabview/tabview.css                (tabview/tabview.css)
-*       skin/classic/aero/browser/devtools/common.css                (devtools/common.css)
-        skin/classic/aero/browser/devtools/dark-theme.css            (../shared/devtools/dark-theme.css)
-        skin/classic/aero/browser/devtools/light-theme.css           (../shared/devtools/light-theme.css)
+*       skin/classic/aero/browser/devtools/common.css                (../shared/devtools/common.css)
+*       skin/classic/aero/browser/devtools/dark-theme.css            (../shared/devtools/dark-theme.css)
+*       skin/classic/aero/browser/devtools/light-theme.css           (../shared/devtools/light-theme.css)
         skin/classic/aero/browser/devtools/controls.png              (../shared/devtools/controls.png)
 *       skin/classic/aero/browser/devtools/widgets.css               (devtools/widgets.css)
         skin/classic/aero/browser/devtools/commandline-icon.png      (devtools/commandline-icon.png)
         skin/classic/aero/browser/devtools/command-paintflashing.png  (devtools/command-paintflashing.png)
         skin/classic/aero/browser/devtools/command-responsivemode.png (devtools/command-responsivemode.png)
         skin/classic/aero/browser/devtools/command-scratchpad.png    (devtools/command-scratchpad.png)
         skin/classic/aero/browser/devtools/command-tilt.png          (devtools/command-tilt.png)
         skin/classic/aero/browser/devtools/alerticon-warning.png     (devtools/alerticon-warning.png)
@@ -550,17 +549,16 @@ browser.jar:
         skin/classic/aero/browser/devtools/responsive-background.png (devtools/responsive-background.png)
         skin/classic/aero/browser/devtools/toggle-tools.png          (devtools/toggle-tools.png)
         skin/classic/aero/browser/devtools/dock-bottom.png           (devtools/dock-bottom.png)
         skin/classic/aero/browser/devtools/dock-side.png             (devtools/dock-side.png)
         skin/classic/aero/browser/devtools/floating-scrollbars.css   (devtools/floating-scrollbars.css)
         skin/classic/aero/browser/devtools/floating-scrollbars-light.css (devtools/floating-scrollbars-light.css)
         skin/classic/aero/browser/devtools/inspector.css             (devtools/inspector.css)
         skin/classic/aero/browser/devtools/profiler-stopwatch.png    (devtools/profiler-stopwatch.png)
-        skin/classic/aero/browser/devtools/toolbox.css               (devtools/toolbox.css)
         skin/classic/aero/browser/devtools/tool-options.png          (devtools/tool-options.png)
         skin/classic/aero/browser/devtools/tool-webconsole.png       (devtools/tool-webconsole.png)
         skin/classic/aero/browser/devtools/tool-debugger.png         (devtools/tool-debugger.png)
         skin/classic/aero/browser/devtools/tool-debugger-paused.png  (devtools/tool-debugger-paused.png)
         skin/classic/aero/browser/devtools/tool-inspector.png        (devtools/tool-inspector.png)
         skin/classic/aero/browser/devtools/tool-styleeditor.png      (devtools/tool-styleeditor.png)
         skin/classic/aero/browser/devtools/tool-profiler.png         (devtools/tool-profiler.png)
         skin/classic/aero/browser/devtools/tool-network.png          (devtools/tool-network.png)