Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-12-02 01:48:05 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 873848 - Make the developer toolbar consistent with Toolbox design, r=jwalker, paul, jaws

Browse Source
This commit is contained in:
Girish Sharma 2013-06-21 19:24:35 +03:00
parent eac51db4d0
commit a44c1b52f9
48 changed files with 155 additions and 351 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
browser/base/content/browser.css
View File

@ -598,8 +598,7 @@ html|*#gcli-output-frame,
}
.gclitoolbar-input-node,
.gclitoolbar-complete-node,
.gclitoolbar-prompt {
.gclitoolbar-complete-node {
direction: ltr;
}

5
browser/base/content/browser.xul
View File

@ -1121,11 +1121,8 @@
tooltiptext="&devToolbarCloseButton.tooltiptext;"/>
#endif
<stack class="gclitoolbar-stack-node" flex="1">
<hbox class="gclitoolbar-prompt">
<label class="gclitoolbar-prompt-label">&#187;</label>
</hbox>
<hbox class="gclitoolbar-complete-node"/>
<textbox class="gclitoolbar-input-node" rows="1"/>
<hbox class="gclitoolbar-complete-node"/>
</stack>
<toolbarbutton id="developer-toolbar-toolbox-button"
class="developer-toolbar-button"

2
browser/devtools/framework/toolbox.xul
View File

@ -30,6 +30,7 @@
#ifdef XP_MACOSX
<hbox id="toolbox-controls">
<toolbarbutton id="toolbox-close"
class="devtools-closebutton"
tooltiptext="&toolboxCloseButton.tooltip;"/>
<hbox id="toolbox-dock-buttons"/>
</hbox>
@ -42,6 +43,7 @@
<hbox id="toolbox-controls">
<hbox id="toolbox-dock-buttons"/>
<toolbarbutton id="toolbox-close"
class="devtools-closebutton"
tooltiptext="&toolboxCloseButton.tooltip;"/>
</hbox>
#endif

71
browser/themes/linux/browser.css
View File

@ -2062,12 +2062,6 @@ toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
font-size: 120%;
}
/* Developer toolbar */
#developer-toolbar {
border-top: 1px solid hsla(210, 8%, 5%, .65);
}
%include ../shared/devtools/responsivedesign.inc.css
%include ../shared/devtools/highlighter.inc.css
%include ../shared/devtools/commandline.inc.css
@ -2076,81 +2070,16 @@ toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
padding: 0;
}
.gclitoolbar-input-node {
border-color: hsl(210,11%,10%);
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);
}
.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
color: hsl(210,11%,16%);
}
.gclitoolbar-prompt {
background-color: hsl(210,11%,16%);
}
/* Web Console */
.web-console-frame {
border-bottom: 1px solid #aaa;
}
.web-console-frame[animated] {
transition: height 100ms;
}
/* Developer Toolbar */
#developer-toolbar-toolbox-button {
min-width: 18px;
}
#developer-toolbar-toolbox-button > .toolbarbutton-text {
display: none;
}
#developer-toolbar-toolbox-button > .toolbarbutton-icon {
-moz-margin-end: 0;
}
.developer-toolbar-button {
-moz-appearance: none;
min-width: 78px;
min-height: 22px;
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
border-radius: 3px;
color: inherit;
border: 1px solid transparent;
margin: 0 5px;
padding: 0 10px;
list-style-image: url("chrome://browser/skin/devtools/tools-icons-small.png");
}
.developer-toolbar-button[open=true],
.developer-toolbar-button:active:hover,
.developer-toolbar-button[checked=true] {
border-color: hsla(210,8%,5%,.6);
background: rgba(0,0,0,.6);
box-shadow: 0 1px 2px rgba(0,0,0,.5) inset, 0 1px 0 hsla(210,16%,76%,.15);
}
.developer-toolbar-button:hover,
.developer-toolbar-button[checked=true],
.developer-toolbar-button[open=true] {
color: hsl(208,100%,60%) !important;
text-shadow: 0 0 6px hsl(208,100%,60%);
}
.developer-toolbar-button[checked=true] {
background: rgba(0,0,0,.4);
}
#developer-toolbar-toolbox-button {
-moz-image-region: rect(64px, 22px, 80px, 0);
}
/* Error counter */
#developer-toolbar-toolbox-button[error-count]:before {

BIN
browser/themes/linux/devtools/close-dark.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 607 B

BIN
browser/themes/linux/devtools/commandline-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 375 B

