silence warnings about a missing light theme CSS file
[themes.git] / LCARStrek / browser / devtools / netmonitor.css
CommitLineData
cc7e70eb
RK
1/* vim:set ts=2 sw=2 sts=2 et: */
2/* This Source Code Form is subject to the terms of the Mozilla Public
3 * License, v. 2.0. If a copy of the MPL was not distributed with this
4 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
5
6window {
7 padding: 0;
8}
9
45dc7657 10/* === BEGIN netmonitor.inc.css === */
e2734cc7
RK
11
12#requests-menu-empty-notice {
45dc7657 13 margin: 0;
cc7e70eb 14 padding: 12px;
46e71434 15 font-size: 120%;
45dc7657 16
46e71434
RK
17 color: #FF9F00;
18}
19
20#requests-menu-perf-notice-button {
21 min-width: 30px;
22 min-height: 28px;
23 margin: 0;
dccbbf95 24 list-style-image: url("profiler-stopwatch.svg");
46e71434
RK
25}
26
27#requests-menu-perf-notice-button .button-text {
28 display: none;
cc7e70eb
RK
29}
30
45dc7657
RK
31/* Network requests table */
32
cc7e70eb
RK
33#requests-menu-toolbar {
34}
35
f30073a6
RK
36#requests-menu-toolbar > .toolbar-box > .toolbar-startcap,
37#requests-menu-toolbar > .toolbar-box > .toolbar-endcap {
38 display: none;
39}
40
f30073a6
RK
41.requests-menu-header:first-child {
42 -moz-padding-start: 4px;
43 -moz-margin-start: 4px;
44}
45
cc7e70eb 46.requests-menu-subitem {
f30073a6 47 padding: 4px;
cc7e70eb
RK
48}
49
f30073a6 50.requests-menu-header:not(:last-child),
cc7e70eb
RK
51.requests-menu-subitem:not(:last-child) {
52 -moz-border-end: 1px solid #9C9CFF;
53}
54
45dc7657
RK
55.requests-menu-header:not(:last-child):-moz-locale-dir(rtl),
56.requests-menu-subitem:not(:last-child):-moz-locale-dir(rtl) {
57}
58
f30073a6
RK
59.requests-menu-header-button,
60#requests-menu-status-button {
61 background-color: transparent;
62 border-radius: 0;
e2734cc7 63 min-width: 20px;
f30073a6 64 margin: 0;
e2734cc7 65 font-weight: inherit !important;
f30073a6 66 transition: background-color 0.1s ease-in-out;
cc7e70eb
RK
67}
68
f30073a6
RK
69.requests-menu-header-button > .button-box,
70#requests-menu-status-button > .button-box {
71 border-radius: 0;
624ebb51
RK
72 -moz-padding-start: 0;
73 -moz-padding-end: 0;
74 border: 0;
cc7e70eb
RK
75}
76
f30073a6
RK
77.requests-menu-header-button:hover {
78 background-color: #FFCF00;
cc7e70eb
RK
79}
80
f30073a6
RK
81.requests-menu-header-button:hover:active {
82 background-color: #FF9F00;
83}
84
85.requests-menu-header-button:not(:active)[sorted] {
cc7e70eb
RK
86 background-color: #008484;
87}
88
f30073a6
RK
89.requests-menu-header-button:not(:active)[sorted=ascending] {
90 background-image: radial-gradient(farthest-side at center top, rgba(0,0,0,.7), rgba(0,0,0,0.3));
91 background-size: 100% 1px;
92 background-repeat: no-repeat;
cc7e70eb
RK
93}
94
f30073a6
RK
95.requests-menu-header-button:not(:active)[sorted=descending] {
96 background-image: radial-gradient(farthest-side at center bottom, rgba(0,0,0,.7), rgba(0,0,0,0.3));
97 background-size: 100% 1px;
98 background-repeat: no-repeat;
99 background-position: bottom;
cc7e70eb
RK
100}
101
f30073a6
RK
102#requests-menu-status-button {
103 border: none;
104}
105
106#requests-menu-status-button > .button-box {
107 padding: 0;
108}
109
110/* Network requests table: specific column dimensions */
111
112.requests-menu-status-and-method {
649b5d38 113 width: 12em;
f30073a6
RK
114}
115
116.requests-menu-status {
117 width: 10px;
118 height: 10px;
119 margin: 0px 2px;
cc7e70eb
RK
120}
121
122.requests-menu-method {
123 text-align: center;
124 font-weight: 600;
125}
126
c1d2ce3e
RK
127.requests-menu-icon-and-file {
128 width: 20vw;
129 min-width: 4em;
130}
131
132.requests-menu-icon {
133 background: #FFCF00;
134 width: calc(1em + 4px);
135 height: calc(1em + 4px);
136 margin: -4px 0px;
137 -moz-margin-end: 4px;
138}
139
140.requests-menu-icon {
141 outline: 1px solid #A09090;
142}
143
cc7e70eb 144.requests-menu-file {
c1d2ce3e 145 text-align: start;
cc7e70eb
RK
146}
147
148.requests-menu-domain {
c1d2ce3e
RK
149 width: 14vw;
150 min-width: 10em;
cc7e70eb
RK
151}
152
153.requests-menu-type {
154 text-align: center;
155 width: 4em;
156}
157
158.requests-menu-size {
159 text-align: center;
160 width: 8em;
161}
162
f30073a6
RK
163/* Network requests table: status codes */
164
46e71434 165box.requests-menu-status {
f30073a6 166 background-color: #A09090;
46e71434 167 width: 10px;
e2734cc7
RK
168 -moz-margin-start: 5px;
169 -moz-margin-end: 5px;
f30073a6
RK
170 border-radius: 20px;
171 border: 1px solid #000000;
172 transition: background-color 0.5s ease-in-out;
173}
174
46e71434
RK
175label.requests-menu-status-code {
176 -moz-margin-start: 3px !important;
177 width: 3em;
178 -moz-margin-end: -3em !important;
f30073a6
RK
179}
180
46e71434
RK
181box.requests-menu-status:not([code]) {
182 background-color: #A09090; /* dark grey */
f30073a6
RK
183}
184
46e71434
RK
185box.requests-menu-status[code^="1"] {
186 background-color: #9C9CFF; /* light blue */
187}
188
189box.requests-menu-status[code^="2"] {
190 background-color: #008484; /* green */
f30073a6
RK
191}
192
46e71434
RK
193/* 3xx are triangles */
194box.requests-menu-status[code^="3"] {
195 background-color: transparent;
196 width: 0;
197 height: 0;
198 border-left: 5px solid transparent;
199 border-right: 5px solid transparent;
200 border-bottom: 10px solid #FF9F00; /* light orange */
201 border-radius: 0;
f30073a6
RK
202}
203
46e71434
RK
204/* 4xx and 5xx are squares - error codes */
205box.requests-menu-status[code^="4"] {
206 background-color: #FF0000; /* red */
207 border-radius: 0; /* squares */
208}
209
210box.requests-menu-status[code^="5"] {
211 background-color: #6000CF; /* pink? */
212 border-radius: 0;
213 transform: rotate(45deg);
f30073a6
RK
214}
215
216/* Network requests table: waterfall header */
217
218#requests-menu-waterfall-label {
cc7e70eb
RK
219 -moz-padding-start: 8px;
220 -moz-padding-end: 8px;
cc7e70eb
RK
221}
222
f30073a6
RK
223.requests-menu-timings-division {
224 width: 100px;
225 padding-top: 1px;
226 -moz-padding-start: 4px;
227 -moz-border-start: 1px dotted #000000;
228 font-size: 90%;
f30073a6
RK
229 pointer-events: none;
230}
231
232.requests-menu-timings-division:not(:first-child) {
45dc7657 233 -moz-border-start: 1px dotted;
f30073a6
RK
234 -moz-margin-start: -100px !important; /* Don't affect layout. */
235}
236
c4460289
RK
237.requests-menu-timings-division:-moz-locale-dir(ltr) {
238 transform-origin: left center;
239}
240
241.requests-menu-timings-division:-moz-locale-dir(rtl) {
242 transform-origin: right center;
243}
244
45dc7657
RK
245.requests-menu-timings-division[division-scale=millisecond] {
246 -moz-border-start-color: #FF9F00 !important; /* Light foreground text */
247}
248
249.requests-menu-timings-division[division-scale=second] {
649b5d38 250 -moz-border-start-color: #FF9F00 !important; /* Light foreground text */
45dc7657
RK
251 font-weight: 600;
252}
253
254.requests-menu-timings-division[division-scale=minute] {
649b5d38 255 -moz-border-start-color: #FF9F00 !important; /* Light foreground text */
45dc7657
RK
256 font-weight: 600;
257}
258
f30073a6 259/* Network requests table: waterfall items */
cc7e70eb
RK
260
261.requests-menu-subitem.requests-menu-waterfall {
46e71434 262 -moz-padding-start: 0px;
cc7e70eb 263 -moz-padding-end: 4px;
f30073a6 264 background-repeat: repeat-y; /* Background created on a <canvas> in js. */
45dc7657 265 background-position: -1px center;
cc7e70eb
RK
266}
267
c4460289
RK
268.requests-menu-subitem.requests-menu-waterfall:-moz-locale-dir(rtl) {
269 background-position: right center;
270}
271
272.requests-menu-timings:-moz-locale-dir(ltr) {
273 transform-origin: left center;
274}
275
276.requests-menu-timings:-moz-locale-dir(rtl) {
277 transform-origin: right center;
278}
279
280.requests-menu-timings-total:-moz-locale-dir(ltr) {
cc7e70eb
RK
281 transform-origin: left center;
282}
283
c4460289
RK
284.requests-menu-timings-total:-moz-locale-dir(rtl) {
285 transform-origin: right center;
286}
287
cc7e70eb 288.requests-menu-timings-total {
46e71434 289 -moz-padding-start: 4px;
cc7e70eb
RK
290 font-size: 85%;
291 font-weight: 600;
cc7e70eb
RK
292}
293
cc7e70eb 294.requests-menu-timings-box {
46e71434 295 height: 9px;
cc7e70eb
RK
296}
297
46e71434
RK
298.requests-menu-timings-box.blocked {
299 background-color: #FF0000; /* red */
cc7e70eb
RK
300}
301
46e71434
RK
302.requests-menu-timings-box.dns {
303 background-color: #E7ADE7; /* pink */
cc7e70eb
RK
304}
305
46e71434
RK
306.requests-menu-timings-box.connect {
307 background-color: #FF9F00; /* orange */
cc7e70eb
RK
308}
309
46e71434
RK
310.requests-menu-timings-box.send {
311 background-color: #FFCF00; /* light blue */
cc7e70eb
RK
312}
313
46e71434
RK
314.requests-menu-timings-box.wait {
315 background-color: #9C9CFF; /* blue grey */
cc7e70eb
RK
316}
317
46e71434
RK
318.requests-menu-timings-box.receive {
319 background-color: #A09090; /* green */
cc7e70eb
RK
320}
321
e2734cc7
RK
322/* SideMenuWidget */
323
45dc7657
RK
324.side-menu-widget-item-contents {
325 padding: 0px;
326}
327
de57e474
RK
328.side-menu-widget-container {
329 box-shadow: none !important;
330}
331
45dc7657 332.side-menu-widget-item:not(.selected)[odd] {
cc7e70eb
RK
333 background: rgba(255,159,0,0.1);
334}
335
336/* Network request details */
337
cc7e70eb
RK
338#details-pane-toggle {
339 list-style-image: url("chrome://browser/skin/devtools/debugger-collapse.png");
340 -moz-image-region: rect(0px,16px,16px,0px);
341}
342
343#details-pane-toggle[pane-collapsed] {
344 list-style-image: url("chrome://browser/skin/devtools/debugger-expand.png");
345}
346
347#details-pane-toggle:hover,
348#details-pane-toggle:hover:active {
349 -moz-image-region: rect(0px,32px,16px,16px);
350}
351
352/* Network request details tabpanels */
353
354.tabpanel-content {
355 background-color: #000000;
356 color: #FF9F00;
357}
358
46e71434
RK
359/* Summary tabpanel */
360
cc7e70eb
RK
361.tabpanel-summary-container {
362 padding: 1px;
363}
364
365.tabpanel-summary-label {
366 -moz-padding-start: 4px;
367 -moz-padding-end: 3px;
368 font-weight: 600;
cc7e70eb
RK
369}
370
371.tabpanel-summary-value {
372 -moz-padding-start: 3px;
cc7e70eb
RK
373}
374
375/* Headers tabpanel */
376
377#headers-summary-status,
378#headers-summary-version {
379 padding-bottom: 2px;
380}
381
382#headers-summary-size {
383 padding-top: 2px;
384}
385
e7c8bab1
RK
386#headers-summary-resend {
387 margin: 0 6px;
388/* min-height: 20px;*/
389}
390
cc7e70eb
RK
391/* Response tabpanel */
392
e2734cc7 393#response-content-info-header {
e2734cc7 394 margin: 0;
46e71434
RK
395 padding: 3px 8px;
396
397 background-color: #FF0000; /* Red highlight */
398 color: #000000; /* Light foreground text */
e2734cc7
RK
399}
400
cc7e70eb
RK
401#response-content-image-box {
402 padding-top: 10px;
403 padding-bottom: 10px;
404}
405
406#response-content-image {
407 background: #FFFFFF;
408 border: 1px dashed #A09090;
409 margin-bottom: 10px;
410}
411
c1d2ce3e
RK
412/* Preview tabpanel */
413
414#preview-tabpanel {
415 background: #fff;
416}
417
418#response-preview {
419 display: -moz-box;
420 -moz-box-flex: 1;
421}
422
cc7e70eb
RK
423/* Timings tabpanel */
424
425#timings-tabpanel .tabpanel-summary-label {
426 width: 10em;
427}
428
429#timings-tabpanel .requests-menu-timings-box {
430 transition: transform 0.2s ease-out;
431 min-width: 1px;
45dc7657 432 border: none;
cc7e70eb
RK
433}
434
435#timings-tabpanel .requests-menu-timings-total {
436 transition: transform 0.2s ease-out;
437}
f30073a6 438
e7c8bab1
RK
439/* Custom request form */
440
441#custom-pane {
442 padding: 0.6em 0.5em;
443}
444
445.custom-header {
446 font-size: 1.1em;
447}
448
449.custom-section {
450 margin-top: 0.5em;
fe524e0c
RK
451}
452
453#custom-method-value {
454 width: 4.5em;
e7c8bab1
RK
455}
456
e2734cc7
RK
457/* Footer */
458
459#requests-menu-footer {
460 border-top: 1px solid #9C9CFF;
461 padding-top: 3px;
462}
463
464.requests-menu-footer-button,
465.requests-menu-footer-label {
466 min-width: 1em;
467 margin: 0;
468 -moz-margin-end: 3px;
469 border: none;
c1d2ce3e 470 padding: 0px 1vw;
45dc7657 471
e2734cc7
RK
472/* color: #fff;*/
473}
474
475.requests-menu-footer-spacer {
476 min-width: 2px;
477}
478
479.requests-menu-footer-spacer,
480.requests-menu-footer-button {
481}
482
483.requests-menu-footer-button {
484}
485
486.requests-menu-footer-button:hover {
487}
488
489.requests-menu-footer-button:hover:active {
490}
491
492.requests-menu-footer-button:not(:active)[checked] {
493}
494
495.requests-menu-footer-label {
496 font-weight: 600;
497}
498
46e71434
RK
499/* Performance analysis buttons */
500
501#requests-menu-network-summary-button {
dccbbf95 502 list-style-image: url("profiler-stopwatch.svg");
46e71434
RK
503 -moz-padding-end: 0;
504 cursor: pointer;
505}
506
507#requests-menu-network-summary-label {
508 -moz-padding-start: 0;
509 cursor: pointer;
510}
511
512#requests-menu-network-summary-label:hover {
513 text-decoration: underline;
514}
515
516/* Performance analysis view */
517
518#network-statistics-toolbar {
519 /* Make the toolbar invisible, it only hold the back button */
520 -moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar");
521 background-color: #000000;
522}
523
524#network-statistics-back-button {
525 min-width: 4em;
526 min-height: 100vh;
527}
528
529#network-statistics-view-splitter {
530 cursor: default;
531 pointer-events: none;
532}
533
534#network-statistics-charts {
535 min-height: 1px;
46e71434 536
46e71434
RK
537 background: #000000; /* Toolbars */
538}
539
540#network-statistics-charts .pie-chart-container {
541 -moz-margin-start: 3vw;
542 -moz-margin-end: 1vw;
543}
544
545#network-statistics-charts .table-chart-container {
546 -moz-margin-start: 1vw;
547 -moz-margin-end: 3vw;
548}
549
b7f3670c 550.chart-colored-blob[name=html] {
46e71434
RK
551 fill: #A09090; /* Blue-Grey highlight */
552 background: #A09090;
553}
554
b7f3670c 555.chart-colored-blob[name=css] {
46e71434
RK
556 fill: #9C9CFF; /* Blue highlight */
557 background: #9C9CFF;
558}
559
b7f3670c 560.chart-colored-blob[name=js] {
46e71434
RK
561 fill: #FFCF00; /* Light Orange highlight */
562 background: #FFCF00;
563}
564
b7f3670c 565.chart-colored-blob[name=xhr] {
46e71434
RK
566 fill: #FF9F00; /* Orange highlight */
567 background: #FF9F00;
568}
569
b7f3670c 570.chart-colored-blob[name=fonts] {
46e71434
RK
571 fill: #6000CF; /* Purple highlight */
572 background: #6000CF;
573}
574
b7f3670c 575.chart-colored-blob[name=images] {
46e71434
RK
576 fill: #E7ADE7; /* Pink highlight */
577 background: #E7ADE7;
578}
579
b7f3670c 580.chart-colored-blob[name=media] {
46e71434
RK
581 fill: #008484; /* Green highlight */
582 background: #008484;
583}
584
b7f3670c 585.chart-colored-blob[name=flash] {
46e71434
RK
586 fill: #FF0000; /* Red highlight */
587 background: #FF0000;
588}
589
590.table-chart-row-label[name=cached] {
591 display: none;
592}
593
594.table-chart-row-label[name=count] {
595 width: 3em;
596 text-align: end;
597}
598
599.table-chart-row-label[name=label] {
600 width: 7em;
601}
602
603.table-chart-row-label[name=size] {
604 width: 7em;
605}
606
607.table-chart-row-label[name=time] {
608 width: 7em;
609}
610
f30073a6
RK
611/* Responsive sidebar */
612@media (max-width: 700px) {
613 #requests-menu-toolbar {
614 height: 24px;
615 }
616
617 .requests-menu-header-button {
45dc7657 618 min-height: 24px;
e2734cc7
RK
619 }
620
f30073a6 621 #details-pane {
f30073a6
RK
622 margin: 0 !important;
623 /* To prevent all the margin hacks to hide the sidebar. */
624 }
625
626 .requests-menu-status-and-method {
e2734cc7 627 width: 16vw;
f30073a6
RK
628 }
629
c1d2ce3e 630 .requests-menu-icon-and-file,
f30073a6
RK
631 .requests-menu-domain {
632 width: 30vw;
f30073a6
RK
633 }
634
635 .requests-menu-type {
636 width: 8vw;
637 }
638
639 .requests-menu-size {
640 width: 16vw;
641 border-width: 0 !important;
642 box-shadow: none !important;
643 /* The "Timeline" header is not visible anymore, and thus the
644 right border and box-shadow of "Size" column should be hidden. */
645 }
646}
647
45dc7657 648/* === END netmonitor.inc.css === */