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