14
browser/themes/linux/devtools/commandline.css
View File

@ -10,9 +10,9 @@
#gcli-output-root,
#gcli-tooltip-root {
border: 1px solid hsl(210,11%,10%);
border: 1px solid hsl(206,37%,4%);
box-shadow: 0 1px 0 hsla(209,29%,72%,.25) inset;
background-image: linear-gradient(hsla(209,11%,18%,0.9), hsl(210,11%,16%));
background-image: linear-gradient(hsla(209,18%,18%,0.9), hsl(209,23%,18%));
border-radius: 3px;
}
@ -32,9 +32,9 @@
margin-left: 8px;
width: 20px;
height: 10px;
border-left: 1px solid hsl(210,11%,10%);
border-right: 1px solid hsl(210,11%,10%);
background-color: hsl(210,11%,16%);
border-left: 1px solid hsl(206,37%,4%);
border-right: 1px solid hsl(206,37%,4%);
background-color: hsl(209,23%,18%);
}
.gcli-tt-description,
@ -83,8 +83,8 @@
font-weight: normal;
font-size: 90%;
border-radius: 3px;
background-color: hsl(210,11%,16%);
border: 1px solid hsl(210,11%,10%);
background-color: hsl(209,23%,18%);
border: 1px solid hsl(206,37%,4%);
}
.gcli-out-shortcut:before,

22
browser/themes/linux/devtools/common.css
View File

@ -184,9 +184,13 @@
/* Close button */
.devtools-closebutton {
list-style-image: url("moz-icon://stock/gtk-close?size=menu");
margin-top: 0;
margin-bottom: 0;
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 {
@ -195,6 +199,18 @@
margin: -4px;
}
.devtools-closebutton > .toolbarbutton-text {
display: none;
}
.devtools-closebutton:hover {
opacity: 0.8;
}
.devtools-closebutton:hover:active {
opacity: 1;
}
/* Splitters */
.devtools-horizontal-splitter {

6
browser/themes/linux/devtools/computedview.css
View File

@ -82,12 +82,6 @@ body {
}
/* From skin */
.helplink {
/* FIXME: remove this image
background-image: url("chrome://browser/skin/devtools/goto-mdn.png");
*/
}
.expander {
visibility: hidden;
margin-left: -12px!important;

5
browser/themes/linux/devtools/debugger.css
View File

@ -83,13 +83,12 @@
.dbg-expression {
height: 20px;
-moz-padding-start: 8px;
}
.dbg-expression-arrow {
width: 10px;
width: 16px;
height: auto;
background: url("chrome://browser/skin/devtools/commandline.png") 0px 4px no-repeat;
background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
}
.dbg-expression-input {

BIN
browser/themes/linux/devtools/goto-mdn.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 661 B

BIN
browser/themes/linux/devtools/toggle-tools.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

10
browser/themes/linux/devtools/toolbox.css
View File

@ -26,21 +26,15 @@
list-style-image: url("chrome://browser/skin/devtools/undock.png");
}
#toolbox-close {
list-style-image: url("chrome://browser/skin/devtools/close.png");
}
#toolbox-dock-window,
#toolbox-dock-bottom,
#toolbox-dock-side,
#toolbox-close {
#toolbox-dock-side {
opacity: 0.6;
}
#toolbox-dock-window:hover,
#toolbox-dock-bottom:hover,
#toolbox-dock-side:hover,
#toolbox-close:hover {
#toolbox-dock-side:hover {
opacity: 1;
}

BIN
browser/themes/linux/devtools/tools-icons-small.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 2.9 KiB

2
browser/themes/linux/devtools/webconsole.css
View File

