fourth part of syncing LCARStrek with Firefox 29 windows theme changes
[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
RK
14 padding: 12px;
15 font-size: 110%;
45dc7657 16
cc7e70eb
RK
17 color: #000000;
18}
19
45dc7657
RK
20/* Network requests table */
21
cc7e70eb
RK
22#requests-menu-toolbar {
23}
24
f30073a6
RK
25#requests-menu-toolbar > .toolbar-box > .toolbar-startcap,
26#requests-menu-toolbar > .toolbar-box > .toolbar-endcap {
27 display: none;
28}
29
f30073a6
RK
30.requests-menu-header:first-child {
31 -moz-padding-start: 4px;
32 -moz-margin-start: 4px;
33}
34
cc7e70eb 35.requests-menu-subitem {
f30073a6 36 padding: 4px;
cc7e70eb
RK
37}
38
f30073a6 39.requests-menu-header:not(:last-child),
cc7e70eb
RK
40.requests-menu-subitem:not(:last-child) {
41 -moz-border-end: 1px solid #9C9CFF;
42}
43
45dc7657
RK
44.requests-menu-header:not(:last-child):-moz-locale-dir(rtl),
45.requests-menu-subitem:not(:last-child):-moz-locale-dir(rtl) {
46}
47
f30073a6
RK
48.requests-menu-header-button,
49#requests-menu-status-button {
50 background-color: transparent;
51 border-radius: 0;
e2734cc7 52 min-width: 20px;
f30073a6 53 margin: 0;
e2734cc7 54 font-weight: inherit !important;
f30073a6 55 transition: background-color 0.1s ease-in-out;
cc7e70eb
RK
56}
57
f30073a6
RK
58.requests-menu-header-button > .button-box,
59#requests-menu-status-button > .button-box {
60 border-radius: 0;
624ebb51
RK
61 -moz-padding-start: 0;
62 -moz-padding-end: 0;
63 border: 0;
cc7e70eb
RK
64}
65
f30073a6
RK
66.requests-menu-header-button:hover {
67 background-color: #FFCF00;
cc7e70eb
RK
68}
69
f30073a6
RK
70.requests-menu-header-button:hover:active {
71 background-color: #FF9F00;
72}
73
74.requests-menu-header-button:not(:active)[sorted] {
cc7e70eb
RK
75 background-color: #008484;
76}
77
f30073a6
RK
78.requests-menu-header-button:not(:active)[sorted=ascending] {
79 background-image: radial-gradient(farthest-side at center top, rgba(0,0,0,.7), rgba(0,0,0,0.3));
80 background-size: 100% 1px;
81 background-repeat: no-repeat;
cc7e70eb
RK
82}
83
f30073a6
RK
84.requests-menu-header-button:not(:active)[sorted=descending] {
85 background-image: radial-gradient(farthest-side at center bottom, rgba(0,0,0,.7), rgba(0,0,0,0.3));
86 background-size: 100% 1px;
87 background-repeat: no-repeat;
88 background-position: bottom;
cc7e70eb
RK
89}
90
f30073a6
RK
91#requests-menu-status-button {
92 border: none;
93}
94
95#requests-menu-status-button > .button-box {
96 padding: 0;
97}
98
99/* Network requests table: specific column dimensions */
100
101.requests-menu-status-and-method {
102 width: 8em;
103}
104
105.requests-menu-status {
106 width: 10px;
107 height: 10px;
108 margin: 0px 2px;
cc7e70eb
RK
109}
110
111.requests-menu-method {
112 text-align: center;
113 font-weight: 600;
114}
115
116.requests-menu-file {
117 width: 16em;
118}
119
120.requests-menu-domain {
121 width: 16em;
122}
123
124.requests-menu-type {
125 text-align: center;
126 width: 4em;
127}
128
129.requests-menu-size {
130 text-align: center;
131 width: 8em;
132}
133
f30073a6
RK
134/* Network requests table: status codes */
135
136.requests-menu-status {
137 background-color: #A09090;
e2734cc7
RK
138 -moz-margin-start: 5px;
139 -moz-margin-end: 5px;
f30073a6
RK
140 border-radius: 20px;
141 border: 1px solid #000000;
142 transition: background-color 0.5s ease-in-out;
143}
144
145.requests-menu-status[code^="1"] {
146 background-color: #9C9CFF;
147}
148
149.requests-menu-status[code^="2"] {
150 background-color: #008484;
151}
152
153.requests-menu-status[code^="3"] {
154 background-color: #FF9F00;
155}
156
157.requests-menu-status[code^="4"] {
158 background-color: #FF0000;
159}
160
161.requests-menu-status[code^="5"] {
162 background-color: #6000CF;
163}
164
165/* Network requests table: waterfall header */
166
167#requests-menu-waterfall-label {
cc7e70eb
RK
168 -moz-padding-start: 8px;
169 -moz-padding-end: 8px;
cc7e70eb
RK
170}
171
f30073a6
RK
172.requests-menu-timings-division {
173 width: 100px;
174 padding-top: 1px;
175 -moz-padding-start: 4px;
176 -moz-border-start: 1px dotted #000000;
177 font-size: 90%;
f30073a6
RK
178 pointer-events: none;
179}
180
181.requests-menu-timings-division:not(:first-child) {
45dc7657 182 -moz-border-start: 1px dotted;
f30073a6
RK
183 -moz-margin-start: -100px !important; /* Don't affect layout. */
184}
185
c4460289
RK
186.requests-menu-timings-division:-moz-locale-dir(ltr) {
187 transform-origin: left center;
188}
189
190.requests-menu-timings-division:-moz-locale-dir(rtl) {
191 transform-origin: right center;
192}
193
45dc7657
RK
194.requests-menu-timings-division[division-scale=millisecond] {
195 -moz-border-start-color: #FF9F00 !important; /* Light foreground text */
196}
197
198.requests-menu-timings-division[division-scale=second] {
199 -moz-border-start-color: #E7ADE7 !important; /* Light orange highlight color */
200 font-weight: 600;
201}
202
203.requests-menu-timings-division[division-scale=minute] {
204 -moz-border-start-color: #FF0000 !important; /* Red highlight color */
205 font-weight: 600;
206}
207
f30073a6 208/* Network requests table: waterfall items */
cc7e70eb
RK
209
210.requests-menu-subitem.requests-menu-waterfall {
211 -moz-padding-start: 4px;
212 -moz-padding-end: 4px;
f30073a6 213 background-repeat: repeat-y; /* Background created on a <canvas> in js. */
45dc7657 214 background-position: -1px center;
f30073a6
RK
215 margin-top: -1px; /* Compensate borders. */
216 margin-bottom: -1px;
cc7e70eb
RK
217}
218
c4460289
RK
219.requests-menu-subitem.requests-menu-waterfall:-moz-locale-dir(rtl) {
220 background-position: right center;
221}
222
223.requests-menu-timings:-moz-locale-dir(ltr) {
224 transform-origin: left center;
225}
226
227.requests-menu-timings:-moz-locale-dir(rtl) {
228 transform-origin: right center;
229}
230
231.requests-menu-timings-total:-moz-locale-dir(ltr) {
cc7e70eb
RK
232 transform-origin: left center;
233}
234
c4460289
RK
235.requests-menu-timings-total:-moz-locale-dir(rtl) {
236 transform-origin: right center;
237}
238
cc7e70eb
RK
239.requests-menu-timings-total {
240 -moz-padding-start: 8px;
241 font-size: 85%;
242 font-weight: 600;
cc7e70eb
RK
243}
244
245.requests-menu-timings-cap {
246 width: 4px;
45dc7657
RK
247 height: 8px;
248
cc7e70eb
RK
249 border: 1px solid #FFCF00;
250}
251
252.requests-menu-timings-cap.start {
253 -moz-border-end: none;
c4460289
RK
254}
255
256.requests-menu-timings-cap.end {
257 -moz-border-start: none;
258}
259
260.requests-menu-timings-cap.start:-moz-locale-dir(ltr) {
cc7e70eb
RK
261 border-radius: 4px 0 0 4px;
262 transform-origin: right center;
263}
264
c4460289 265.requests-menu-timings-cap.start:-moz-locale-dir(rtl) {
cc7e70eb
RK
266 -moz-border-start: none;
267 border-radius: 0 4px 4px 0;
268 transform-origin: left center;
269}
270
c4460289
RK
271.requests-menu-timings-cap.end:-moz-locale-dir(ltr) {
272 border-radius: 0 4px 4px 0;
273 transform-origin: left center;
274}
275
276.requests-menu-timings-cap.end:-moz-locale-dir(rtl) {
277 border-radius: 4px 0 0 4px;
278 transform-origin: right center;
279}
280
cc7e70eb 281.requests-menu-timings-box {
45dc7657
RK
282 height: 8px;
283
cc7e70eb
RK
284 border-top: 1px solid #FFCF00;
285 border-bottom: 1px solid #FFCF00;
286}
287
288.requests-menu-timings-box.blocked,
289.requests-menu-timings-cap.blocked {
290 background-color: #FF0000;
291}
292
293.requests-menu-timings-box.dns,
294.requests-menu-timings-cap.dns {
295 background-color: #6000CF;
296}
297
298.requests-menu-timings-box.connect,
299.requests-menu-timings-cap.connect {
300 background-color: #FF9F00;
301}
302
303.requests-menu-timings-box.send,
304.requests-menu-timings-cap.send {
305 background-color: #FFCF00;
306}
307
308.requests-menu-timings-box.wait,
309.requests-menu-timings-cap.wait {
310 background-color: #9C9CFF;
311}
312
313.requests-menu-timings-box.receive,
314.requests-menu-timings-cap.receive {
315 background-color: #A09090;
316}
317
e2734cc7
RK
318/* SideMenuWidget */
319
45dc7657
RK
320.side-menu-widget-item-contents {
321 padding: 0px;
322}
323
de57e474
RK
324.side-menu-widget-container {
325 box-shadow: none !important;
326}
327
45dc7657 328.side-menu-widget-item:not(.selected)[odd] {
cc7e70eb
RK
329 background: rgba(255,159,0,0.1);
330}
331
332/* Network request details */
333
334#details-pane {
cc7e70eb
RK
335 max-width: 500px;
336}
337
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
359.tabpanel-summary-container {
360 padding: 1px;
361}
362
363.tabpanel-summary-label {
364 -moz-padding-start: 4px;
365 -moz-padding-end: 3px;
366 font-weight: 600;
cc7e70eb
RK
367}
368
369.tabpanel-summary-value {
370 -moz-padding-start: 3px;
cc7e70eb
RK
371}
372
373/* Headers tabpanel */
374
375#headers-summary-status,
376#headers-summary-version {
377 padding-bottom: 2px;
378}
379
380#headers-summary-size {
381 padding-top: 2px;
382}
383
e7c8bab1
RK
384#headers-summary-resend {
385 margin: 0 6px;
386/* min-height: 20px;*/
387}
388
cc7e70eb
RK
389/* Response tabpanel */
390
e2734cc7
RK
391#response-content-info-header {
392 background-color: #A09090;
393 color: #000000;
394 margin: 0;
395 padding: 5px 8px;
396}
397
cc7e70eb
RK
398#response-content-image-box {
399 padding-top: 10px;
400 padding-bottom: 10px;
401}
402
403#response-content-image {
404 background: #FFFFFF;
405 border: 1px dashed #A09090;
406 margin-bottom: 10px;
407}
408
409/* Timings tabpanel */
410
411#timings-tabpanel .tabpanel-summary-label {
412 width: 10em;
413}
414
415#timings-tabpanel .requests-menu-timings-box {
416 transition: transform 0.2s ease-out;
417 min-width: 1px;
45dc7657 418 border: none;
cc7e70eb
RK
419}
420
421#timings-tabpanel .requests-menu-timings-total {
422 transition: transform 0.2s ease-out;
423}
f30073a6 424
e7c8bab1
RK
425/* Custom request form */
426
427#custom-pane {
428 padding: 0.6em 0.5em;
429}
430
431.custom-header {
432 font-size: 1.1em;
433}
434
435.custom-section {
436 margin-top: 0.5em;
fe524e0c
RK
437}
438
439#custom-method-value {
440 width: 4.5em;
e7c8bab1
RK
441}
442
e2734cc7
RK
443/* Footer */
444
445#requests-menu-footer {
446 border-top: 1px solid #9C9CFF;
447 padding-top: 3px;
448}
449
450.requests-menu-footer-button,
451.requests-menu-footer-label {
452 min-width: 1em;
453 margin: 0;
454 -moz-margin-end: 3px;
455 border: none;
456 padding: 0px 1.5vw;
45dc7657 457
e2734cc7
RK
458/* color: #fff;*/
459}
460
461.requests-menu-footer-spacer {
462 min-width: 2px;
463}
464
465.requests-menu-footer-spacer,
466.requests-menu-footer-button {
467}
468
469.requests-menu-footer-button {
470}
471
472.requests-menu-footer-button:hover {
473}
474
475.requests-menu-footer-button:hover:active {
476}
477
478.requests-menu-footer-button:not(:active)[checked] {
479}
480
481.requests-menu-footer-label {
482 font-weight: 600;
483}
484
f30073a6
RK
485/* Responsive sidebar */
486@media (max-width: 700px) {
487 #requests-menu-toolbar {
488 height: 24px;
489 }
490
491 .requests-menu-header-button {
45dc7657 492 min-height: 24px;
e2734cc7
RK
493 }
494
495 .requests-menu-footer-button,
496 .requests-menu-footer-label {
497 padding: 0px 2vw;
f30073a6
RK
498 }
499
500 #details-pane {
501 max-width: none;
502 margin: 0 !important;
503 /* To prevent all the margin hacks to hide the sidebar. */
504 }
505
506 .requests-menu-status-and-method {
e2734cc7 507 width: 16vw;
f30073a6
RK
508 }
509
510 .requests-menu-file,
511 .requests-menu-domain {
512 width: 30vw;
f30073a6
RK
513 }
514
515 .requests-menu-type {
516 width: 8vw;
517 }
518
519 .requests-menu-size {
520 width: 16vw;
521 border-width: 0 !important;
522 box-shadow: none !important;
523 /* The "Timeline" header is not visible anymore, and thus the
524 right border and box-shadow of "Size" column should be hidden. */
525 }
526}
527
528@media (min-width: 701px) {
529 #network-table[type-overflows] .requests-menu-domain {
530 border-width: 0 !important;
531 box-shadow: none !important;
532 /* The "Type" header is not visible anymore, and thus the
533 right border and box-shadow of "Domain" column should be hidden. */
534 }
535
536 #network-table[domain-overflows] .requests-menu-file {
537 border-width: 0 !important;
538 box-shadow: none !important;
539 /* The "Domain" header is not visible anymore, and thus the
540 right border and box-shadow of "File" column should be hidden. */
541 }
542}
45dc7657
RK
543
544/* === END netmonitor.inc.css === */