Merge branch 'master' of linz:/srv/git/themes
[themes.git] / LCARStrek / browser / devtools / debugger.css
CommitLineData
eec397be
RK
1/* -*- Mode: javascript; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
2/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
9099c61d
RK
3/* This Source Code Form is subject to the terms of the Mozilla Public
4 * License, v. 2.0. If a copy of the MPL was not distributed with this
5 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
eec397be
RK
6
7window {
8 padding: 0;
9}
10
11#body {
12 /* background: #000000; */
13}
14
eec397be
RK
15/**
16 * Debugger content
17 */
18
19#dbg-content {
37953ab4 20 padding: 0;
eec397be
RK
21}
22
eec397be
RK
23.devtools-side-splitter {
24 border: none;
25}
26
37953ab4 27#scripts {
c29b709d 28 min-width: 150px;
37953ab4
RK
29}
30
889649fd
RK
31/**
32 * This hardcoded width likely due to a toolkit Windows specific bug.
33 * See http://hg.mozilla.org/mozilla-central/annotate/f38d6df93cad/toolkit/themes/winstripe/global/textbox-aero.css#l7
34 */
35#scripts-search {
36 width: 200px;
37}
38
eec397be
RK
39/**
40 * Lists and headers
41 */
42
43.list-item {
44 padding: 2px;
eec397be
RK
45}
46
889649fd
RK
47.list-item:not(.selected):not(.empty):hover {
48 /* background: #cddae5; */
49}
50
eec397be
RK
51.list-item.selected {
52 background: #008484;
53 color: #FFCF00;
54}
55
56.list-item.empty {
57 color: #8050B0;
889649fd 58 /* padding: 4px; */
eec397be
RK
59}
60
61/**
c29b709d
RK
62 * Scripts searching
63 */
64
65#globalsearch {
66 background-color: #000000;
67 min-height: 50px;
68 max-height: 150px;
69}
70
71.dbg-script-results:not(:last-child) {
72 border-bottom: 1px dotted #9C9CFF;
73}
74
75.dbg-results-header {
76 -moz-padding-start: 6px;
77}
78
79.dbg-results-header .script-url {
80 font-weight: 600;
81}
82
83.dbg-results-header .match-count {
84 -moz-padding-start: 6px;
85 color: 8050B0;
86}
87
88.dbg-results-container .line-number {
89 background: #000000;
90 min-width: 35px;
91 -moz-padding-end: 4px;
92 -moz-border-end: 1px dotted #9C9CFF;
93 text-align: end;
94 font: 8pt monospace;
95}
96
97.dbg-results-container .line-contents {
98 -moz-padding-start: 4px;
99 font: 8pt monospace;
100}
101
102.dbg-results-container .line-contents:hover {
103 background: #000000;
104}
105
106.dbg-results-container .line-contents > .string {
107 padding: 1px;
108}
109
110.dbg-results-container .line-contents > .string[match=true] {
111 background: #E7ADE7;
112 color: #000000;
113 padding: 0;
114 border: 1px solid #9C9CFF;
115 border-radius: 4px;
116 cursor: pointer;
117 transition: transform 0.2s ease-in-out;
118 transform: scale(1, 1);
119}
120
121.dbg-results-container .line-contents > .string[match=true][focused] {
122 transition-duration: 0.1s;
123 transform: scale(1.75, 1.75);
124}
125
126/**
127 * Stack frames and breakpoints panel
128 */
129
130#stackframes\+breakpoints {
131 background-color: #000000;
132 min-width: 50px;
133}
134
135#stackframes\+breakpoints[animated] {
136 -moz-transition: margin 0.25s ease-in-out;
137}
138
139/**
140 * Stack frames view
eec397be
RK
141 */
142
143#stackframes {
144 /* background-color: white; */
145}
146
147.dbg-stackframe {
148 -moz-padding-start: 4px;
149 -moz-padding-end: 4px;
150}
151
152.dbg-stackframe-name {
37953ab4 153 -moz-padding-end: 4px;
eec397be
RK
154 font-weight: 600;
155}
156
889649fd
RK
157/**
158 * Breakpoints view
159 */
160
161#breakpoints {
162 background-color: #000000;
163}
164
165.dbg-breakpoint-info {
166 font-weight: 600;
167}
168
169.dbg-breakpoint-text {
170 font: 12px "Liberation Mono", Consolas, "Courier New", monospace;
171}
172
eec397be 173/**
37953ab4 174 * Properties view
eec397be
RK
175 */
176
177#variables {
178/* background-color: white; */
c29b709d
RK
179 min-width: 50px;
180}
181
182#variables[animated] {
183 -moz-transition: margin 0.25s ease-in-out;
eec397be
RK
184}
185
186/**
37953ab4 187 * Property element details container
eec397be
RK
188 */
189
190.details {
191 -moz-margin-start: 10px;
192}
193
194/**
195 * Scope element
196 */
197
198.scope > .title {
eec397be
RK
199 background: #E7ADE7;
200 border-radius: 5px;
201 color: #000000;
202}
203
37953ab4
RK
204.scope > .title > .arrow {
205 margin-top: -2px;
206}
207
eec397be
RK
208.scope > .title > .name {
209 padding-top: 2px;
eec397be
RK
210}
211
212.scope > .details {
213 -moz-margin-start: 2px;
214 -moz-margin-end: 2px;
215}
216
217/**
218 * Variable element
219 */
220
221.variable {
222 -moz-margin-start: 1px;
223 -moz-margin-end: 1px;
85cfb236 224 margin-top: 2px;
71a617ff 225 transition: background 1s ease-in-out;
85cfb236
RK
226 background: #000000;
227}
228
c29b709d
RK
229.variable:not(:last-child) {
230 border-bottom: 1px dotted #008484;
231 border-radius: 8px;
232}
233
234.variable:last-child {
235 margin-bottom: 2px;
236}
237
85cfb236 238.variable[changed] {
71a617ff 239 transition-duration: 0.4s;
85cfb236
RK
240 background: #FFCF00;
241}
242
243.variable[added] {
71a617ff 244 transition-duration: 0.4s;
85cfb236
RK
245 background: #008484;
246}
247
248.variable > .title > .arrow {
249 margin-top: -2px;
eec397be
RK
250}
251
252.variable > .title > .name {
eec397be
RK
253 color: #FF9F00;
254 font-weight: 600;
255}
256
257/**
258 * Property element
259 */
260
85cfb236
RK
261.property > .title > .arrow {
262 margin-top: -2px;
eec397be
RK
263}
264
85cfb236
RK
265.property > .title > .key {
266 color: #E7ADE7;
eec397be
RK
267}
268
269/**
37953ab4
RK
270 * Non enumerable, configurable and writable variables and properties.
271 */
272
273.property[proto] > .title > .key,
274.variable[non-enumerable] > .title > .name,
275.property[non-enumerable] > .title > .key {
276 opacity: 0.5;
277}
278
279.variable[non-configurable] > .title > .name,
280.property[non-configurable] > .title > .key {
281 border-bottom: 1px dashed #9C9CFF;
282}
283
284.variable[non-writable] > .title > .name,
285.property[non-writable] > .title > .key {
286 border-bottom: 1px dashed #FF0000;
287}
288
289.variable[non-writable] > .title:after,
290.property[non-writable] > .title:after {
291 content: " ";
292 display: inline-block;
293 width: 16px;
294 height: 16px;
295 background: url("chrome://browser/skin/identity-icons-https.png") no-repeat;
296 opacity: 0.5;
297}
298
889649fd
RK
299#element-tooltip > label {
300 margin: 0 2px 0 2px;
301}
302
303#element-tooltip > label[non-enumerable],
304#element-tooltip > label[non-configurable],
305#element-tooltip > label[non-writable]{
306 text-decoration: line-through;
307}
308
37953ab4
RK
309/**
310 * Property values colors
eec397be
RK
311 */
312
313.token-undefined {
314 -moz-padding-start: 6px;
315 color: #8050B0;
316}
317
318.token-null {
319 -moz-padding-start: 6px;
320 color: #008484;
321}
322
323.token-boolean {
324 -moz-padding-start: 6px;
325 color: #FFCF00;
326}
327
328.token-number {
329 -moz-padding-start: 6px;
330 color: #E7ADE7;
331}
332
333.token-string {
334 -moz-padding-start: 6px;
335 color: #9C9CFF;
336}
337
338.token-other {
339 -moz-padding-start: 6px;
340 color: #FF9F00;
341}
342
343/**
344 * Expand/collapse arrow
345 */
346
347.arrow {
348 width: 9px;
349 height: 9px;
350 -moz-margin-start: 5px;
351 -moz-margin-end: 5px;
85cfb236 352 margin-top: -2px;
eec397be
RK
353 background: url("chrome://global/skin/tree/twisty-closed.gif") center center no-repeat;
354}
355
356.arrow[open] {
357 background-image: url("chrome://global/skin/tree/twisty-open.gif");
358}
359
360.scope > .title > .arrow {
361 background-image: url("chrome://global/skin/tree/twisty-closed-selected.gif");
362}
363
364.scope > .title > .arrow[open] {
365 background-image: url("chrome://global/skin/tree/twisty-open-selected.gif");
366}
367
368/**
369 * Animations
370 */
371
c29b709d
RK
372.details[open][animated],
373.dbg-results-container[open][animated] {
374 animation-duration: 0.25s;
375 animation-name: showblock;
eec397be
RK
376}
377
c29b709d 378@keyframes showblock {
eec397be
RK
379 from {
380 opacity: 0;
71a617ff
RK
381 transform-origin: top;
382 transform: scaleY(0);
eec397be
RK
383 }
384
385 to {
386 opacity: 1;
71a617ff
RK
387 transform-origin: top;
388 transform: scaleY(1);
eec397be
RK
389 }
390}
391
5322a392
RK
392/**
393 * Toolbar Controls
394 */
395
c29b709d 396#toggle-panes {
c29b709d
RK
397 list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
398 -moz-image-region: rect(0px, 16px, 16px, 0px);
399}
400
401#toggle-panes:not([stackframesAndBreakpointsHidden]):not([variablesHidden]) {
402 list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png");
403}
404
405#toggle-panes:hover,
406#toggle-panes:hover:active {
407 -moz-image-region: rect(0px, 32px, 16px, 16px);
408}
409
5322a392 410#resume {
37953ab4 411 list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
5322a392
RK
412 -moz-image-region: rect(0px, 16px, 16px, 0px);
413}
414
415#resume[checked=true],
416#resume:hover {
417 -moz-image-region: rect(0px, 32px, 16px, 16px);
418}
419
420#step-over {
421 list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png");
422 -moz-image-region: rect(0px, 16px, 16px, 0px);
423}
424#step-over:hover {
425 -moz-image-region: rect(0px, 32px, 16px, 16px);
426}
427
428#step-in {
429 list-style-image: url("chrome://browser/skin/devtools/debugger-step-in.png");
430 -moz-image-region: rect(0px, 16px, 16px, 0px);
431}
432#step-in:hover {
433 -moz-image-region: rect(0px, 32px, 16px, 16px);
434}
435
436#step-out {
437 list-style-image: url("chrome://browser/skin/devtools/debugger-step-out.png");
438 -moz-image-region: rect(0px, 16px, 16px, 0px);
439}
440#step-out:hover {
441 -moz-image-region: rect(0px, 32px, 16px, 16px);
442}
443
444#debugger-controls > toolbarbutton {
445}
446
447#debugger-controls > toolbarbutton:last-of-type {
448}
449
450#debugger-controls {
451}