@ -223,7 +223,7 @@
.jsterm-input-node {
width: 98%;
background: url("chrome://browser/skin/devtools/commandline.png") 4px 3px no-repeat;
background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16) no-repeat;
}
:-moz-any(.jsterm-input-node,

2
browser/themes/linux/devtools/widgets.css
View File

@ -566,7 +566,7 @@
/* Variables and properties editing */
.variables-view-delete {
list-style-image: url("moz-icon://stock/gtk-close?size=menu");
list-style-image: url("chrome://browser/skin/devtools/close-dark.png");
opacity: 0;
}

6
browser/themes/linux/jar.mn
View File

@ -124,13 +124,12 @@ browser.jar:
skin/classic/browser/devtools/dark-theme.css (devtools/dark-theme.css)
skin/classic/browser/devtools/light-theme.css (devtools/light-theme.css)
skin/classic/browser/devtools/widgets.css (devtools/widgets.css)
skin/classic/browser/devtools/commandline.png (devtools/commandline.png)
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)
skin/classic/browser/devtools/goto-mdn.png (devtools/goto-mdn.png)
skin/classic/browser/devtools/ruleview.css (devtools/ruleview.css)
skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css)
skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
@ -195,7 +194,7 @@ browser.jar:
skin/classic/browser/devtools/responsive-se-resizer.png (devtools/responsive-se-resizer.png)
skin/classic/browser/devtools/responsive-vertical-resizer.png (devtools/responsive-vertical-resizer.png)
skin/classic/browser/devtools/responsive-background.png (devtools/responsive-background.png)
skin/classic/browser/devtools/tools-icons-small.png (devtools/tools-icons-small.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)
@ -210,6 +209,7 @@ browser.jar:
skin/classic/browser/devtools/tool-profiler.png (devtools/tool-profiler.png)
skin/classic/browser/devtools/tool-network.png (devtools/tool-network.png)
skin/classic/browser/devtools/close.png (devtools/close.png)
skin/classic/browser/devtools/close-dark.png (devtools/close-dark.png)
skin/classic/browser/devtools/undock.png (devtools/undock.png)
skin/classic/browser/devtools/font-inspector.css (devtools/font-inspector.css)
skin/classic/browser/devtools/computedview.css (devtools/computedview.css)

79
browser/themes/osx/browser.css
View File

@ -3555,98 +3555,25 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
font-size: 120%;
}
/* Developer toolbar */
#developer-toolbar {
border-top: 1px solid hsla(210, 8%, 5%, .65);
padding-top: 4px;
padding-bottom: 4px;
}
#developer-toolbar:-moz-locale-dir(ltr) {
padding-left: 2px;
padding-right: 16px; /* use -moz-padding-end when/if bug 631729 gets fixed */
}
#developer-toolbar:-moz-locale-dir(rtl) {
padding-left: 4px;
padding-right: 18px; /* use -moz-padding-end when/if bug 631729 gets fixed */
}
%include ../shared/devtools/responsivedesign.inc.css
%include ../shared/devtools/highlighter.inc.css
%include ../shared/devtools/commandline.inc.css
.gclitoolbar-input-node,
.gclitoolbar-complete-node,
.gclitoolbar-prompt {
border-radius: @toolbarbuttonCornerRadius@;
}
.gclitoolbar-input-node {
border-color: hsl(210,11%,10%);
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);
}
.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
color: hsl(210,11%,16%);
}
.gclitoolbar-prompt {
background-color: hsl(210,11%,16%);
}
/* Web Console */
.web-console-frame {
border-bottom: 1px solid #aaa;
}
.web-console-frame[animated] {
transition: height 100ms;
}
/* Developer Toolbar */
#developer-toolbar-toolbox-button {
min-width: 18px;
}
#developer-toolbar-toolbox-button > .toolbarbutton-text {
display: none;
}
.developer-toolbar-button {
-moz-appearance: none;
min-width: 78px;
min-height: 22px;
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
border-radius: @toolbarbuttonCornerRadius@;
color: inherit;
border: 1px solid transparent;
margin: 0 5px;
padding: 0 10px;
list-style-image: url("chrome://browser/skin/devtools/tools-icons-small.png");
}
.developer-toolbar-button[open=true],
.developer-toolbar-button:active:hover,
.developer-toolbar-button[checked=true] {
border-color: hsla(210,8%,5%,.6);
background: rgba(0,0,0,.6);
box-shadow: 0 1px 2px rgba(0,0,0,.5) inset, 0 1px 0 hsla(210,16%,76%,.15);
}
.developer-toolbar-button[checked=true] {
color: hsl(208,100%,60%) !important;
background: rgba(0,0,0,.4);
text-shadow: 0 0 6px hsl(208,100%,60%);
}
#developer-toolbar-toolbox-button {
-moz-image-region: rect(64px, 16px, 80px, 0);
#developer-toolbar-closebutton {
margin-left: 8px;
margin-right: 8px;
}
/* Error counter */

BIN
browser/themes/osx/devtools/close-dark.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 607 B

BIN
browser/themes/osx/devtools/commandline-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 375 B

14
browser/themes/osx/devtools/commandline.css
View File

