2016-02-09 21:38:20 +00:00
|
|
|
/* 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/. */
|
|
|
|
|
2016-10-19 21:19:29 +00:00
|
|
|
@import url(resource://devtools/client/themes/variables.css);
|
|
|
|
@import url(resource://devtools/client/themes/common.css);
|
2017-04-01 15:01:06 +00:00
|
|
|
@import url(chrome://devtools/skin/light-theme.css);
|
2016-02-09 21:38:20 +00:00
|
|
|
|
2017-06-19 09:12:46 +00:00
|
|
|
:root.theme-firebug {
|
2016-02-09 21:38:20 +00:00
|
|
|
font-size: 11px;
|
2016-04-06 15:23:46 +00:00
|
|
|
font-family: var(--proportional-font-family);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* CodeMirror Color Syntax */
|
|
|
|
|
|
|
|
.theme-firebug .cm-keyword {color: BlueViolet; font-weight: bold;}
|
|
|
|
.theme-firebug .cm-atom {color: #219;}
|
|
|
|
.theme-firebug .cm-number {color: #164;}
|
|
|
|
.theme-firebug .cm-def {color: #00f;}
|
|
|
|
.theme-firebug .cm-variable {color: black;}
|
|
|
|
.theme-firebug .cm-variable-2 {color: black;}
|
|
|
|
.theme-firebug .cm-variable-3 {color: black;}
|
|
|
|
.theme-firebug .cm-property {color: black;}
|
|
|
|
.theme-firebug .cm-operator {color: black;}
|
|
|
|
.theme-firebug .cm-comment {color: Silver;}
|
|
|
|
.theme-firebug .cm-string {color: Red;}
|
|
|
|
.theme-firebug .cm-string-2 {color: Red;}
|
|
|
|
.theme-firebug .cm-meta {color: rgb(120, 120, 120); font-style: italic;}
|
|
|
|
.theme-firebug .cm-error {color: #f00;}
|
|
|
|
.theme-firebug .cm-qualifier {color: #555;}
|
|
|
|
.theme-firebug .cm-builtin {color: #30a;}
|
|
|
|
.theme-firebug .cm-bracket {color: #997;}
|
|
|
|
.theme-firebug .cm-tag {color: blue;}
|
|
|
|
.theme-firebug .cm-attribute {color: rgb(0, 0, 136);}
|
|
|
|
.theme-firebug .cm-header {color: blue;}
|
|
|
|
.theme-firebug .cm-quote {color: #090;}
|
|
|
|
.theme-firebug .cm-hr {color: #999;}
|
|
|
|
.theme-firebug .cm-link {color: #00c;}
|
|
|
|
|
|
|
|
.theme-firebug .theme-fg-color3,
|
2017-01-18 05:35:00 +00:00
|
|
|
.theme-firebug .cm-s-mozilla .kind-Object .cm-variable{
|
|
|
|
color: var(--theme-content-color1);
|
2016-04-06 15:23:46 +00:00
|
|
|
font-style: normal;
|
|
|
|
}
|
|
|
|
|
|
|
|
.theme-firebug .console-string {
|
|
|
|
color: #FF183C;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Variables View */
|
|
|
|
|
|
|
|
.theme-firebug .variables-view-variable > .title > .name,
|
|
|
|
.theme-firebug .variables-view-variable > .title > .value {
|
|
|
|
color: var(--theme-body-color);
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Firebug theme support for tabbar and panel tabs
|
|
|
|
(both, main and side panels )*/
|
|
|
|
|
|
|
|
/* Only apply bottom-border for:
|
|
|
|
1) The main tab list.
|
|
|
|
2) The side tab list if there is no scroll-box that has its own border.
|
|
|
|
|
|
|
|
Use !important to override even the rule in webconsole.css that uses
|
|
|
|
ID in the selector. */
|
|
|
|
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tabs {
|
2017-01-18 05:35:00 +00:00
|
|
|
background: var(--theme-tab-toolbar-background) !important;
|
|
|
|
border-bottom: 1px solid var(--theme-splitter-color) !important;
|
2016-04-06 15:23:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* Add a negative bottom margin to overlap bottom border
|
|
|
|
of the parent element (see also the next comment for 'tabs') */
|
|
|
|
.theme-firebug .devtools-tab,
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tab {
|
|
|
|
margin: 3px 0 -1px 0;
|
2017-03-08 17:22:22 +00:00
|
|
|
padding: 1px 4px !important;
|
2016-04-06 15:23:46 +00:00
|
|
|
border: 1px solid transparent !important;
|
2017-03-08 17:22:22 +00:00
|
|
|
border-bottom: none !important;
|
2016-04-06 15:23:46 +00:00
|
|
|
border-radius: 4px 4px 0 0;
|
|
|
|
font-weight: bold;
|
|
|
|
color: var(--theme-body-color);
|
|
|
|
-moz-box-flex: initial;
|
|
|
|
min-width: 0;
|
|
|
|
}
|
|
|
|
|
2017-03-08 17:22:22 +00:00
|
|
|
/* For toolbox tabs, the negative margin is applied on the container
|
|
|
|
instead of the tab to avoid triggering y-overflow on the container
|
|
|
|
that causes the overflow menu to display */
|
|
|
|
|
|
|
|
.theme-firebug .devtools-tab {
|
|
|
|
margin-bottom: 0;
|
2016-11-18 21:02:21 +00:00
|
|
|
}
|
|
|
|
|
2017-03-08 17:22:22 +00:00
|
|
|
.theme-firebug .toolbox-tabs,
|
|
|
|
.theme-firebug #toolbox-option-container {
|
|
|
|
margin-bottom: -1px;
|
2016-11-18 21:02:21 +00:00
|
|
|
}
|
|
|
|
|
2017-03-08 16:20:49 +00:00
|
|
|
.theme-firebug .devtools-tab-label {
|
2017-08-18 21:09:16 +00:00
|
|
|
padding-inline-end: 0;
|
|
|
|
mask-image: none;
|
2016-11-18 21:02:21 +00:00
|
|
|
}
|
|
|
|
|
2016-04-06 15:23:46 +00:00
|
|
|
/* In order to hide bottom-border of side panel tabs we need
|
|
|
|
to make the parent element overflow visible, so child element
|
|
|
|
can move one pixel down to hide the bottom border of the parent. */
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tabs {
|
|
|
|
overflow: visible;
|
|
|
|
}
|
|
|
|
|
|
|
|
.theme-firebug .devtools-tab:hover,
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tab:hover {
|
2017-03-08 17:22:22 +00:00
|
|
|
border-color: #C8C8C8 !important;
|
2016-04-06 15:23:46 +00:00
|
|
|
}
|
|
|
|
|
2016-11-18 21:02:21 +00:00
|
|
|
.theme-firebug .devtools-tab.selected,
|
2016-04-06 15:23:46 +00:00
|
|
|
.theme-firebug .devtools-sidebar-tabs tab[selected] {
|
2017-01-18 05:35:00 +00:00
|
|
|
background-color: var(--theme-toolbar-tab-selected-background);
|
2017-03-08 17:22:22 +00:00
|
|
|
border-color: var(--theme-splitter-color) !important;
|
2017-03-08 16:20:49 +00:00
|
|
|
border-bottom-color: transparent !important;
|
2016-04-06 15:23:46 +00:00
|
|
|
padding-bottom: 2px;
|
|
|
|
color: inherit;
|
|
|
|
}
|
|
|
|
|
2016-11-18 21:02:21 +00:00
|
|
|
.theme-firebug .devtools-tabbar .devtools-separator,
|
|
|
|
.theme-firebug .devtools-tab img {
|
2016-04-06 15:23:46 +00:00
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tab label {
|
|
|
|
margin: 2px 0 0 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Use different padding for labels inside tabs on Win platform.
|
|
|
|
Make sure this overrides the default in global.css */
|
|
|
|
:root[platform="win"].theme-firebug .devtools-sidebar-tabs tab label {
|
|
|
|
margin: 0 4px !important;
|
|
|
|
}
|
|
|
|
|
2016-11-18 21:02:21 +00:00
|
|
|
.theme-firebug #panelSideBox .devtools-tab.selected,
|
2016-04-06 15:23:46 +00:00
|
|
|
.theme-firebug .devtools-sidebar-tabs tab[selected] {
|
|
|
|
background-color: white;
|
|
|
|
}
|
|
|
|
|
|
|
|
.theme-firebug #panelSideBox .devtools-tab:first-child,
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tab:first-child {
|
|
|
|
margin-inline-start: 5px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Firebug theme support for the Option (panel) tab */
|
|
|
|
|
|
|
|
.theme-firebug #toolbox-tab-options {
|
|
|
|
margin-inline-end: 4px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.theme-firebug #toolbox-tab-options::before {
|
|
|
|
content: url(chrome://devtools/skin/images/firebug/tool-options.svg);
|
|
|
|
display: block;
|
2016-11-18 21:02:21 +00:00
|
|
|
margin: 4px 4px 0;
|
2016-04-06 15:23:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.theme-firebug #toolbox-tab-options:not([selected]):hover::before {
|
|
|
|
filter: brightness(80%);
|
|
|
|
}
|
|
|
|
|
2016-11-18 21:02:21 +00:00
|
|
|
/* Element picker */
|
|
|
|
.theme-firebug #toolbox-buttons-start {
|
|
|
|
border: none;
|
|
|
|
}
|
|
|
|
|
2016-04-06 15:23:46 +00:00
|
|
|
/* Toolbar */
|
|
|
|
|
|
|
|
.theme-firebug .theme-toolbar,
|
|
|
|
.theme-firebug toolbar,
|
|
|
|
.theme-firebug .devtools-toolbar {
|
2017-01-18 05:35:00 +00:00
|
|
|
background: var(--theme-toolbar-background) !important;
|
2016-04-06 15:23:46 +00:00
|
|
|
padding-inline-end: 4px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The vbox for panel content also uses theme-toolbar class from some reason
|
|
|
|
but it shouldn't have the padding as defined above, so fix it here */
|
|
|
|
.theme-firebug #toolbox-deck > .toolbox-panel.theme-toolbar {
|
|
|
|
padding-inline-end: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Space around toolbar buttons */
|
|
|
|
.theme-firebug .devtools-toolbar {
|
2017-02-14 19:34:54 +00:00
|
|
|
padding: 2px 3px;
|
2016-04-06 15:23:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/* The height is the same for all toolbars and side panels tabs */
|
|
|
|
.theme-firebug .theme-toolbar,
|
|
|
|
.theme-firebug .devtools-sidebar-tabs tabs,
|
|
|
|
.theme-firebug .devtools-toolbar {
|
|
|
|
height: 28px !important;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* Do not set the fixed height for rule viewtoolbar. This toolbar
|
|
|
|
is changing its height to show pseudo classes. */
|
|
|
|
.theme-firebug #ruleview-toolbar-container {
|
|
|
|
height: auto !important;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* The Inspector panel side panels are using both
|
|
|
|
.devtools-toolbar and .theme-toolbar. We want the
|
|
|
|
proportional font for all labels in these toolbars */
|
|
|
|
.theme-firebug .devtools-toolbar label,
|
|
|
|
.theme-firebug .devtools-toolbar .label,
|
|
|
|
.theme-firebug .theme-toolbar label,
|
|
|
|
.theme-firebug .theme-toolbar .label {
|
|
|
|
font-family: var(--proportional-font-family);
|
|
|
|
}
|
|
|
|
|
2016-11-18 21:02:21 +00:00
|
|
|
/* Make sure the toolbar buttons shrink nicely. */
|
|
|
|
|
|
|
|
#toolbox-buttons-end {
|
|
|
|
background-image: linear-gradient(rgba(253, 253, 253, 0.2), rgba(253, 253, 253, 0));
|
|
|
|
}
|