}
#downloads-button[cui-areatype="menu-panel"],
-#downloads-indicator[cui-areatype="menu-panel"],
:-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #downloads-button {
-moz-image-region: rect(0px, 256px, 32px, 224px);
}
#downloads-button[cui-areatype="menu-panel"]:hover,
-#downloads-indicator[cui-areatype="menu-panel"]:hover,
:-moz-any(#customization-palette, #panelUI-contents) > toolbarpaletteitem[place="palette"] > #downloads-button:hover {
-moz-image-region: rect(32px, 256px, 64px, 224px);
}
list-style-image: url("chrome://browser/skin/Secure24.png");
}
+#identity-popup-help-icon {
+ border: none;
+ margin: 7px 0 0 -3px;
+ background: none;
+ min-width: 0;
+ list-style-image: url("chrome://global/skin/icons/question-16.png");
+ cursor: pointer;
+}
+
+#identity-popup-help-icon > .button-box > .button-text {
+ display: none;
+}
+
+#identity-popup-help-icon > .button-box > .button-icon {
+ height: 16px;
+ width: 16px;
+}
+
+#identity-popup-help-icon:-moz-focusring {
+ outline: 1px dotted;
+ outline-offset: 1px;
+}
+
#identity-popup-more-info-button {
margin-top: 6px;
margin-bottom: 0;
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
+ outline: 0;
}
.property-value {
background-size: 5px 8px;
background-position: 2px center;
padding-left: 10px;
+ outline: 0;
}
.other-property-value {
cursor: pointer;
float: right;
}
+
+.computedview-colorswatch {
+ display: inline-block;
+ border-radius: 50%;
+ width: 1em;
+ height: 1em;
+ vertical-align: text-top;
+ -moz-margin-end: 5px;
+}
background-color: rgba(0,0,0,0.5);
}
+.theme-bg-contrast { /* contrast bg color to attract attention on a container */
+ background: #404000;
+}
+
.theme-link { /* original: blue */
color: #3333FF;
}
.theme-fg-color7 { /* original: Red */
color: #FF0000;
}
+
+.theme-fg-contrast { /* To be used for text on theme-bg-contrast */
+ color: #FFCF00;
+}
+
+.ruleview-colorswatch,
+.computedview-colorswatch,
+.markupview-colorswatch {
+/* box-shadow: 0 0 0 1px rgba(0,0,0,0.5); */
+}
min-width: 50px;
}
-#sources-pane + .devtools-side-splitter {
+#sources-and-editor-splitter {
-moz-border-start-color: transparent;
}
-.side-menu-widget-item-checkbox {
+#pretty-print {
+ min-width: 0;
+ font-weight: bold;
+}
+
+#sources .side-menu-widget-item-checkbox {
-moz-margin-end: -6px;
padding: 0;
opacity: 0;
/* Only show the checkbox when the source is hovered over, is selected, or if it
* is not checked. */
-.side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
-.side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
-.side-menu-widget-item-checkbox:not([checked]) {
+#sources .side-menu-widget-item:hover > .side-menu-widget-item-checkbox,
+#sources .side-menu-widget-item.selected > .side-menu-widget-item-checkbox,
+#sources .side-menu-widget-item-checkbox:not([checked]) {
opacity: 1;
transition: opacity .15s ease-out 0s;
}
-.side-menu-widget-item-checkbox > .checkbox-check {
+#sources .side-menu-widget-item-checkbox > .checkbox-check {
-moz-appearance: none;
background: none;
background-image: url("itemToggle.png");
border: 0;
}
-.side-menu-widget-item-checkbox[checked] > .checkbox-check {
+#sources .side-menu-widget-item-checkbox[checked] > .checkbox-check {
background-position: 0 0;
}
-.side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents {
+#sources .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents {
color: #8050B0;
}
-.side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents > .dbg-breakpoint {
+#sources .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-contents > .dbg-breakpoint {
display: none;
}
-/* Black box message */
+#sources .side-menu-widget-item.selected > .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
+ background-image: none;
+/* box-shadow: inset -1px 0 0 #222426; */
+}
+
+#sources .side-menu-widget-item.selected > .side-menu-widget-item-checkbox:not([checked]) ~ .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
+ background-image: none;
+/* box-shadow: inset 1px 0 0 #222426; */
+}
+
+/* Black box message and source progress meter */
-#black-boxed-message {
+#black-boxed-message,
+#source-progress-container {
+ background-color: #A09090;
/* Prevent the container deck from aquiring the height from this message. */
min-height: 1px;
- background-color: #A09090;
- padding: 25vh 0;
color: #000000;
}
+#source-progress {
+ min-height: 2em;
+ min-width: 40em;
+}
+
#black-boxed-message-label,
#black-boxed-message-button {
text-align: center;
margin: 2px;
}
+/* Instruments pane (watch expressions, variables, event listeners...) */
+
+#instruments-pane > tabs > tab {
+ min-height: 25px !important;
+ padding: 0 !important;
+}
+
+#instruments-pane > tabpanels > tabpanel {
+ background: #000000;
+}
+
/* Watch expressions view */
#expressions {
.dbg-expression-arrow {
width: 16px;
height: auto;
- background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16);
+ background: -moz-image-rect(url("commandline-icon.png"), 0, 32, 16, 16);
}
.dbg-expression-input {
-moz-padding-start: 2px !important;
}
+/* Event listeners view */
+
+.dbg-event-listener {
+ padding: 4px 8px;
+}
+
+.dbg-event-listener-type {
+ font-weight: 600;
+}
+
+.dbg-event-listener-separator {
+ color: #A09090;
+}
+
+.dbg-event-listener-targets {
+ color: #9C9CFF;
+}
+
+.dbg-event-listener-location {
+ color: #E7ADE7;
+}
+
/* Searchbox and the search operations help panel */
.devtools-searchinput {
transform: scale(1.75, 1.75);
}
-/* Toolbar Controls */
+/* Toolbar controls */
#toggle-panes {
list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
#instruments-pane-toggle:hover:active {
-moz-image-region: rect(0px,32px,16px,16px);
}
+
+/* Horizontal vs. vertical layout */
+
+#vertical-layout-panes-container {
+ min-height: 35vh;
+ max-height: 80vh;
+}
+
+#body[layout=vertical] #instruments-pane {
+ margin: 0 !important;
+ /* To prevent all the margin hacks to hide the sidebar. */
+}
+
+#body[layout=vertical] .side-menu-widget-container {
+ box-shadow: none !important;
+}
+
+#body[layout=vertical] .side-menu-widget-item-arrow {
+ background-image: none !important;
+}
-/* 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/. */
-
-/* According to:
- * https://bugzilla.mozilla.org/show_bug.cgi?id=715472#c17
- */
-.theme-body {
- background: #000000;
- color: #FF9F00;
-}
-
-.theme-twisty {
- cursor: pointer;
- width: 14px;
- height: 14px;
- background-repeat: no-repeat;
- background-image: url("chrome://browser/skin/devtools/controls.png");
- background-position: 0 -14px;
-}
-
-.theme-twisty:-moz-focusring {
- outline-style: none;
-}
-
-.theme-twisty[open] {
- background-position: -14px -14px;
-}
-
-.theme-checkbox {
- display: inline-block;
- border: 0;
- width: 14px;
- height: 14px;
- padding: 0;
- outline: none;
- background-image: url("chrome://browser/skin/devtools/controls.png");
- background-position: 0 0;
-}
-
-.theme-checkbox[checked] {
- background-position: -14px 0;
-}
-
-.theme-selected {
- background: #004242;
-}
-
-.theme-bg-darker {
- background-color: rgba(0,0,0,0.5);
-}
-
-.theme-link { /* original: blue */
- color: #3333FF;
-}
-
-.theme-comment { /* original: grey */
- color: #A09090;
-}
-
-.theme-gutter {
- background-color: #000000;
- color: #FF9F00;
- border-color: #9C9CFF;
-}
-
-.theme-separator { /* original: grey */
- border-color: #8050B0;
-}
-
-.theme-fg-color1 { /* original: green */
- color: #008484;
-}
-
-.theme-fg-color2 { /* original: blue */
- color: #9C9CFF;
-}
-
-.theme-fg-color3 { /* original: pink/lavender */
- color: #E7ADE7;
-}
-
-.theme-fg-color4 { /* original: purple/violet */
- color: #C09070;
-}
-
-.theme-fg-color5 { /* original: Yellow */
- color: #FFCF00;
-}
-
-.theme-fg-color6 { /* original: Orange */
- color: #FF9F00;
-}
-
-.theme-fg-color7 { /* original: Red */
- color: #FF0000;
-}
+/* In LCARStrek, we do not support dark and light devtools themes, it's all one. */
+@import url("dark-theme.css");
-moz-margin-start: 35px;
}
+.ruleview-colorswatch {
+ border-radius: 50%;
+ width: 1em;
+ height: 1em;
+ vertical-align: text-top;
+ -moz-margin-end: 5px;
+}
+
.ruleview-overridden {
text-decoration: line-through;
}
* License, v. 2.0. If a copy of the MPL was not distributed with this\r
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */\r
\r
+/* === EQUALS scratchpad.inc.css === */\r
+\r
#scratchpad-sidebar > tabs {\r
height: 0;\r
border: none;\r
}\r
+\r
+#sp-toolbar {\r
+ border: none;\r
+}\r
color: #FF9F00;
}
-.side-menu-widget-container[with-arrow=true]:-moz-locale-dir(ltr),
-.side-menu-widget-group[with-arrow=true]:-moz-locale-dir(ltr),
-.side-menu-widget-item[with-arrow=true]:-moz-locale-dir(ltr) {
+.side-menu-widget-container[with-arrows=true]:-moz-locale-dir(ltr) {
}
-.side-menu-widget-container[with-arrow=true]:-moz-locale-dir(rtl),
-.side-menu-widget-group[with-arrow=true]:-moz-locale-dir(rtl),
-.side-menu-widget-item[with-arrow=true]:-moz-locale-dir(rtl) {
+.side-menu-widget-container[with-arrows=true]:-moz-locale-dir(rtl) {
}
.side-menu-widget-group-title {
- background-color: #A09090;
padding: 4px;
+
+ background-color: #A09090;
color: #000000;
- transition-property: background-color;
- transition-duration: 0.3s;
}
-.side-menu-widget-group:hover > .side-menu-widget-group-title {
- background-color: #FFCF00;
+.side-menu-widget-group-checkbox {
+ margin: 0;
+ padding: 0;
}
.side-menu-widget-item {
border-top: 1px solid #9C9CFF;
margin-top: -1px;
margin-bottom: -1px;
- cursor: pointer;
}
.side-menu-widget-item:last-of-type {
.side-menu-widget-item-label {
padding: 4px 0px;
- cursor: inherit;
}
.side-menu-widget-item-arrow {
width: 8px;
}
+.side-menu-widget-item-checkbox {
+ -moz-margin-start: 4px;
+ -moz-margin-end: -6px;
+}
+
.side-menu-widget-item-other {
background-color: #000000;
margin: 0 -4px;
}
.side-menu-widget-empty-notice-container {
- background-color: #000000;
padding: 12px;
- color: #A09090;
+
+ background-color: #000000;
font-weight: 600;
+ color: #A09090;
}
/* VariablesView */
/* Custom configurable/enumerable/writable or frozen/sealed/extensible
* variables and properties */
-.variable-or-property[non-enumerable]:not([self]):not([exception]):not([return]) > .title > .name {
+.variable-or-property[non-enumerable]:not([self]):not([exception]):not([return]):not([scope]) > .title > .name {
opacity: 0.5;
}
color: #008484;
}
+.variable-or-property[scope]:not(:focus) > .title > .name {
+ color: #9C9CFF;
+}
+
/* Variables and properties tooltips */
.variable-or-property > tooltip > label {
/*** Status and progress indicator ***/
-#downloads-indicator-anchor {
- /* Makes the outermost stack element positioned, so that its contents are
- rendered over the main browser window in the Z order. This is required by
- the animated event notification. */
+#downloads-animation-container {
+ min-height: 1px;
+ min-width: 1px;
+ height: 1px;
+ margin-bottom: -1px;
+ /* Makes the outermost animation container element positioned, so that its
+ contents are rendered over the main browser window in the Z order.
+ This is required by the animated event notification. */
position: relative;
+ /* The selected tab may overlap #downloads-indicator-notification */
+ z-index: 5;
}
/*** Main indicator icon ***/
min-height: 18px;
}
-#downloads-indicator:hover > #downloads-indicator-anchor > #downloads-indicator-icon,
-#downloads-indicator[open="true"] > #downloads-indicator-anchor > #downloads-indicator-icon,
-#downloads-indicator[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-icon,
#downloads-button:hover > #downloads-indicator-anchor > #downloads-indicator-icon,
#downloads-button[open="true"] > #downloads-indicator-anchor > #downloads-indicator-icon,
#downloads-button[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-icon {
0, 108, 18, 90) center no-repeat;*/
}
-#downloads-indicator[attention] > #downloads-indicator-anchor > #downloads-indicator-icon,
#downloads-button[attention] > #downloads-indicator-anchor > #downloads-indicator-icon {
background-image: url("chrome://browser/skin/downloads/download-glow.png");
}
/* In the next few rules, we use :not([counter]) as a shortcut that is
equivalent to -moz-any([progress], [paused]). */
-#downloads-indicator:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
background: -moz-image-rect(url("chrome://browser/skin/FxToolbar.png"),
0, 108, 18, 90) center no-repeat;
background-size: 12px;
}
-#downloads-indicator:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
background-image: url("chrome://browser/skin/downloads/download-glow.png");
}
-#downloads-indicator:not([counter]):hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
-#downloads-indicator[open="true"]:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
-#downloads-indicator:not([counter])[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button:not([counter]):hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button[open="true"]:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button:not([counter])[attention]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
background-size: 16px;
background-position: center;
background-repeat: no-repeat;
+ width: 16px;
+ height: 16px;
}
@keyframes downloadsIndicatorNotificationStartRight {
to { opacity: 0; transform: translate(0) scale(1); }
}
-#downloads-indicator[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification,
-#downloads-button[notification="start"] > #downloads-indicator-anchor > #downloads-indicator-notification {
+#downloads-notification-anchor[notification="start"] > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-start.png");
animation-name: downloadsIndicatorNotificationStartRight;
animation-duration: 1s;
}
-#downloads-indicator[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification,
-#downloads-button[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-anchor > #downloads-indicator-notification {
+#downloads-notification-anchor[notification="start"]:-moz-locale-dir(rtl) > #downloads-indicator-notification {
animation-name: downloadsIndicatorNotificationStartLeft;
}
to { opacity: 0; transform: scale(8); }
}
-#downloads-indicator[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification,
-#downloads-button[notification="finish"] > #downloads-indicator-anchor > #downloads-indicator-notification {
+#downloads-notification-anchor[notification="finish"] > #downloads-indicator-notification {
background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
animation-name: downloadsIndicatorNotificationFinish;
animation-duration: 1s;
0 1px 1.5px rgba(0,0,0,.5);*/
}
-#downloads-indicator[counter]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
-#downloads-indicator[counter][open="true"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button[counter]:hover > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter,
#downloads-button[counter][open="true"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter {
color: #000000;
border-radius: 0 2px 2px 0;
}
-#downloads-indicator[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-bar,
#downloads-button[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-bar {
background-color: #8050B0;
}
-#downloads-indicator[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-remainder,
#downloads-button[paused] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-progress > .progress-remainder {
background-color: #404048;
}
-toolbar[mode="full"] > #downloads-indicator > .toolbarbutton-text {
+toolbar[mode="full"] > #downloads-button > .toolbarbutton-text {
margin: 0;
text-align: center;
}
/* SCROLLBOX */
#newtab-scrollbox:not([page-disabled]) {
+ color: #FF9F00;
background-color: #000000;
}