@ -10,10 +10,10 @@
#gcli-output-root,
#gcli-tooltip-root {
border: 1px solid hsl(210,11%,10%);
border: 1px solid hsl(206,37%,4%);
box-shadow: 0 1px 0 hsla(209,29%,72%,.25) inset;
background-image: url(background-noise-toolbar.png),
linear-gradient(hsla(209,18%,18%,0.9), hsl(210,11%,16%));
linear-gradient(hsla(209,18%,18%,0.9), hsl(209,23%,18%));
border-radius: 3px;
}
@ -33,9 +33,9 @@
margin-left: 8px;
width: 20px;
height: 10px;
border-left: 1px solid hsl(210,11%,10%);
border-right: 1px solid hsl(210,11%,10%);
background-color: hsl(210,11%,16%);
border-left: 1px solid hsl(206,37%,4%);
border-right: 1px solid hsl(206,37%,4%);
background-color: hsl(209,23%,18%);
background-image: url(background-noise-toolbar.png);
}
@ -85,8 +85,8 @@
font-weight: normal;
font-size: 90%;
border-radius: 3px;
background-color: hsl(210,11%,16%);
border: 1px solid hsl(210,11%,10%);
background-color: hsl(209,23%,18%);
border: 1px solid hsl(206,37%,4%);
}
.gcli-out-shortcut:before,

12
browser/themes/osx/devtools/common.css
View File

@ -188,11 +188,13 @@
/* Close button */
.devtools-closebutton {
list-style-image: url("chrome://browser/skin/devtools/toolbarbutton-close.png");
-moz-image-region: rect(0, 16px, 16px, 0);
list-style-image: url("chrome://browser/skin/devtools/close.png");
-moz-appearance: none;
border: none;
margin: 0 4px;
min-width: 16px;
width: 16px;
margin: 0 4px;
opacity: 0.6;
}
.devtools-closebutton > .toolbarbutton-text {
@ -200,11 +202,11 @@
}
.devtools-closebutton:hover {
-moz-image-region: rect(0, 32px, 16px, 16px);
opacity: 0.8;
}
.devtools-closebutton:active {
-moz-image-region: rect(0, 48px, 16px, 32px);
opacity: 1;
}
/* Splitters */

6
browser/themes/osx/devtools/computedview.css
View File

@ -100,12 +100,6 @@ body {
}
/* From skin */
.helplink {
/* FIXME: remove this image
background-image: url("chrome://browser/skin/devtools/goto-mdn.png");
*/
}
.expander {
visibility: hidden;
margin-left: -12px!important;

5
browser/themes/osx/devtools/debugger.css
View File

@ -85,13 +85,12 @@
.dbg-expression {
height: 20px;
-moz-padding-start: 8px;
}
.dbg-expression-arrow {
width: 10px;
width: 16px;
height: auto;
background: url("chrome://browser/skin/devtools/commandline.png") 0px 4px no-repeat;
background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
}
.dbg-expression-input {

BIN
browser/themes/osx/devtools/goto-mdn.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 661 B

BIN
browser/themes/osx/devtools/toggle-tools.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
browser/themes/osx/devtools/toolbarbutton-close.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.0 KiB

10
browser/themes/osx/devtools/toolbox.css
View File

@ -25,21 +25,15 @@
list-style-image: url("chrome://browser/skin/devtools/undock.png");
}
#toolbox-close {
list-style-image: url("chrome://browser/skin/devtools/close.png");
}
#toolbox-dock-window,
#toolbox-dock-bottom,
#toolbox-dock-side,
#toolbox-close {
#toolbox-dock-side {
opacity: 0.6;
}
#toolbox-dock-window:hover,
#toolbox-dock-bottom:hover,
#toolbox-dock-side:hover,
#toolbox-close:hover {
#toolbox-dock-side:hover {
opacity: 1;
}

BIN
browser/themes/osx/devtools/tools-icons-small.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 2.9 KiB

2
browser/themes/osx/devtools/webconsole.css
View File

