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