mirror of
https://github.com/roytam1/UXP.git
synced 2026-05-26 13:58:49 +00:00
Moonchild
d388e478a0
Vim control lines were re-introduced or not entirely cleaned up. This nukes them again. Removing from the rest of js, caps, chrome, config, devtools, docshell, image, intl. More to come.
670 lines
13 KiB
CSS
670 lines
13 KiB
CSS
/* 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/. */
|
|
|
|
/* Sources and breakpoints pane */
|
|
|
|
#sources-pane[selectedIndex="0"] + #sources-and-editor-splitter {
|
|
border-color: transparent;
|
|
}
|
|
|
|
#sources-pane > tabs {
|
|
border-inline-end: 1px solid;
|
|
}
|
|
|
|
#sources-pane .devtools-toolbar {
|
|
border: none; /* Remove the devtools-toolbar bottom border. */
|
|
border-inline-end: 1px solid;
|
|
}
|
|
|
|
#sources-pane > tabs,
|
|
#sources-pane .devtools-toolbar {
|
|
border-inline-end-color: var(--theme-splitter-color);
|
|
}
|
|
|
|
/* Sources and breakpoints list */
|
|
|
|
.dbg-source-item {
|
|
padding: 2px 0px;
|
|
}
|
|
|
|
.dbg-wasm-item .icon {
|
|
display: block;
|
|
background-image: url(chrome://devtools/skin/images/webconsole.svg);
|
|
background-repeat: no-repeat;
|
|
background-size: 72px 60px;
|
|
/* show warning icon */
|
|
background-position: -24px -24px;
|
|
width: 10px;
|
|
height: 10px;
|
|
position: absolute;
|
|
margin-inline-start: -15px;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.dbg-breakpoint-line {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.dbg-breakpoint-text {
|
|
padding-inline-start: 6px;
|
|
font-style: italic;
|
|
font-size: 90%;
|
|
}
|
|
|
|
.dbg-breakpoint-checkbox {
|
|
width: 16px;
|
|
height: 16px;
|
|
margin: 2px;
|
|
}
|
|
|
|
/* Firebug theme uses breakpoint icon istead of a checkbox */
|
|
|
|
.theme-firebug #sources-pane .dbg-breakpoint-checkbox .checkbox-check {
|
|
-moz-appearance: none;
|
|
border: none;
|
|
background: url(chrome://devtools/skin/images/firebug/breakpoint.svg) no-repeat 50% 50%;
|
|
}
|
|
|
|
.theme-firebug #sources-pane .dbg-breakpoint-checkbox:not([checked="true"]) > .checkbox-check,
|
|
.theme-firebug #sources-pane .dbg-breakpoint-checkbox:not([checked="true"]) ~ * {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.theme-firebug #sources-pane .dbg-breakpoint-checkbox {
|
|
padding-inline-end: 0;
|
|
margin-inline-end: 0;
|
|
}
|
|
|
|
.dbg-breakpoint-condition-thrown-message {
|
|
display: none;
|
|
color: var(--theme-highlight-red);
|
|
}
|
|
|
|
.dbg-breakpoint.dbg-breakpoint-condition-thrown .dbg-breakpoint-condition-thrown-message {
|
|
display: block;
|
|
padding-inline-start: 0;
|
|
}
|
|
|
|
/* Sources toolbar */
|
|
|
|
#sources-toolbar > .devtools-toolbarbutton,
|
|
#sources-controls > .devtools-toolbarbutton {
|
|
min-width: 32px;
|
|
}
|
|
|
|
#black-box {
|
|
list-style-image: url(images/item-toggle.svg);
|
|
}
|
|
|
|
.theme-firebug #black-box {
|
|
list-style-image: url(images/firebug/debugger-blackbox.svg);
|
|
}
|
|
|
|
#pretty-print {
|
|
list-style-image: url(images/tool-styleeditor.svg);
|
|
}
|
|
|
|
.theme-firebug #pretty-print {
|
|
list-style-image: url(images/firebug/debugger-prettyprint.svg);
|
|
}
|
|
|
|
#toggle-breakpoints {
|
|
list-style-image: url(images/debugger-toggleBreakpoints.svg);
|
|
-moz-image-region: rect(0,32px,16px,16px);
|
|
}
|
|
|
|
.theme-firebug #toggle-breakpoints {
|
|
list-style-image: url(images/firebug/debugger-toggleBreakpoints.svg);
|
|
-moz-image-region: unset;
|
|
}
|
|
|
|
#toggle-breakpoints[checked] {
|
|
-moz-image-region: rect(0,16px,16px,0);
|
|
}
|
|
|
|
#toggle-breakpoints[checked] > image {
|
|
/* This button has a special checked image, don't make it blue */
|
|
filter: none;
|
|
}
|
|
|
|
#sources .black-boxed {
|
|
color: rgba(128,128,128,0.4);
|
|
}
|
|
|
|
#sources .selected .black-boxed {
|
|
color: rgba(255,255,255,0.4);
|
|
}
|
|
|
|
#sources .black-boxed ~ .dbg-breakpoint {
|
|
display: none;
|
|
}
|
|
|
|
/* Debugger unblackbox button */
|
|
|
|
#black-boxed-message-button > .button-box > .button-icon {
|
|
width: 16px;
|
|
height: 16px;
|
|
background-image: url(images/item-toggle.svg);
|
|
background-position: 0 0;
|
|
background-size: cover;
|
|
}
|
|
|
|
/* Black box message and source progress meter */
|
|
|
|
#black-boxed-message,
|
|
#source-progress-container {
|
|
/* Prevent the container deck from aquiring the size from this message. */
|
|
min-width: 1px;
|
|
min-height: 1px;
|
|
}
|
|
|
|
#source-progress {
|
|
min-height: 2em;
|
|
min-width: 40em;
|
|
}
|
|
|
|
#black-boxed-message-label,
|
|
#black-boxed-message-button {
|
|
text-align: center;
|
|
font-size: 120%;
|
|
}
|
|
|
|
#black-boxed-message-button {
|
|
margin-top: 1em;
|
|
padding: .25em;
|
|
}
|
|
|
|
/* Breadcrumbs stack frames view */
|
|
|
|
.dbg-stackframe-details {
|
|
padding-inline-start: 4px;
|
|
}
|
|
|
|
/* Classic stack frames view */
|
|
|
|
.dbg-classic-stackframe {
|
|
display: block;
|
|
}
|
|
|
|
.dbg-classic-stackframe-title {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.dbg-classic-stackframe-details:-moz-locale-dir(ltr) {
|
|
float: right;
|
|
}
|
|
|
|
.dbg-classic-stackframe-details:-moz-locale-dir(rtl) {
|
|
float: left;
|
|
}
|
|
|
|
.dbg-classic-stackframe-details-url {
|
|
max-width: 90%;
|
|
text-align: end;
|
|
}
|
|
|
|
.dbg-classic-stackframe-details-url {
|
|
color: var(--theme-content-color1);
|
|
}
|
|
|
|
.dbg-classic-stackframe-details-sep {
|
|
color: var(--theme-body-color-alt)
|
|
}
|
|
|
|
.dbg-classic-stackframe-details-line {
|
|
color: var(--theme-highlight-bluegrey);
|
|
}
|
|
|
|
#callstack-list .selected label {
|
|
/* Text inside a selected item should not be custom colored. */
|
|
color: inherit !important;
|
|
}
|
|
|
|
/* Tracer */
|
|
|
|
#trace {
|
|
list-style-image: url(images/tracer-icon.png);
|
|
}
|
|
|
|
@media (min-resolution: 1.1dppx) {
|
|
#trace {
|
|
list-style-image: url(images/tracer-icon@2x.png);
|
|
}
|
|
}
|
|
|
|
#clear-tracer {
|
|
/* Make this button as narrow as the text inside it. */
|
|
min-width: 1px;
|
|
}
|
|
|
|
.trace-name {
|
|
padding-inline-start: 4px;
|
|
}
|
|
|
|
/* Tracer dark theme */
|
|
|
|
.theme-dark .trace-item {
|
|
color: var(--theme-selection-color);
|
|
}
|
|
|
|
.theme-dark .trace-item.black-boxed {
|
|
color: rgba(128,128,128,0.4);
|
|
}
|
|
|
|
.theme-dark .trace-item.selected-matching {
|
|
background-color: rgba(86, 117, 185, .4); /* Select highlight blue at 40% alpha */
|
|
}
|
|
|
|
.theme-dark .selected > .trace-item {
|
|
background-color: rgba(86, 117, 185, .6); /* Select highlight blue at 60% alpha */
|
|
}
|
|
|
|
.trace-call {
|
|
color: var(--theme-highlight-blue);
|
|
}
|
|
|
|
.trace-return,
|
|
.trace-yield {
|
|
color: var(--theme-highlight-green);
|
|
}
|
|
|
|
.trace-throw {
|
|
color: var(--theme-highlight-red);
|
|
}
|
|
|
|
.trace-param {
|
|
color: var(--theme-content-color1);
|
|
}
|
|
|
|
.theme-dark .trace-syntax {
|
|
color: var(--theme-content-color2);
|
|
}
|
|
|
|
/* Tracer light theme */
|
|
.theme-light .trace-item {
|
|
color: var(--theme-content-color1);
|
|
}
|
|
|
|
.theme-light .trace-item.black-boxed {
|
|
color: rgba(128,128,128,0.4);
|
|
}
|
|
|
|
.theme-light .trace-item.selected-matching {
|
|
background-color: rgba(76,158,217,.4); /* Select highlight blue at 40% alpha */
|
|
}
|
|
|
|
.theme-light .selected > .trace-item {
|
|
background-color: rgba(76,158,217,.6); /* Select highlight blue at 60% alpha */
|
|
}
|
|
|
|
#tracer-traces .selected label {
|
|
/* Text inside a selected item should not be custom colored. */
|
|
color: inherit !important;
|
|
}
|
|
|
|
/* Watch expressions view */
|
|
|
|
#expressions {
|
|
min-height: 10px;
|
|
max-height: 125px;
|
|
}
|
|
|
|
.dbg-expression {
|
|
height: 20px;
|
|
}
|
|
|
|
.dbg-expression-arrow {
|
|
background-image: var(--theme-command-line-image-focus);
|
|
width: 16px;
|
|
height: 16px;
|
|
margin: 2px;
|
|
}
|
|
|
|
.dbg-expression-input {
|
|
color: inherit;
|
|
}
|
|
|
|
.dbg-expression-button {
|
|
-moz-appearance: none;
|
|
border: none;
|
|
background: none;
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.dbg-expression-button {
|
|
color: var(--theme-highlight-blue);
|
|
}
|
|
|
|
/* Event listeners view */
|
|
|
|
.dbg-event-listener-type {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.dbg-event-listener-location {
|
|
color: var(--theme-content-color1);
|
|
}
|
|
|
|
.dbg-event-listener-separator {
|
|
color: var(--theme-body-color-alt);
|
|
}
|
|
|
|
.dbg-event-listener-targets {
|
|
color: var(--theme-highlight-bluegrey);
|
|
}
|
|
|
|
.theme-dark #event-listeners .selected {
|
|
/* Selected items shouldn't be displayed differently. */
|
|
background: none;
|
|
color: #fff;
|
|
}
|
|
|
|
.theme-light #event-listeners .selected {
|
|
/* Selected items shouldn't be displayed differently. */
|
|
background: none;
|
|
color: #000;
|
|
}
|
|
|
|
/* Searchbox and the search operations help panel */
|
|
|
|
#searchbox {
|
|
min-width: 220px;
|
|
margin-inline-start: 1px;
|
|
}
|
|
|
|
#filter-label {
|
|
margin-inline-start: 2px;
|
|
}
|
|
|
|
#searchbox-panel-operators {
|
|
margin-top: 5px;
|
|
margin-bottom: 8px;
|
|
margin-inline-start: 2px;
|
|
}
|
|
|
|
.searchbox-panel-operator-button {
|
|
min-width: 26px;
|
|
margin-top: 0;
|
|
margin-bottom: 0;
|
|
margin-inline-start: 2px;
|
|
margin-inline-end: 6px;
|
|
text-align: center;
|
|
}
|
|
|
|
.searchbox-panel-operator-label {
|
|
padding-bottom: 2px;
|
|
}
|
|
|
|
/* Searchbox results panel */
|
|
|
|
#results-panel {
|
|
border: none;
|
|
}
|
|
|
|
.results-panel-item {
|
|
padding: 6px 8px;
|
|
border-top: 1px solid rgba(128,128,128,0.2);
|
|
}
|
|
|
|
.results-panel-item:first-of-type {
|
|
border-top: none;
|
|
}
|
|
|
|
.results-panel-item-label {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.results-panel-item-label-before {
|
|
padding-inline-end: 6px;
|
|
}
|
|
|
|
.theme-dark .results-panel-item-label {
|
|
color: var(--theme-selection-color);
|
|
}
|
|
|
|
.theme-light .results-panel-item-label {
|
|
color: var(--theme-body-color);
|
|
}
|
|
|
|
.results-panel-item-label-before {
|
|
color: var(--theme-highlight-bluegrey);
|
|
}
|
|
|
|
.results-panel-item-label-below {
|
|
color: var(--theme-content-color3);
|
|
}
|
|
|
|
#results-panel .selected label {
|
|
/* Text inside a selected item should not be custom colored. */
|
|
color: inherit !important;
|
|
}
|
|
|
|
/* Sources search view */
|
|
|
|
#globalsearch {
|
|
min-height: 10px;
|
|
max-height: 50vh;
|
|
}
|
|
|
|
.dbg-results-header {
|
|
padding-inline-start: 6px;
|
|
}
|
|
|
|
.dbg-results-header-location {
|
|
font-weight: 600;
|
|
}
|
|
|
|
.dbg-results-header-match-count {
|
|
padding-inline-start: 6px;
|
|
}
|
|
|
|
.dbg-results-line-number {
|
|
min-width: 3em;
|
|
border-inline-end: 1px solid rgba(128,128,128,0.2);
|
|
padding-inline-end: 4px;
|
|
text-align: end;
|
|
}
|
|
|
|
.dbg-results-line-contents {
|
|
padding-inline-start: 4px;
|
|
}
|
|
|
|
.dbg-results-line-contents-string[match=true] {
|
|
background-color: rgba(255,255,0,0.2);
|
|
border: 1px solid rgba(128,128,128,0.7);
|
|
border-radius: 4px;
|
|
margin-top: -1px !important;
|
|
margin-bottom: -1px !important;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.dbg-results-line-contents-string[match=true][focusing] {
|
|
transition: transform 0.3s ease-in-out;
|
|
}
|
|
|
|
.dbg-results-line-contents-string[match=true][focused] {
|
|
transition-duration: 0.1s;
|
|
transform: scale(1.75, 1.75);
|
|
}
|
|
|
|
.dbg-source-results:not(.selected):hover {
|
|
background-color: var(--theme-sidebar-background);
|
|
}
|
|
|
|
.dbg-results-header {
|
|
background-color: var(--theme-tab-toolbar-background);
|
|
}
|
|
|
|
.theme-dark .dbg-results-header {
|
|
color: var(--theme-content-color1);
|
|
}
|
|
|
|
.theme-light .dbg-results-header {
|
|
color: var(--theme-content-color3);
|
|
}
|
|
|
|
.theme-dark .dbg-search-result:hover {
|
|
background-color: rgba(86, 117, 185, .2); /* Select highlight blue at 40% alpha */
|
|
}
|
|
|
|
.theme-light .dbg-search-result:hover {
|
|
background-color: rgba(76,158,217,.2); /* Select highlight blue at 40% alpha */
|
|
}
|
|
|
|
.dbg-results-header-match-count {
|
|
color: var(--theme-content-color3);
|
|
}
|
|
|
|
.dbg-results-line-number {
|
|
background-color: var(--theme-tab-toolbar-background);
|
|
color: var(--theme-body-color-alt);
|
|
}
|
|
|
|
.dbg-results-line-contents-string {
|
|
color: var(--theme-body-color-alt);
|
|
}
|
|
|
|
.theme-dark .dbg-results-line-contents-string[match=true] {
|
|
color: var(--theme-selection-color);
|
|
}
|
|
|
|
.theme-light .dbg-results-line-contents-string[match=true] {
|
|
color: var(--theme-body-color);
|
|
}
|
|
|
|
/* Toolbar controls */
|
|
|
|
#resume {
|
|
list-style-image: url(images/pause.svg);
|
|
}
|
|
|
|
#resume[checked] {
|
|
list-style-image: url(images/play.svg);
|
|
}
|
|
|
|
.theme-firebug #resume {
|
|
list-style-image: url(images/firebug/pause.svg);
|
|
}
|
|
|
|
.theme-firebug #resume[checked] {
|
|
list-style-image: url(images/firebug/play.svg);
|
|
}
|
|
|
|
#resume[break-on-next] {
|
|
background: var(--theme-highlight-lightorange);
|
|
}
|
|
|
|
#step-over {
|
|
list-style-image: url(images/debugger-step-over.svg);
|
|
}
|
|
|
|
#step-in {
|
|
list-style-image: url(images/debugger-step-in.svg);
|
|
}
|
|
|
|
#step-out {
|
|
list-style-image: url(images/debugger-step-out.svg);
|
|
}
|
|
|
|
.theme-firebug #step-over {
|
|
list-style-image: url(images/firebug/debugger-step-over.svg);
|
|
}
|
|
|
|
.theme-firebug #step-in {
|
|
list-style-image: url(images/firebug/debugger-step-in.svg);
|
|
}
|
|
|
|
.theme-firebug #step-out {
|
|
list-style-image: url(images/firebug/debugger-step-out.svg);
|
|
}
|
|
|
|
#instruments-pane-toggle {
|
|
list-style-image: var(--theme-pane-collapse-image);
|
|
}
|
|
|
|
#instruments-pane-toggle.pane-collapsed {
|
|
list-style-image: var(--theme-pane-expand-image);
|
|
}
|
|
|
|
/* Horizontal vs. vertical layout */
|
|
|
|
#vertical-layout-panes-container {
|
|
min-height: 35vh;
|
|
max-height: 80vh;
|
|
}
|
|
|
|
#body[layout=vertical] #sources-pane > tabs {
|
|
border-inline-end: none;
|
|
}
|
|
|
|
#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,
|
|
#body[layout=vertical] .side-menu-widget-empty-text {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
#body[layout=vertical] .side-menu-widget-item-arrow {
|
|
background-image: none !important;
|
|
}
|
|
|
|
#body[layout=vertical] .side-menu-widget-group,
|
|
#body[layout=vertical] .side-menu-widget-item {
|
|
margin-inline-end: 0;
|
|
}
|
|
|
|
/* Firebug theme customization of source group title */
|
|
.theme-firebug #sources-pane .side-menu-widget-group-title {
|
|
border-bottom: none;
|
|
padding: 2px 4px;
|
|
background: var(--theme-header-background);
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* Sections titles (toolbars) in Variables panel they have different height */
|
|
.theme-firebug #variables-tabpanel .title.devtools-toolbar {
|
|
display: -moz-box;
|
|
height: 20px !important;
|
|
}
|
|
|
|
/* Firebug theme support for the Callstack Panel */
|
|
|
|
.theme-firebug #callstack-list {
|
|
font-family: var(--proportional-font-family);
|
|
}
|
|
|
|
.theme-firebug #callstack-list .dbg-classic-stackframe-title {
|
|
color: var(--theme-content-color2);
|
|
font-weight: normal;
|
|
font-family: monospace;
|
|
}
|
|
|
|
.theme-firebug #callstack-list .side-menu-widget-item {
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
}
|
|
|
|
.theme-firebug #callstack-list .dbg-classic-stackframe-details-url,
|
|
.theme-firebug #callstack-list .dbg-classic-stackframe-details-sep,
|
|
.theme-firebug #callstack-list .dbg-classic-stackframe-details-line {
|
|
color: blue;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.theme-firebug #callstack-list .side-menu-widget-item {
|
|
margin: 0 4px;
|
|
}
|
|
|
|
.theme-firebug #callstack-list .side-menu-widget-item.selected {
|
|
color: var(--theme-selection-color);
|
|
}
|
|
|
|
.theme-firebug #callstack-list .side-menu-widget-item:first-child {
|
|
border-top: none;
|
|
}
|