@ -227,7 +227,7 @@
}
.jsterm-input-node {
background: url("chrome://browser/skin/devtools/commandline.png") 4px 2px no-repeat;
background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16) no-repeat;
}
:-moz-any(.jsterm-input-node,

3
browser/themes/osx/devtools/widgets.css
View File

@ -566,8 +566,7 @@
/* Variables and properties editing */
.variables-view-delete {
list-style-image: url("chrome://browser/skin/devtools/toolbarbutton-close.png");
-moz-image-region: rect(0,32px,16px,16px);
list-style-image: url("chrome://browser/skin/devtools/close-dark.png");
opacity: 0;
}

7
browser/themes/osx/jar.mn
View File

@ -212,13 +212,12 @@ browser.jar:
skin/classic/browser/devtools/dark-theme.css (devtools/dark-theme.css)
skin/classic/browser/devtools/light-theme.css (devtools/light-theme.css)
skin/classic/browser/devtools/widgets.css (devtools/widgets.css)
skin/classic/browser/devtools/commandline.png (devtools/commandline.png)
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)
skin/classic/browser/devtools/goto-mdn.png (devtools/goto-mdn.png)
skin/classic/browser/devtools/ruleview.css (devtools/ruleview.css)
skin/classic/browser/devtools/commandline.css (devtools/commandline.css)
skin/classic/browser/devtools/checkbox-dark.png (devtools/checkbox-dark.png)
@ -229,7 +228,6 @@ browser.jar:
skin/classic/browser/devtools/orion-task.png (devtools/orion-task.png)
skin/classic/browser/devtools/orion-breakpoint.png (devtools/orion-breakpoint.png)
skin/classic/browser/devtools/orion-debug-location.png (devtools/orion-debug-location.png)
skin/classic/browser/devtools/toolbarbutton-close.png (devtools/toolbarbutton-close.png)
* skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css)
skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
skin/classic/browser/devtools/webconsole.png (devtools/webconsole.png)
@ -284,7 +282,7 @@ browser.jar:
skin/classic/browser/devtools/responsive-se-resizer.png (devtools/responsive-se-resizer.png)
skin/classic/browser/devtools/responsive-vertical-resizer.png (devtools/responsive-vertical-resizer.png)
skin/classic/browser/devtools/responsive-background.png (devtools/responsive-background.png)
skin/classic/browser/devtools/tools-icons-small.png (devtools/tools-icons-small.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)
@ -297,6 +295,7 @@ browser.jar:
skin/classic/browser/devtools/tool-profiler.png (devtools/tool-profiler.png)
skin/classic/browser/devtools/tool-network.png (devtools/tool-network.png)
skin/classic/browser/devtools/close.png (devtools/close.png)
skin/classic/browser/devtools/close-dark.png (devtools/close-dark.png)
skin/classic/browser/devtools/undock.png (devtools/undock.png)
skin/classic/browser/devtools/font-inspector.css (devtools/font-inspector.css)
skin/classic/browser/devtools/computedview.css (devtools/computedview.css)

87
browser/themes/shared/devtools/commandline.inc.css
View File

@ -4,6 +4,48 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%endif
/* Developer toolbar */
#developer-toolbar {
padding: 0;
min-height: 32px;
background-image: url(devtools/background-noise-toolbar.png), linear-gradient(#303840, #2d3640);
border-top: 1px solid #060a0d;
box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset, 0 -1px 0 hsla(206,37%,4%,.1) inset;
}
.developer-toolbar-button {
-moz-appearance: none;
border: none;
background: transparent;
margin: 0;
padding: 0 10px;
width: 32px;
}
.developer-toolbar-button > image {
margin: auto 10px;
}
#developer-toolbar-toolbox-button {
list-style-image: url("chrome://browser/skin/devtools/toggle-tools.png");
-moz-image-region: rect(0px, 16px, 16px, 0px);
}
#developer-toolbar-toolbox-button:hover {
-moz-image-region: rect(0px, 32px, 16px, 16px);
}
#developer-toolbar-toolbox-button:hover:active {
-moz-image-region: rect(0px, 48px, 16px, 32px);
}
#developer-toolbar-toolbox-button[checked=true] {
-moz-image-region: rect(0px, 64px, 16px, 48px);
}
/* GCLI */
html|*#gcli-tooltip-frame,
html|*#gcli-output-frame {
padding: 0;
@ -16,32 +58,39 @@ html|*#gcli-output-frame {
border-width: 0;
background-color: transparent;
-moz-appearance: none;
margin-bottom: -2px;
}
.gclitoolbar-input-node,
.gclitoolbar-complete-node,
.gclitoolbar-prompt {
.gclitoolbar-complete-node {
margin: 0;
-moz-margin-end: 5px;
-moz-box-align: center;
padding-top: 0;
padding-bottom: 0;
padding-right: 4px;
border: 1px solid transparent;
border-radius: 3px;
padding-right: 8px;
text-shadow: none;
box-shadow: none;
border-width: 0;
background-color: transparent;
}
.gclitoolbar-input-node {
padding-left: 20px;
background-color: transparent;
-moz-appearance: none;
border-color: hsl(210,24%,10%);
color: hsl(210,30%,85%);
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
box-shadow: inset 0 1px 0 hsla(211,68%,6%,.05),
0 0 0 1px hsla(210,40%,83%,.1);
padding-left: 20px;
background-color: #242b33;
background-repeat: no-repeat;
background-position: 4px center;
box-shadow: 0 1px 1px hsla(206,37%,4%,.2) inset,
1px 0 0 hsla(206,37%,4%,.2) inset,
-1px 0 0 hsla(206,37%,4%,.2) inset;
line-height: 32px;
outline-style: none;
background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 16, 16, 0);
}
.gclitoolbar-input-node[focused="true"] {
background-image: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
background-color: #232e38;
}
.gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
@ -54,18 +103,10 @@ html|*#gcli-output-frame {
padding-left: 21px;
background-color: transparent;
color: transparent;
z-index: 100;
pointer-events: none;
}
.gclitoolbar-prompt {
padding-left: 4px;
padding-bottom: 2px;
font-size: 150%;
font-weight: bold;
color: hsl(210,30%,85%);
background-color: hsl(210,24%,16%);
}
.gclitoolbar-prompt-label,
.gcli-in-incomplete,
.gcli-in-error,
.gcli-in-ontab,

