first part of syncing LCARStrek with Firefox 34 windows theme changes
[themes.git] / LCARStrek / browser / devtools / debugger.css
CommitLineData
9099c61d
RK
1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
eec397be
RK
4
5window {
6 padding: 0;
7}
8
45dc7657 9/* === BEGIN debugger.inc.css === */
eec397be 10
45dc7657 11/* Sources and breakpoints pane */
de57e474 12
dfa34f73
RK
13#sources-pane[selectedIndex="0"] + #sources-and-editor-splitter {
14 border-color: transparent;
eec397be
RK
15}
16
45dc7657
RK
17#sources-pane > tabs {
18 -moz-border-end: 1px solid #9C9CFF; /* Match the splitter color. */
19}
20
2a8b2b48
RK
21#sources-toolbar > .devtools-toolbarbutton,
22#sources-controls > .devtools-toolbarbutton {
6568957a
RK
23 min-width: 32px;
24}
25
2a8b2b48
RK
26#black-box {
27 list-style-image: url("debugger-blackbox.png");
28}
29
dccbbf95
RK
30@media (min-resolution: 2dppx) {
31 #black-box {
32 list-style-image: url(debugger-blackbox@2x.png);
33 }
34}
35
3a0880a9 36#pretty-print {
3a0880a9
RK
37 font-weight: bold;
38}
39
2a8b2b48
RK
40#toggle-breakpoints {
41 list-style-image: url("debugger-toggleBreakpoints.png");
42}
43
dccbbf95
RK
44@media (min-resolution: 2dppx) {
45 #toggle-breakpoints {
46 list-style-image: url(debugger-toggleBreakpoints@2x.png);
47 }
48}
49
2a8b2b48 50#sources-toolbar .devtools-toolbarbutton:not([label]) {
7600e0b1 51 -moz-image-region: rect(0px, 16px, 16px, 0px);
fe524e0c
RK
52}
53
2a8b2b48
RK
54#sources-toolbar .devtools-toolbarbutton:not([label]):hover {
55 -moz-image-region: rect(16px, 16px, 32px, 0px);
56}
57
58#sources-toolbar .devtools-toolbarbutton:not([label])[checked] {
7600e0b1 59 -moz-image-region: rect(0px, 32px, 16px, 16px);
fe524e0c
RK
60}
61
2a8b2b48
RK
62#sources-toolbar .devtools-toolbarbutton:not([label])[checked]:hover {
63 -moz-image-region: rect(16px, 32px, 32px, 16px);
64}
65
dccbbf95
RK
66@media (min-resolution: 2dppx) {
67 #sources-toolbar .devtools-toolbarbutton:not([label]) {
68 -moz-image-region: rect(0px,32px,32px,0px);
69 }
70
71 #sources-toolbar .devtools-toolbarbutton:not([label]):hover {
72 -moz-image-region: rect(32px,32px,64px,0px);
73 }
74
75 #sources-toolbar .devtools-toolbarbutton:not([label])[checked] {
76 -moz-image-region: rect(0px,64px,32px,32px);
77 }
78
79 #sources-toolbar .devtools-toolbarbutton:not([label])[checked]:hover {
80 -moz-image-region: rect(32px,64px,64px,32px);
81 }
82}
83
7600e0b1 84#sources .black-boxed {
1b13529a
RK
85 color: #8050B0;
86}
87
45dc7657
RK
88#sources .selected > .black-boxed {
89 color: #000000;
90}
91
7600e0b1 92#sources .black-boxed > .dbg-breakpoint {
fe524e0c
RK
93 display: none;
94}
95
7600e0b1 96#sources .black-boxed + .side-menu-widget-item-arrow:-moz-locale-dir(ltr) {
3a0880a9
RK
97 background-image: none;
98/* box-shadow: inset -1px 0 0 #222426; */
99}
100
7600e0b1 101#sources .black-boxed + .side-menu-widget-item-arrow:-moz-locale-dir(rtl) {
3a0880a9
RK
102 background-image: none;
103/* box-shadow: inset 1px 0 0 #222426; */
104}
105
3d64e0ce
RK
106/* Debugger unblackbox button */
107
108#black-boxed-message-button > .button-box > .button-icon {
109 width: 16px;
110 height: 16px;
111 background-image: url("debugger-blackbox.png");
112 background-position: 0 0;
113 background-size: 32px 16px;
114 background-repeat: no-repeat;
115 -moz-margin-end: 5px;
116}
117
118@media (min-resolution: 2dppx) {
119 #black-boxed-message-button > .button-box > .button-icon {
120 background-image: url("debugger-blackbox@2x.png");
121 }
122}
123
3a0880a9 124/* Black box message and source progress meter */
fe524e0c 125
3a0880a9
RK
126#black-boxed-message,
127#source-progress-container {
128 background-color: #A09090;
dfa34f73
RK
129 /* Prevent the container deck from aquiring the size from this message. */
130 min-width: 1px;
fe524e0c 131 min-height: 1px;
fe524e0c
RK
132 color: #000000;
133}
134
3a0880a9
RK
135#source-progress {
136 min-height: 2em;
137 min-width: 40em;
138}
139
fe524e0c
RK
140#black-boxed-message-label,
141#black-boxed-message-button {
142 text-align: center;
143 font-size: 120%;
144}
145
146#black-boxed-message-button {
147 margin-top: 1em;
148 padding: .25em;
149}
150
dfa34f73
RK
151/* Tracer */
152
153#trace {
154 list-style-image: url("tracer-icon.png");
155 -moz-image-region: rect(0px,16px,16px,0px);
156}
157
158#trace:hover,
159#trace[checked] {
160 -moz-image-region: rect(0px,32px,16px,16px);
161}
162
dccbbf95
RK
163@media (min-resolution: 2dppx) {
164 #trace {
165 list-style-image: url(tracer-icon@2x.png);
166 -moz-image-region: rect(0px,32px,32px,0px);
167 }
168
169 #trace:hover,
170 #trace[checked] {
171 -moz-image-region: rect(0px,64px,32px,32px);
172 }
173}
174
dfa34f73
RK
175#clear-tracer {
176 /* Make this button as narrow as the text inside it. */
177 min-width: 1px;
178}
179
dfa34f73
RK
180.trace-name {
181 -moz-padding-start: 4px !important;
182}
183
dfa34f73
RK
184/* Tracer dark+light theme */
185
dfa34f73
RK
186.trace-item {
187 color: #FF9F00; /* Light foreground text */
188}
189
190.trace-item.selected-matching {
191 background-color: #004242; /* Select highlight blue at 40% alpha */
192}
193
194.selected > .trace-item {
195 background-color: #004242; /* Select highlight blue at 75% alpha */
196}
197
198.trace-call {
199 color: #9C9CFF; /* highlight blue */
200}
201
202.trace-return,
203.trace-yield {
204 color: #008484; /* highlight green */
205}
206
207.trace-throw {
208 color: #FF0000; /* highlight red */
209}
210
211.trace-param {
212 color: #E7ADE7; /* Content text light */
213}
214
215.trace-syntax {
216 color: #A09090; /* highlight grey */
217}
218
de57e474
RK
219/* Breadcrumbs stack frames view */
220
221.breadcrumbs-widget-item {
222 max-width: none;
223}
eec397be 224
f7774352
RK
225#stackframes {
226 min-height: 25px;
227}
228
82b4252f 229.dbg-stackframe-details {
eec397be 230 -moz-padding-start: 4px;
eec397be
RK
231}
232
de57e474
RK
233/* Classic stack frames view */
234
235.dbg-classic-stackframe {
236 display: block;
45dc7657 237 padding: 0 4px;
de57e474
RK
238}
239
240.dbg-classic-stackframe-title {
eec397be 241 font-weight: 600;
de57e474
RK
242 color: #9C9CFF;
243}
244
245.dbg-classic-stackframe-details:-moz-locale-dir(ltr) {
246 float: right;
247}
248
249.dbg-classic-stackframe-details:-moz-locale-dir(rtl) {
250 float: left;
eec397be
RK
251}
252
de57e474
RK
253.dbg-classic-stackframe-details-url {
254 max-width: 90%;
255 text-align: end;
256 color: #3333FF;
257}
258
259.dbg-classic-stackframe-details-sep {
260 color: #A09090;
261}
262
263.dbg-classic-stackframe-details-line {
264 color: #9C9CFF;
265}
266
267#callstack-list .side-menu-widget-item.selected label {
268 color: #FFCF00;
990cba4b
RK
269}
270
82b4252f 271/* Sources and breakpoints view */
889649fd 272
82b4252f 273.dbg-breakpoint {
7600e0b1 274 -moz-margin-start: 4px;
990cba4b
RK
275}
276
82b4252f 277.dbg-breakpoint-line {
889649fd
RK
278 font-weight: 600;
279}
280
281.dbg-breakpoint-text {
82b4252f
RK
282 -moz-margin-start: 10px !important;
283 font-style: italic;
1b13529a
RK
284 font-size: 90%;
285}
286
287.dbg-breakpoint-checkbox {
288 width: 16px;
289 height: 16px;
290 margin: 2px;
990cba4b
RK
291}
292
d2ce251d
RK
293/* Variable bubble view */
294
295.devtools-tooltip-simple-text.token-undefined,
296.devtools-tooltip-simple-text.token-null {
297 text-align: center;
298 color: #A09090 !important; /* Override the theme's color. */
299}
300
301.devtools-tooltip-simple-text.token-boolean {
302 text-align: center;
303 color: #9C9CFF !important;
304}
305
306.devtools-tooltip-simple-text.token-number {
307 text-align: center;
308 color: #E7ADE7 !important;
309}
310
311.devtools-tooltip-simple-text.token-string {
312 text-align: start;
313 color: #008484 !important;
314}
315
316.devtools-tooltip-simple-text.token-other {
317 text-align: center;
318 color: #FF9F00 !important;
319}
320
3a0880a9
RK
321/* Instruments pane (watch expressions, variables, event listeners...) */
322
de57e474 323#instruments-pane .side-menu-widget-container,
45dc7657 324#instruments-pane .side-menu-widget-empty-text {
de57e474 325/* box-shadow: none !important; */
3a0880a9
RK
326}
327
82b4252f 328/* Watch expressions view */
990cba4b
RK
329
330#expressions {
990cba4b 331 min-height: 10px;
56ab361a 332 max-height: 125px;
990cba4b
RK
333}
334
335.dbg-expression {
336 height: 20px;
990cba4b
RK
337}
338
339.dbg-expression-arrow {
dccbbf95 340 background-image: url("commandline-icon.png");
ed88669c 341 background-position: -16px 0;
dccbbf95
RK
342 background-repeat: no-repeat;
343 background-size: 32px 16px;
b27cc46e 344 width: 16px;
dccbbf95 345 height: 16px;
45dc7657 346 margin: 2px;
dccbbf95
RK
347}
348
349@media (min-resolution: 2dppx) {
350 .dbg-expression-arrow {
351 background-image: url(commandline-icon@2x.png);
352 }
990cba4b
RK
353}
354
355.dbg-expression-input {
de57e474 356 color: inherit;
990cba4b
RK
357}
358
45dc7657
RK
359.dbg-expression-button {
360 border: none;
361 background: none;
45dc7657 362 text-decoration: underline;
dccbbf95 363 cursor: pointer;
45dc7657 364
45dc7657
RK
365 color: #9C9CFF; /* Blue highlight color */
366}
367
3a0880a9
RK
368/* Event listeners view */
369
370.dbg-event-listener {
45dc7657 371 padding: 0 8px;
3a0880a9
RK
372}
373
374.dbg-event-listener-type {
375 font-weight: 600;
376}
377
378.dbg-event-listener-separator {
379 color: #A09090;
380}
381
382.dbg-event-listener-targets {
383 color: #9C9CFF;
384}
385
386.dbg-event-listener-location {
387 color: #E7ADE7;
388}
389
de57e474
RK
390#event-listeners .side-menu-widget-item.selected {
391 background: none !important;
392}
393
82b4252f 394/* Searchbox and the search operations help panel */
56ab361a 395
d2ce251d 396#searchbox {
82b4252f
RK
397 min-width: 220px;
398 -moz-margin-start: 1px;
56ab361a
RK
399}
400
fe524e0c
RK
401#filter-label {
402 -moz-margin-start: 2px;
403}
404
405#searchbox-panel-operators {
406 margin-top: 5px;
82b4252f
RK
407 margin-bottom: 8px;
408 -moz-margin-start: 2px;
c29b709d
RK
409}
410
82b4252f
RK
411.searchbox-panel-operator-button {
412 min-width: 26px;
413 margin-top: 0;
414 margin-bottom: 0;
415 -moz-margin-start: 2px;
416 -moz-margin-end: 6px;
417 text-align: center;
56ab361a
RK
418}
419
82b4252f
RK
420.searchbox-panel-operator-label {
421 padding-bottom: 2px;
56ab361a
RK
422}
423
82b4252f 424/* Searchbox results panel */
56ab361a 425
82b4252f
RK
426.results-panel {
427 padding: 4px;
56ab361a
RK
428}
429
82b4252f
RK
430.results-panel-item {
431 border: 1px solid #A09090;
432 border-top-color: #8050B0;
433 padding: 5px;
56ab361a
RK
434 cursor: pointer;
435}
eec397be 436
82b4252f
RK
437.results-panel-item:first-of-type {
438 border-top-color: #9C9CFF;
439 border-radius: 4px 4px 0 0;
eec397be
RK
440}
441
82b4252f
RK
442.results-panel-item:last-of-type {
443 border-radius: 0 0 4px 4px;
b8384c33
RK
444}
445
82b4252f
RK
446.results-panel-item:only-of-type {
447 border-radius: 4px;
c29b709d
RK
448}
449
82b4252f
RK
450.results-panel-item:not(.selected):not(:hover) {
451/* text-shadow: 0 1px #fff;*/
85cfb236
RK
452}
453
45dc7657 454.results-panel-item-label-before {
82b4252f
RK
455 -moz-margin-end: 5px !important;
456 color: #A09090;
457 cursor: inherit;
56ab361a
RK
458}
459
45dc7657 460.results-panel-item-label {
82b4252f 461 color: #9C9CFF;
b8384c33 462 font-weight: 600;
82b4252f 463 cursor: inherit;
85cfb236
RK
464}
465
45dc7657 466.results-panel-item-label-below {
56ab361a 467 color: #FF9F00;
82b4252f 468 cursor: inherit;
56ab361a
RK
469}
470
82b4252f 471/* Sources search view */
eec397be 472
82b4252f
RK
473#globalsearch {
474 min-height: 10px;
82b4252f 475 max-height: 125px;
eec397be
RK
476}
477
82b4252f
RK
478#globalsearch + .devtools-horizontal-splitter {
479 -moz-border-top-colors: #9C9CFF;
56ab361a
RK
480}
481
82b4252f
RK
482.dbg-source-results {
483 padding: 0;
484 background: none !important;
eec397be
RK
485}
486
46e71434
RK
487.dbg-source-results:not(.selected):hover {
488 background-color: #000000; /* Sidebar background */
489}
490
82b4252f 491.dbg-results-header {
b8384c33 492 -moz-padding-start: 6px;
37953ab4
RK
493}
494
82b4252f 495.dbg-results-header-location {
990cba4b
RK
496 font-weight: 600;
497}
498
82b4252f
RK
499.dbg-results-header-match-count {
500 -moz-padding-start: 6px;
eec397be
RK
501 color: #8050B0;
502}
503
82b4252f
RK
504.dbg-results-line-number {
505 background: #000000;
506 min-width: 40px;
507 -moz-border-end: 1px solid #9C9CFF;
508 -moz-padding-end: 4px;
509 padding-top: 2px;
510 text-align: end;
eec397be
RK
511 color: #FF9F00;
512}
513
82b4252f
RK
514.dbg-results-line-contents {
515 -moz-padding-start: 4px;
516 padding-top: 1px;
517 padding-bottom: 1px;
eec397be
RK
518}
519
82b4252f
RK
520.dbg-results-line-contents-string {
521 padding: 1px;
eec397be
RK
522}
523
82b4252f
RK
524.dbg-results-line-contents-string[match=true] {
525 background: #E7ADE7;
526 color: #000000;
527 padding: 0;
528 border: 1px solid #9C9CFF;
529 border-radius: 4px;
530 cursor: pointer;
eec397be
RK
531}
532
82b4252f
RK
533.dbg-results-line-contents-string[match=true][focusing] {
534 transition: transform 0.3s ease-in-out;
eec397be
RK
535}
536
82b4252f
RK
537.dbg-results-line-contents-string[match=true][focused] {
538 transition-duration: 0.1s;
539 transform: scale(1.75, 1.75);
b8384c33
RK
540}
541
3a0880a9 542/* Toolbar controls */
5322a392 543
c29b709d 544#toggle-panes {
c29b709d
RK
545 list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
546 -moz-image-region: rect(0px, 16px, 16px, 0px);
547}
548
b8384c33 549#toggle-panes:not([panesHidden]) {
c29b709d
RK
550 list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png");
551}
552
553#toggle-panes:hover,
554#toggle-panes:hover:active {
555 -moz-image-region: rect(0px, 32px, 16px, 16px);
556}
557
dccbbf95
RK
558#debugger-toolbar .devtools-toolbarbutton:not([label]) > .toolbarbutton-icon,
559#sources-toolbar .devtools-toolbarbutton:not([label]) > .toolbarbutton-icon {
560 width: 16px;
561 height: 16px;
562}
563
5322a392 564#resume {
3886293f 565 list-style-image: url("chrome://browser/skin/devtools/debugger-pause.png");
5322a392
RK
566 -moz-image-region: rect(0px, 16px, 16px, 0px);
567}
568
5322a392
RK
569#resume:hover {
570 -moz-image-region: rect(0px, 32px, 16px, 16px);
571}
572
3886293f 573#resume[checked=true] {
3886293f 574 list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
3886293f
RK
575}
576
dccbbf95
RK
577@media (min-resolution: 2dppx) {
578 #resume {
579 list-style-image: url(debugger-pause@2x.png);
580 -moz-image-region: rect(0px, 32px, 32px, 0px);
581 }
582
583 #resume:hover {
584 -moz-image-region: rect(0px, 64px, 32px, 32px);
585 }
586
587 #resume[checked=true] {
588 list-style-image: url(debugger-play@2x.png);
dccbbf95
RK
589 }
590}
591
3886293f
RK
592#resume ~ toolbarbutton {
593/* transition: opacity 0.15s ease-in-out; */
594}
595
596#resume:not([checked]) ~ toolbarbutton {
597/* opacity: 0.5; */
598}
599
5322a392
RK
600#step-over {
601 list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png");
602 -moz-image-region: rect(0px, 16px, 16px, 0px);
603}
604#step-over:hover {
605 -moz-image-region: rect(0px, 32px, 16px, 16px);
606}
607
608#step-in {
609 list-style-image: url("chrome://browser/skin/devtools/debugger-step-in.png");
610 -moz-image-region: rect(0px, 16px, 16px, 0px);
611}
612#step-in:hover {
613 -moz-image-region: rect(0px, 32px, 16px, 16px);
614}
615
616#step-out {
617 list-style-image: url("chrome://browser/skin/devtools/debugger-step-out.png");
618 -moz-image-region: rect(0px, 16px, 16px, 0px);
619}
620#step-out:hover {
621 -moz-image-region: rect(0px, 32px, 16px, 16px);
622}
623
dccbbf95
RK
624@media (min-resolution: 2dppx) {
625 #step-over {
626 list-style-image: url(debugger-step-over@2x.png);
627 -moz-image-region: rect(0px, 32px, 32px, 0);
628 }
629
630 #step-over:hover {
631 -moz-image-region: rect(0px, 64px, 32px, 32px);
632 }
633
634 #step-in {
635 list-style-image: url(debugger-step-in@2x.png);
636 -moz-image-region: rect(0px, 32px, 32px, 0);
637 }
638
639 #step-in:hover {
640 -moz-image-region: rect(0px, 64px, 32px, 32px);
641 }
642
643 #step-out {
644 list-style-image: url(debugger-step-out@2x.png);
645 -moz-image-region: rect(0px, 32px, 32px, 0);
646 }
647
648 #step-out:hover {
649 -moz-image-region: rect(0px, 64px, 32px, 32px);
650 }
651}
652
82b4252f 653#instruments-pane-toggle {
f7774352 654/* background: none;
82b4252f 655 box-shadow: none;
f7774352 656 border: none; */
ed1a91c6 657 list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png");
82b4252f
RK
658 -moz-image-region: rect(0px,16px,16px,0px);
659}
660
ed1a91c6
RK
661#instruments-pane-toggle[pane-collapsed] {
662 list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
82b4252f
RK
663}
664
dccbbf95 665#instruments-pane-toggle:hover {
82b4252f
RK
666 -moz-image-region: rect(0px,32px,16px,16px);
667}
3a0880a9 668
dccbbf95
RK
669@media (min-resolution: 2dppx) {
670 #instruments-pane-toggle {
671 list-style-image: url(debugger-collapse@2x.png);
672 -moz-image-region: rect(0px,32px,32px,0px);
673 }
674
675 #instruments-pane-toggle[pane-collapsed] {
676 list-style-image: url(debugger-expand@2x.png);
677 }
678
679 #instruments-pane-toggle:hover {
680 -moz-image-region: rect(0px,64px,32px,32px);
681 }
682}
683
3a0880a9
RK
684/* Horizontal vs. vertical layout */
685
686#vertical-layout-panes-container {
687 min-height: 35vh;
688 max-height: 80vh;
689}
690
691#body[layout=vertical] #instruments-pane {
692 margin: 0 !important;
693 /* To prevent all the margin hacks to hide the sidebar. */
694}
695
de57e474
RK
696#body[layout=vertical] #sources-pane > tabs {
697 -moz-border-end: none;
698}
699
700#body[layout=vertical] .side-menu-widget-container,
45dc7657 701#body[layout=vertical] .side-menu-widget-empty-text {
3a0880a9
RK
702 box-shadow: none !important;
703}
704
705#body[layout=vertical] .side-menu-widget-item-arrow {
706 background-image: none !important;
707}
45dc7657
RK
708
709/* === END debugger.inc.css === */