work around SeaMonkey bug 1022354 by specifying yet another copy of the default favicon
[themes.git] / LCARStrek / browser / devtools / webconsole.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/*
10 * This hardcoded width likely due to a toolkit Windows specific bug.
11 * See http://hg.mozilla.org/mozilla-central/annotate/f38d6df93cad/toolkit/themes/winstripe/global/textbox-aero.css#l7
12 */
13
14.hud-filter-box {
15 width: 200px;
16}
17
18/* === BEGIN webconsole.inc.css === */
19
20/* General output styles */
21
22a {
23 -moz-user-focus: normal;
24 -moz-user-input: enabled;
25 cursor: pointer;
26 text-decoration: underline;
27}
28
29/* Workaround for Bug 575675 - FindChildWithRules aRelevantLinkVisited
30 * assertion when loading HTML page with links in XUL iframe */
31*:visited { }
32
33.message {
34 display: flex;
35 flex: 0 0 auto;
36 -moz-margin-start: 6px;
37 -moz-margin-end: 8px;
38 width: calc(100% - 6px - 8px);
39}
40
41.message > .timestamp {
42 flex: 0 0 auto;
43 color: #8050B0;
44 margin: 4px 0;
45}
46
47.message > .icon {
48 background: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 0, 1, 0, 0) no-repeat;
49 background-position: center 0.5em;
50 flex: 0 0 auto;
51 margin: 0 6px;
52 padding: 0 4px;
53 width: 8px;
54}
55
56.message > .body {
57 flex: 1 1 100%;
58 white-space: pre-wrap;
59 word-wrap: break-word;
60 margin-top: 4px;
61}
62
63/* The red bubble that shows the number of times a message is repeated */
64.message-repeats {
65 -moz-user-select: none;
66 flex: 0 0 auto;
67 margin: 2px 6px;
68 padding: 0 6px;
69 height: 1.25em;
70 color: #000000;
71 background-color: #FF0000;
72 border-radius: 40px;
73 /* font: message-box; */
74 font-size: 0.9em;
75 font-weight: 600;
76}
77
78.message-repeats[value="1"] {
79 display: none;
80}
81
82.message-location {
83 -moz-margin-start: 6px;
84 display: flex;
85 flex: 0 0 auto;
86 align-self: flex-start;
87 justify-content: flex-end;
88 width: 10em;
89 margin-top: 4px;
90 color: #3333FF;
91 text-decoration: none;
92 white-space: nowrap;
93}
94
95.message-location:hover,
96.message-location:focus {
97 text-decoration: underline;
98}
99
100.message-location > .filename {
101 text-overflow: ellipsis;
102 text-align: end;
103 overflow: hidden;
104 white-space: nowrap;
105}
106
107.message-location > .line-number {
108 flex: 0 0 auto;
109}
110
111.hud-msg-node[selected="true"] > .webconsole-timestamp,
112.hud-msg-node[selected="true"] > .webconsole-location {
113 color: inherit;
114}
115
116.jsterm-input-container {
117 border-top-width: 1px;
118 border-top-style: solid;
119}
120
121#output-wrapper {
122 direction: ltr;
123 overflow: auto;
124}
125
126#output-container {
127 -moz-user-select: text;
128 -moz-box-flex: 1;
129 display: flex;
130 flex-direction: column;
131 align-items: flex-start;
132}
133
134#output-container.hideTimestamps > .message > .timestamp {
135 display: none;
136}
137
138.filtered-by-type,
139.filtered-by-string {
140 display: none;
141}
142
143.hidden-message {
144 display: block;
145 visibility: hidden;
146 height: 0;
147 overflow: hidden;
148}
149
150/* WebConsole colored drops */
151
152.webconsole-filter-button {
153 -moz-user-focus: normal;
154}
155
156.webconsole-filter-button[checked] {
157 /* color: white !important; */
158}
159
160.webconsole-filter-button > .toolbarbutton-menubutton-button:before {
161 content: "";
162 display: inline-block;
163 height: 8px;
164 width: 8px;
165 border-radius: 50%;
166 margin-left: 5px;
167 border-width: 1px;
168 border-style: solid;
169}
170
171.webconsole-filter-button menuitem {
172 -moz-image-region: auto;
173}
174
175.hud-filter-box {
176 margin-top: 0;
177 margin-bottom: 0;
178}
179
180/* Network styles */
181.webconsole-filter-button[category="net"] > .toolbarbutton-menubutton-button:before {
182 background-image: linear-gradient(#BF9B00, #7F6700);
183 border-color: #FFCF00;
184}
185
186.message[category=network] > .icon {
187 -moz-border-start: solid #FFCF00 6px;
188}
189
190.message[category=network][severity=error] > .icon {
191 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 0, 16, 8, 8);
192}
193
194.message[category=network] > .body {
195 display: flex;
196}
197
198.message[category=network] .method {
199 flex: 0 0 auto;
200}
201
202.message[category=network]:not(.navigation-marker) .url {
203 flex: 1 1 auto;
204 /* Make sure the URL is very small initially, let flex change width as needed. */
205 width: 100px;
206 min-width: 5em;
207 white-space: nowrap;
208 overflow: hidden;
209 text-overflow: ellipsis;
210}
211
212.message[category=network] .status {
213 flex: 0 0 auto;
214 -moz-margin-start: 6px;
215}
216
217.message[category=network].mixed-content .url {
218 color: #FF0000;
219}
220
221.message .learn-more-link {
222 color: #3333FF;
223 margin: 0 6px;
224}
225
226/* CSS styles */
227.webconsole-filter-button[category="css"] > .toolbarbutton-menubutton-button:before {
228 background-image: linear-gradient(#7575BF, #4E4E7F);
229 border-color: #9C9CFF;
230}
231
232.message[category=cssparser] > .icon {
233 -moz-border-start: solid #9C9CFF 6px;
234}
235
236.message[category=cssparser][severity=error] > .icon {
237 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 8, 16, 16, 8);
238}
239
240.message[category=cssparser][severity=warn] > .icon {
241 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 8, 24, 16, 16);
242}
243
244/* JS styles */
245.webconsole-filter-button[category="js"] > .toolbarbutton-menubutton-button:before {
246 background-image: linear-gradient(#BF7700, #7F4F00);
247 border-color: #FF9F00;
248}
249
250.message[category=exception] > .icon {
251 -moz-border-start: solid #FF9F00 6px;
252}
253
254.message[category=exception][severity=error] > .icon {
255 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 16, 16, 24, 8);
256}
257
258.message[category=exception][severity=warn] > .icon {
259 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 16, 24, 24, 16);
260}
261
262/* Web Developer styles */
263.webconsole-filter-button[category="logging"] > .toolbarbutton-menubutton-button:before {
264 background-image: linear-gradient(#5F3B83, #3F2756);
265 border-color: #8050B0;
266}
267
268.message[category=console] > .icon {
269 -moz-border-start: solid #8050B0 6px;
270}
271
272.message[category=console][severity=error] > .icon,
273.message[category=output][severity=error] > .icon {
274 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 16, 32, 8);
275}
276
277.message[category=console][severity=warn] > .icon {
278 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 24, 32, 16);
279}
280
281.message[category=console][severity=info] > .icon {
282 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 32, 32, 24);
283}
284
285/* Input and output styles */
286.message[category=input] > .icon,
287.message[category=output] > .icon {
288 -moz-border-start: solid #A09090 6px;
289}
290
291.message[category=input] > .icon {
292 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 40, 32, 32);
293}
294
295.message[category=output] > .icon {
296 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 24, 48, 32, 40);
297}
298
299/* JSTerm Styles */
300
301.jsterm-input-node,
302.jsterm-complete-node {
303 -moz-padding-start: 16px;
304 margin: 3px 0 0 0;
305 background-color: transparent;
306}
307
308.jsterm-input-node {
309 background: -moz-image-rect(url("chrome://browser/skin/devtools/commandline-icon.png"), 0, 32, 16, 16) no-repeat;
310}
311
312:-moz-any(.jsterm-input-node,
313 .jsterm-complete-node) > .textbox-input-box > .textbox-textarea {
314 overflow-x: hidden;
315}
316
317.inlined-variables-view .body {
318 display: flex;
319 flex-direction: column;
320}
321
322.inlined-variables-view iframe {
323 display: block;
324 flex: 1;
325 margin-top: 5px;
326 margin-bottom: 15px;
327 -moz-margin-end: 15px;
328 border: 1px solid #9C9CFF;
329 border-radius: 4px;
330}
331
332#webconsole-sidebar > tabs {
333 height: 0;
334 border: none;
335}
336
337.devtools-side-splitter ~ #webconsole-sidebar[hidden] {
338 display: none;
339}
340
341/* Security styles */
342
343.message[category=security] > .icon {
344 -moz-border-start: solid #FF0000 6px;
345}
346
347.webconsole-filter-button[category="security"] > .toolbarbutton-menubutton-button:before {
348 background-color: #FF0000;
349 border-color: #FFCF00;
350}
351
352.message[category=security][severity=error] > .icon {
353 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 32, 16, 40, 8);
354}
355
356.message[category=security][severity=warn] > .icon {
357 background-image: -moz-image-rect(url("chrome://browser/skin/devtools/webconsole.png"), 32, 24, 40, 16);
358}
359
360.navigation-marker {
361 color: #000000;
362 background-color: #A09090;
363 margin-top: 6px;
364 margin-bottom: 6px;
365 font-size: 0.9em;
366}
367
368.navigation-marker .url {
369 -moz-padding-end: 9px;
370 text-decoration: none;
371}
372
373.consoleTrace .body > div {
374 display: flex;
375 margin-bottom: 5px;
376}
377
378.consoleTrace .title {
379 display: block;
380 flex: 1 1 auto;
381}
382
383.stacktrace {
384 list-style: none;
385 padding: 0 1em 0 1.5em;
386 margin: 0;
387 max-height: 10em;
388 overflow-y: auto;
389
390 border: 1px solid #A09090;
391 border-radius: 3px;
392}
393
394.stacktrace li {
395 display: flex;
396 margin: 0;
397}
398
399.stacktrace .function {
400 display: block;
401 flex: 1 1 auto;
402}
403
404/* Replace these values with CSS variables as available */
405.theme-dark .jsterm-input-container {
406 background-color: #000000; /* tabToolbarBackgroundColor */
407 border-color: #9C9CFF; /* mainBackgroundColor */
408}
409
410.theme-dark .jsterm-input-node {
411 color: #E7ADE7; /* textColor */
412}
413
414.theme-dark .jsterm-complete-node {
415 color: #A09090; /* commentColor */
416}
417
418.theme-dark .navigation-marker .url {
419 background: #000000; /* mainBackgroundColor */
420}
421
422.theme-dark .inlined-variables-view iframe {
423 border-color: #A09090;
424}
425
426.theme-dark .stacktrace {
427 border-color: #A09090;
428}
429
430.theme-light .jsterm-input-container {
431 background-color: #000000; /* tabToolbarBackgroundColor */
432 border-color: #9C9CFF; /* mainBackgroundColor */
433}
434
435.theme-light .jsterm-input-node {
436 color: #E7ADE7; /* textColor */
437}
438
439.theme-light .jsterm-complete-node {
440 color: #A09090; /* commentColor */
441}
442
443.theme-light .navigation-marker .url {
444 background: #000000; /* mainBackgroundColor */
445}
446
447.theme-light .inlined-variables-view iframe {
448 border-color: #A09090;
449}
450
451.theme-dark .stacktrace {
452 border-color: #A09090;
453}
454
455@media (max-width: 500px) {
456 .message > .timestamp {
457 display: none;
458 }
459 .toolbarbutton-text {
460 display: none;
461 }
462 .hud-console-filter-toolbar .webconsole-filter-button {
463 min-width: 40px;
464 }
465 .hud-console-filter-toolbar .webconsole-clear-console-button {
466 min-width: 25px;
467 }
468 .webconsole-filter-button > .toolbarbutton-menubutton-button:before {
469 width: 16px;
470 height: 16px;
471 margin-left: 1px;
472 }
473 .toolbarbutton-menubutton-dropmarker {
474 margin: 0px;
475 }
476}
477
478@media (max-width: 300px) {
479 .hud-console-filter-toolbar {
480 -moz-box-orient: vertical;
481 }
482 .toolbarbutton-text {
483 display: -moz-box;
484 }
485 .devtools-toolbarbutton {
486 margin-top: 3px;
487 }
488 .hud-console-filter-toolbar .hud-filter-box,
489 .hud-console-filter-toolbar .devtools-toolbarbutton {
490 margin-top: 5px;
491 }
492}
493
494/* === END webconsole.inc.css === */