66
browser/themes/windows/browser.css
View File

@ -2793,82 +2793,16 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
font-size: 120%;
}
/* Developer toolbar */
#developer-toolbar {
border-top: 1px solid hsla(211,68%,6%,.65) !important;
}
%include ../shared/devtools/responsivedesign.inc.css
%include ../shared/devtools/highlighter.inc.css
%include ../shared/devtools/commandline.inc.css
.gclitoolbar-input-node {
border-color: hsl(210,24%,10%);
box-shadow: inset 0 1px 0 hsla(211,68%,6%,.05),
0 0 0 1px hsla(210,40%,83%,.1);
}
/* Web Console */
.web-console-frame {
border-bottom: 1px solid #aaa;
}
.web-console-frame[animated] {
transition: height 100ms;
}
/* Developer Toolbar */
#developer-toolbar-toolbox-button {
min-width: 18px;
}
#developer-toolbar-toolbox-button > .toolbarbutton-text {
display: none;
}
#developer-toolbar-toolbox-button > .toolbarbutton-icon {
-moz-margin-end: 0;
}
.developer-toolbar-button {
-moz-appearance: none;
min-width: 78px;
min-height: 22px;
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
border-radius: 3px;
color: inherit;
border: 1px solid transparent;
margin: 0 5px;
padding: 0 10px;
list-style-image: url("chrome://browser/skin/devtools/tools-icons-small.png");
}
.developer-toolbar-button[open=true],
.developer-toolbar-button:active:hover,
.developer-toolbar-button[checked=true] {
border-color: hsla(210,8%,5%,.6);
background: rgba(0,0,0,.6);
box-shadow: 0 1px 2px rgba(0,0,0,.5) inset, 0 1px 0 hsla(210,16%,76%,.1);
}
.developer-toolbar-button:hover,
.developer-toolbar-button[checked=true],
.developer-toolbar-button[open=true] {
color: hsl(208,100%,60%) !important;
text-shadow: 0 0 6px hsl(208,100%,60%);
}
.developer-toolbar-button[checked=true] {
background: rgba(0,0,0,.4);
}
#developer-toolbar-toolbox-button {
-moz-image-region: rect(64px, 16px, 80px, 0);
}
/* Error counter */
#developer-toolbar-toolbox-button[error-count]:before {

BIN
browser/themes/windows/devtools/close-dark.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 607 B

BIN
browser/themes/windows/devtools/commandline-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 375 B

14
browser/themes/windows/devtools/commandline.css
View File

@ -10,9 +10,9 @@
#gcli-output-root,
#gcli-tooltip-root {
border: 1px solid hsl(210,24%,10%);
border: 1px solid hsl(206,37%,4%);
box-shadow: 0 1px 0 hsla(209,29%,72%,.25) inset;
background-image: linear-gradient(hsla(209,18%,18%,0.9), hsl(210,24%,16%));
background-image: linear-gradient(hsla(209,18%,18%,0.9), hsl(209,23%,18%));
border-radius: 3px;
}
@ -32,9 +32,9 @@
margin-left: 8px;
width: 20px;
height: 10px;
border-left: 1px solid hsl(210,24%,10%);
border-right: 1px solid hsl(210,24%,10%);
background-color: hsl(210,24%,16%);
border-left: 1px solid hsl(206,37%,4%);
border-right: 1px solid hsl(206,37%,4%);
background-color: hsl(209,23%,18%);
}
.gcli-tt-description,
@ -83,8 +83,8 @@
font-weight: normal;
font-size: 90%;
border-radius: 3px;
background-color: hsl(210,24%,16%);
border: 1px solid hsl(210,24%,10%);
background-color: hsl(209,23%,18%);
border: 1px solid hsl(206,37%,4%);
}
.gcli-out-shortcut:before,

13
browser/themes/windows/devtools/common.css
View File

@ -195,12 +195,13 @@
/* Close button */
.devtools-closebutton {
list-style-image: url("chrome://browser/skin/devtools/toolbarbutton-close.png");
-moz-image-region: rect(0, 16px, 16px, 0);
list-style-image: url("chrome://browser/skin/devtools/close.png");
-moz-appearance: none;
border: none;
margin: 0 4px;
min-width: 16px;
width: 16px;
-moz-appearance: none;
border-style: none;
opacity: 0.6;
}
.devtools-closebutton > .toolbarbutton-text {
@ -208,11 +209,11 @@
}
.devtools-closebutton:hover {
-moz-image-region: rect(0, 32px, 16px, 16px);
opacity: 0.8;
}
.devtools-closebutton:hover:active {
-moz-image-region: rect(0, 48px, 16px, 32px);
opacity: 1;
}
/* Splitters */

6
browser/themes/windows/devtools/computedview.css
View File

@ -100,12 +100,6 @@ body {
}
/* From skin */
.helplink {
/* FIXME: remove this image
background-image: url("chrome://browser/skin/devtools/goto-mdn.png");
*/
}
.expander {
visibility: hidden;
margin-left: -12px!important;

5
browser/themes/windows/devtools/debugger.css
View File

@ -83,13 +83,12 @@
.dbg-expression {
height: 20px;
-moz-padding-start: 8px;
}
.dbg-expression-arrow {
width: 10px;
width: 16px;
height: auto;
background: url("chrome://browser/skin/devtools/commandline.png") 0px 4px no-repeat;
background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
}
.dbg-expression-input {

BIN
browser/themes/windows/devtools/goto-mdn.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 661 B

BIN
browser/themes/windows/devtools/toggle-tools.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
browser/themes/windows/devtools/toolbarbutton-close.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 898 B

10
browser/themes/windows/devtools/toolbox.css
View File

@ -27,21 +27,15 @@
list-style-image: url("chrome://browser/skin/devtools/undock.png");
}
#toolbox-close {
list-style-image: url("chrome://browser/skin/devtools/close.png");
}
#toolbox-dock-window,
#toolbox-dock-bottom,
#toolbox-dock-side,
#toolbox-close {
#toolbox-dock-side {
opacity: 0.6;
}
#toolbox-dock-window:hover,
#toolbox-dock-bottom:hover,
#toolbox-dock-side:hover,
#toolbox-close:hover {
#toolbox-dock-side:hover {
opacity: 1;
}

BIN
browser/themes/windows/devtools/tools-icons-small.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 2.9 KiB

2
browser/themes/windows/devtools/webconsole.css
View File

@ -221,7 +221,7 @@
}
.jsterm-input-node {
background: url("chrome://browser/skin/devtools/commandline.png") 4px 3px no-repeat;
background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16) no-repeat;
}
:-moz-any(.jsterm-input-node,

3
browser/themes/windows/devtools/widgets.css
View File

@ -569,8 +569,7 @@
/* Variables and properties editing */
.variables-view-delete {
list-style-image: url("chrome://browser/skin/devtools/toolbarbutton-close.png");
-moz-image-region: rect(0,32px,16px,16px);
list-style-image: url("chrome://browser/skin/devtools/close-dark.png");
opacity: 0;
}

14
browser/themes/windows/jar.mn
View File

@ -150,9 +150,8 @@ browser.jar:
skin/classic/browser/devtools/dark-theme.css (devtools/dark-theme.css)
skin/classic/browser/devtools/light-theme.css (devtools/light-theme.css)
skin/classic/browser/devtools/widgets.css (devtools/widgets.css)
skin/classic/browser/devtools/commandline.png (devtools/commandline.png)
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/goto-mdn.png (devtools/goto-mdn.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)
@ -167,7 +166,6 @@ browser.jar:
skin/classic/browser/devtools/orion-task.png (devtools/orion-task.png)
skin/classic/browser/devtools/orion-breakpoint.png (devtools/orion-breakpoint.png)
skin/classic/browser/devtools/orion-debug-location.png (devtools/orion-debug-location.png)
skin/classic/browser/devtools/toolbarbutton-close.png (devtools/toolbarbutton-close.png)
skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css)
skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
skin/classic/browser/devtools/webconsole.png (devtools/webconsole.png)
@ -222,7 +220,7 @@ browser.jar:
skin/classic/browser/devtools/responsive-se-resizer.png (devtools/responsive-se-resizer.png)
skin/classic/browser/devtools/responsive-vertical-resizer.png (devtools/responsive-vertical-resizer.png)
skin/classic/browser/devtools/responsive-background.png (devtools/responsive-background.png)
skin/classic/browser/devtools/tools-icons-small.png (devtools/tools-icons-small.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)
@ -237,6 +235,7 @@ browser.jar:
skin/classic/browser/devtools/tool-profiler.png (devtools/tool-profiler.png)
skin/classic/browser/devtools/tool-network.png (devtools/tool-network.png)
skin/classic/browser/devtools/close.png (devtools/close.png)
skin/classic/browser/devtools/close-dark.png (devtools/close-dark.png)
skin/classic/browser/devtools/undock.png (devtools/undock.png)
skin/classic/browser/devtools/font-inspector.css (devtools/font-inspector.css)
skin/classic/browser/devtools/computedview.css (devtools/computedview.css)
@ -402,7 +401,7 @@ browser.jar:
skin/classic/aero/browser/devtools/dark-theme.css (devtools/dark-theme.css)
skin/classic/aero/browser/devtools/light-theme.css (devtools/light-theme.css)
skin/classic/aero/browser/devtools/widgets.css (devtools/widgets.css)
skin/classic/aero/browser/devtools/commandline.png (devtools/commandline.png)
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)
@ -410,7 +409,6 @@ browser.jar:
skin/classic/aero/browser/devtools/checkbox-dark.png (devtools/checkbox-dark.png)
skin/classic/aero/browser/devtools/checkbox-light.png (devtools/checkbox-light.png)
skin/classic/aero/browser/devtools/alerticon-warning.png (devtools/alerticon-warning.png)
skin/classic/aero/browser/devtools/goto-mdn.png (devtools/goto-mdn.png)
skin/classic/aero/browser/devtools/ruleview.css (devtools/ruleview.css)
skin/classic/aero/browser/devtools/commandline.css (devtools/commandline.css)
skin/classic/aero/browser/devtools/markup-view.css (devtools/markup-view.css)
@ -419,7 +417,6 @@ browser.jar:
skin/classic/aero/browser/devtools/orion-task.png (devtools/orion-task.png)
skin/classic/aero/browser/devtools/orion-breakpoint.png (devtools/orion-breakpoint.png)
skin/classic/aero/browser/devtools/orion-debug-location.png (devtools/orion-debug-location.png)
skin/classic/aero/browser/devtools/toolbarbutton-close.png (devtools/toolbarbutton-close.png)
skin/classic/aero/browser/devtools/webconsole.css (devtools/webconsole.css)
skin/classic/aero/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css)
skin/classic/aero/browser/devtools/webconsole.png (devtools/webconsole.png)
@ -474,7 +471,7 @@ browser.jar:
skin/classic/aero/browser/devtools/responsive-se-resizer.png (devtools/responsive-se-resizer.png)
skin/classic/aero/browser/devtools/responsive-vertical-resizer.png (devtools/responsive-vertical-resizer.png)
skin/classic/aero/browser/devtools/responsive-background.png (devtools/responsive-background.png)
skin/classic/aero/browser/devtools/tools-icons-small.png (devtools/tools-icons-small.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)
@ -489,6 +486,7 @@ browser.jar:
skin/classic/aero/browser/devtools/tool-profiler.png (devtools/tool-profiler.png)
skin/classic/aero/browser/devtools/tool-network.png (devtools/tool-network.png)
skin/classic/aero/browser/devtools/close.png (devtools/close.png)
skin/classic/aero/browser/devtools/close-dark.png (devtools/close-dark.png)
skin/classic/aero/browser/devtools/undock.png (devtools/undock.png)
skin/classic/aero/browser/devtools/font-inspector.css (devtools/font-inspector.css)
skin/classic/aero/browser/devtools/computedview.css (devtools/computedview.css)