tazpanel view styles/default/base.css @ rev 500

'Cannot resolve hostname (localhost)' workaround
author Pascal Bellard <pascal.bellard@slitaz.org>
date Sat Jun 06 12:38:24 2015 +0200 (2015-06-06)
parents 470ab4241de5
children 3117717c007d
line source
1 /**
2 * CSS style for TazPanel - (C) 2011-2015 SliTaz GNU/Linux
3 */
4
5
6 /* To always have a scroll bar */
7 /*html { min-height: 102%; } */
8
9 body { color: CaptionText; font: caption; margin: 72px 0 0 0; }
10
11
12
13 /**
14 * Header and main title
15 */
16
17 body > header {
18 position: fixed; top: 0; left: 0;
19 width: 100%;
20 background-color: #222;
21 }
22
23 body > header h1 {
24 margin: 0;
25 color: #fff;
26 font-size: 18px; line-height: 40px; /* center vertical */
27 font-style: italic;
28 white-space: nowrap; overflow: hidden;
29 vertical-align: middle;
30 }
31
32
33 /**
34 * Toolbar with menu
35 */
36
37 nav {
38 position: fixed; top: 40px; left: 0;
39 width: 100%;
40 display: table;
41 border: 1px solid; border-right: none; border-left: none;
42 }
43
44
45
46 /* menu panel */
47 #toolbarMenu { margin: 0; padding: 0; height: 100%; font: menu; }
48
49 /* shadows */
50 #toolbar { z-index: 10; box-shadow: 0 0 8px #000; }
51 menu.opened, menu.opened li:hover menu { z-index: 9; box-shadow: 2px 2px 8px hsla(0, 0%, 0%, 0.3); }
52
53 /* menu items */
54 #toolbarMenu li {
55 list-style: none;
56 float: left;
57 display: block;
58 padding: 0;
59 color: inherit; background: inherit;
60 outline: none;
61 }
62 #toolbarMenu > li > span {
63 display: inline-block;
64 padding: 0.2rem;
65 cursor: pointer;
66 }
67
68 #toolbarMenu menu li a {
69 padding: 0.2rem;
70 }
71
72 /* Selected menu item */
73 #toolbarMenu li:focus span,
74 #toolbarMenu li:hover span,
75 #toolbarMenu menu li:focus,
76 .user #toolbarMenu menu li:hover > a:not([data-root]),
77 .root #toolbarMenu menu li:hover {
78 background-color: hsla(30, 100%, 50%, 0.5);
79 }
80
81
82
83
84 #toolbarMenu menu {
85 position: absolute;
86 margin: 0; padding: 0;
87 white-space: nowrap;
88 border: 1px solid;
89 display: none;
90 }
91
92 /* Submenus */
93 #toolbarMenu menu menu {
94 left: 100%; top: 0;
95 min-width: 100%;
96 }
97
98 /* Show menu list */
99 #toolbarMenu menu.opened {
100 display: block; z-index: 10;
101 }
102
103 /* By default hide submenus */
104 #toolbarMenu menu.opened menu {
105 display: none;
106 }
107 /* Show submenu on mouse over */
108 .opened li:hover menu { display: block !important; }
109
110 /* Menu items one below the other */
111 #toolbarMenu menu li {
112 position: relative;
113 float: none;
114 }
115 /* Show arrow for submenu */
116 #toolbarMenu a:after { content: "‣"; float: right; }
117 #toolbarMenu a:only-child:after { content: " "; }
118
119 #toolbarMenu a { display: block; color: inherit; text-decoration: none; }
120
121 /* Clicking this layer close menu */
122 #noMenu {
123 position: absolute; top: 63px; bottom: 0; left: 0; right: 0;
124 background-color: transparent;
125 display: none;
126 z-index: 9;
127 }
128
129
130 /**
131 * Panes, sections
132 */
133
134 section {
135 display: block;
136 border: 1pt solid; border-radius: 0.3rem;
137 padding: 0; margin: 0.5rem 0 0 0;
138 }
139
140 section header {
141 padding: 0.2rem 0.3rem; margin: 0;
142 display: table; width: 100%;
143 border-radius: 0.3rem 0.3rem 0 0;
144 font-weight: bold; font-size: 1.1rem;/* line-height: 0;*/
145 text-shadow: 0 1px 1px hsla(0, 0%, 0%, 0.2);
146 overflow: auto; /* provide break after floated objects */
147 vertical-align: baseline;
148 }
149 section header form, section footer form {
150 display: table-cell; vertical-align: baseline; line-height: 0; width: 1px; white-space: nowrap;
151 }
152 section header button, section footer button { margin: 0; }
153
154 section footer {
155 padding: 0 0.3rem 0.2rem; margin: 0;
156 display: block;
157 overflow: auto; /* provide break after floated objects */
158 vertical-align: baseline;
159 }
160
161 section > pre,
162 section div { padding: 0.3rem 0.3rem 0.2rem 0.3rem; margin: 0; }
163 section td:nth-child(1) { padding-left: 0.3rem; }
164 section table { margin-bottom: 0.3rem; }
165 .nogap { word-spacing: 0; } /* remove gap between buttons in line */
166
167 .scroll { max-height: 12rem; overflow: auto; }
168 section .scroll { padding: 0; margin: 0; border: 1pt solid; }
169 section pre.scroll { margin: 0.1rem; padding: 0.1rem; }
170
171
172
173
174
175
176
177
178 #actions {
179 display: block;
180 margin: 0; padding: 0.2rem 0.3rem;
181 overflow: auto; /* provide break after floated objects */
182 }
183 .float-left, .float-right { display: table-cell; padding: 0; margin: 0; }
184 .float-left { float: left; }
185 .float-right { float: right; }
186
187
188
189 fieldset { border: 1pt solid; border-radius: 0.3rem; margin-bottom: 0.2rem; }
190 fieldset[disabled] { background-color: hsla(0, 0%, 50%, 0.1);}
191
192
193
194
195
196 /* Icons on the right of the toolbar */
197 #icons {
198 display: table-cell; vertical-align: middle; /* center vertical */
199 padding: 0.1rem 0.3rem;
200 white-space: nowrap; width: 1rem; /* minimal width */
201 }
202
203
204
205 /* Loading notification bar */
206 #loading {
207 position: fixed; top: 76px; right: 140px; width: 248px;
208 padding: 4px 4px 2px;
209 background-color: #f8f8f8; color: #666;
210 border: 1px solid #ddd;
211 cursor: progress;
212 }
213
214
215
216 /* Page content container */
217 #content { margin: 0; padding: 1ex; }
218
219
220 /* Page first header */
221 h2 { font-size: 1.5rem; height: 1.5rem; padding: 0; margin: 0; }
222
223
224 /* Additional headers (obsolete) */
225 h3 { font-size: 1.3rem; margin: 0; }
226 h4 { font-size: 1.1rem; margin: 0; }
227
228
229 /* Plain paragraph */
230 p { margin: 0.5ex 0; }
231
232
233 #actions p { margin: 6px 0; }
234
235
236
237
238
239 button img { padding: 0 3px 0 0; margin: 0; }
240 button, input, select {
241 /*color: ButtonText;*/
242 vertical-align: middle; }
243 button:before, input:before, select:before {
244 padding: 3px; }
245
246 ul { list-style-type: square; }
247 li { padding: 4px 0; }
248
249
250 /* Blocks */
251
252 #block { float: left; }
253
254 #wrapper, .wrapper { margin: 20px 0; }
255
256 .box {
257 display: table;
258 padding: 1em;
259 width: 50%; margin: 0.5em auto;
260 }
261 .box img { float: left; }
262
263 .box ul { list-style-type: none; padding: 0; }
264
265 .debug {
266 position: fixed;
267 bottom: 0px;
268 right: 10px;
269 left: 10px;
270 margin: 5px;
271 padding: 4px 10px;
272 background-color: #111;
273 color: #fff;
274 border: 0;
275 /*font-size: 12px;*/
276 opacity: 0.9;
277 }
278
279
280
281
282 /**********
283 * Tables *
284 **********/
285
286 /* Base style */
287 table { margin: 0; padding: 0; border: 0 none; border-collapse: collapse; }
288
289 /* Bold header */
290 thead { font-weight: bold; }
291
292 /* Wide table */
293 .wide { width: 100%; }
294
295 /* Center content excluding first column */
296 .center tr td { text-align: center; }
297 .center tr td:nth-child(1) { text-align: left; padding-left: 0.3rem; }
298
299 /* Table Zebra */
300 .zebra thead td { line-height: 1.5em; text-align: center; vertical-align: middle; border: 1pt solid; }
301
302
303
304 .borders.zebra td + td { border-left: 1px solid; }
305
306
307
308 .outbox { box-shadow: 0 0 2px 4px #ddd; }
309 .fixed { table-layout: fixed; }
310
311
312 .borders tr { border-bottom: 1pt solid; }
313
314 .hborders thead tr { border-top: 1.5pt solid; border-bottom: 1.5pt solid; }
315
316 td.small { min-width: 60px; }
317 td.pct { min-width: 200px; background: #eee; }
318 div.pct { background: #ccc; }
319 td.pct, div.pct { border-radius: 2px; }
320 td img {vertical-align: middle; }
321
322 table.daemons td:nth-child(4), table.daemons td:nth-child(5) { text-align: center; }
323
324
325
326
327
328 /**
329 * Misc
330 */
331
332 /* Links */
333
334 a { text-decoration: none; color: #268bd2; cursor: pointer; }
335 a:not([data-img]):hover { text-decoration: underline; }
336
337
338 form { display: inline-block; padding: 0; margin: 0; }
339
340 pre { margin: 0; padding: 0; color: CaptionText; }
341
342 .pre-main { margin: 16px 0; }
343 .pre-wrap { white-space: pre-wrap; }
344
345
346
347 /* Round corner */
348
349 #loading, .debug, .box, .outbox, section {
350 -moz-border-radius: 4px;
351 -webkit-border-radius: 4px;
352 border-radius: 4px;
353 }
354
355 /* Help page */
356
357 #help { text-align: justify; }
358 #help a { text-decoration: underline; }
359 #help a:hover { text-decoration: none; }
360
361
362
363 /*
364 * Page footer
365 */
366
367 body > footer {
368 border-top: 1px solid;
369 text-align: center;
370 height: 19px; margin: 0; padding: 0;
371 line-height: 16px; vertical-align: middle;
372 z-index: 10;
373 overflow: hidden;
374 }
375 #defaultStatus, #statusBar { font-size: smaller; vertical-align: middle; }
376
377 #content { z-index: 5; }
378
379 #ajaxStatus {
380 position: absolute; right: 0; top: -4px;
381 display: inline-block;
382 font-size: 16px!important; line-height: 16px!important; vertical-align: middle;
383 padding: 0; margin: 0;
384 height: 16px;
385 }
386
387 /***************
388 * HTML5 Meter *
389 ***************/
390
391 .meter {
392 height: 1.2rem;
393 min-width: 150px;
394 color: #222;
395 /*cursor: default;*/
396 }
397 .meter meter {
398 height: inherit;
399 width: 100%;
400 display: block;
401 border: 1px solid #ddd;
402 border-radius: 4px;
403 }
404 .meter span {
405 display: block;
406 white-space: nowrap;
407 position: absolute;
408 margin: -1.1rem auto 0 0.3rem;
409 }
410
411
412
413 /**************
414 * Animations *
415 **************/
416
417 a.button {
418 -webkit-transition: all 0.3s ease-in-out;
419 -moz-transition: all 0.3s ease-in-out;
420 -o-transition: all 0.3s ease-in-out;
421 -ms-transition: all 0.3s ease-in-out;
422 transition: all 0.3s ease-in-out;
423 }
424
425 /*section {
426 margin: 20pt -0.7em;
427 padding: 0.8em 0.7em 1.2em;
428 background-color: #fdfdfd;
429 border: 1px solid #ddd;
430 border-radius: 1em;
431 box-shadow: 0 0 3pt 2pt #eee;
432 }
433 section h4 {
434 margin: 0 0 0.5em 0;
435 }
436 section h3 {
437 margin: 0 0 0.5em 0; }
438 */
439
440 #tabs {
441 font-weight: bold;
442 /*font-size: 14px;*/
443 list-style-type: none;
444 padding-bottom: 25px;
445 border-bottom: 1px solid #aaa;
446 }
447
448 #tabs li {
449 float: left;
450 height: 16px;
451 background-color: #eee;
452 margin: 0 40px 0 -40px;
453 border: 1px solid #aaa;
454 text-align: center;
455 min-width: 100px;
456 -webkit-border-radius: 4px 4px 0 0;
457 -moz-border-radius: 4px 4px 0 0;
458 border-radius: 4px 4px 0 0;
459 -webkit-appearance: tab;
460 appearance: tab;
461 }
462
463 #tabs li.active {
464 border-bottom: 1px solid #fff;
465 background-color: #fff;
466 }
467
468 #tabs a {
469 padding: 8px;
470 }
471
472
473
474 /****************
475 * Search block *
476 ****************/
477 .search {
478 display: block; white-space: nowrap;
479 position: fixed; right: 7px; top: 7px;
480 margin: 0; padding: 0; border: none;
481 }
482 .search input {
483 display: inline-block;
484 width: 200px; height: 24px;
485 }
486 .search button {
487 -webkit-appearance: button;
488 height: 100%; margin: 0;
489 }
490
491
492
493 /**********************
494 * Buttons with icons *
495 **********************/
496 @font-face {
497 font-family: TazPanelWeb;
498 src: url('/styles/default/tazpanel.ttf');
499 }
500
501 [data-icon]:before, [data-img] {
502 vertical-align: baseline;
503 padding: 0;
504 margin: 0 /*0 0 -0.5em*/;
505 font-size: 1.2em;
506 font-family: TazPanel, TazPanelWeb;
507
508 font-style: normal;
509 font-weight: normal;
510 font-variant: normal;
511 text-transform: none;
512 line-height: 1.2em;
513 display: inline-block;
514 text-decoration: none;
515 width: 1.2em; text-align: center;
516
517 -webkit-font-feature-settings: "liga", "dlig";
518 -moz-font-feature-settings: "liga=1, dlig=1";
519 -o-font-feature-settings: "liga", "dlig";
520 font-feature-settings: "liga", "dlig";
521
522 -webkit-text-rendering: optimizeLegibility;
523 -moz-text-rendering: optimizeLegibility;
524 -o-text-rendering: optimizeLegibility;
525 text-rendering: optimizeLegibility;
526
527 -webkit-font-smoothing: antialiased;
528 -moz-font-smoothing: antialiased;
529 -o-font-smoothing: antialiased;
530 font-smoothing: antialiased;
531 }
532 button[data-icon]::before { font-size: 16px; line-height: 16px; width: 16px; }
533
534 [data-icon]::before { content: attr(data-icon); }
535 [data-img]::before { content: attr(data-img); }
536
537 [data-icon], [data-img] { display: inline-block; }
538
539
540 /* Solarized:
541 red #dc322f
542 orange #cb4b16
543 yellow #b58900
544 green #859900
545 cyan #2aa198
546 blue #268bd2
547 magenta #d33682
548 */
549
550
551 [data-icon="tazpanel"]::before {
552 display: inline-block;
553 content: '\f151';
554 color: #EBEBEB;
555 border: 1pt solid hsl(5, 85%, 35%); border-radius: 0.2rem;
556 font-size: 32px; line-height: 32px;
557
558 height: 32px; width: 32px;
559 margin: 0.2rem;
560 padding: 0;
561 vertical-align: top;
562 background-image: -webkit-linear-gradient(top, hsl(10, 100%, 40%), hsl(0, 70%, 30%));
563 }
564 .light [data-icon="tazpanel"]::before {
565 text-shadow: 0 1pt 2pt hsla(0, 0%, 0%, 0.9), 0 0 2pt hsla(0, 0%, 0%, 0.6);
566 }
567
568
569
570 /*******************
571 * Terminal colors *
572 *******************/
573
574 /* Using color palettes from Sakura terminal source */
575
576 .term {
577 padding: 0.3rem;
578 height: 24rem; max-height: 24rem;
579 white-space: pre-wrap;
580 overflow: auto;
581 z-index: 4;
582 background: transparent;
583 }
584
585 /* SliTaz Spider on background */
586 /*.term_ { display: block; position: relative; z-index: 2; }
587 .term_::after {
588 display: block; border: 1pt solid;
589 font-family: TazPanel;
590 font-size: 16rem;
591 position: absolute; right: 0; bottom: 0;
592 content: '\f13f';
593 opacity: 1;
594 color: orange;
595 z-index: 1;
596 }*/
597
598 .term.log { white-space: pre; }
599 /*.term input[type="text"] {
600 width: 100%!important; padding: 0; margin: 0; vertical-align: middle;
601 -webkit-appearance: none!important; -moz-appearance: none; appearance: none;
602 display: inline;
603 background-color: transparent; color: inherit; border: none; outline: none;
604 font: inherit; line-height: 1rem;
605 }*/
606 .term .cmdline {
607 /*position: relative; float: left; display: inline-block; white-space: pre-wrap;
608 width: 100%; overflow: hidden; left: 0;
609 vertical-align: middle;*/
610 padding: 0;
611 }
612 #typeField {
613 outline-style: none !important;
614 -webkit-user-modify: read-write;
615 word-wrap: break-word;
616 -webkit-nbsp-mode: space;
617 -webkit-line-break: after-white-space;
618 }
619 #num_hist {
620 display: inline-block;
621 position: absolute; right: 0.5rem; float: right;
622 height: 0;
623 color: #FFF; background: #FFF;
624 }
625
626 /* Tango palette (default) */
627 .color30{color:#2E3436} .color1.color30{color:#555753} .color40{background:#2E3436}
628 .color31{color:#CC0000} .color1.color31{color:#EF2929} .color41{background:#CC0000}
629 .color32{color:#4E9A06} .color1.color32{color:#8AE234} .color42{background:#4E9A06}
630 .color33{color:#C4A000} .color1.color33{color:#FCE94F} .color43{background:#C4A000}
631 .color34{color:#3465A4} .color1.color34{color:#729FCF} .color44{background:#3465A4}
632 .color35{color:#75507B} .color1.color35{color:#AD7FA8} .color45{background:#75507B}
633 .color36{color:#06989A} .color1.color36{color:#34E2E2} .color46{background:#06989A}
634 .color37{color:#D3D7CF} .color1.color37{color:#EEEEEC} .color47{background:#D3D7CF}
635 .term {color:#D3D7CF; background:#2E3436}
636
637 /* Linux palette */
638 .linux .color30{color:#000} .linux .color1.color30{color:#555} .linux .color40{background:#000}
639 .linux .color31{color:#A00} .linux .color1.color31{color:#F55} .linux .color41{background:#A00}
640 .linux .color32{color:#0A0} .linux .color1.color32{color:#5F5} .linux .color42{background:#0A0}
641 .linux .color33{color:#A50} .linux .color1.color33{color:#FF5} .linux .color43{background:#A50}
642 .linux .color34{color:#00A} .linux .color1.color34{color:#55F} .linux .color44{background:#00A}
643 .linux .color35{color:#A0A} .linux .color1.color35{color:#F5F} .linux .color45{background:#A0A}
644 .linux .color36{color:#0AA} .linux .color1.color36{color:#5FF} .linux .color46{background:#0AA}
645 .linux .color37{color:#AAA} .linux .color1.color37{color:#FFF} .linux .color47{background:#AAA}
646 .linux.term {color:#AAA; background:#000}
647
648 /* Xterm palette */
649 .xterm .color30{color:#000000} .xterm .color1.color30{color:#4C4C4C} .xterm .color40{background:#000000}
650 .xterm .color31{color:#CD0000} .xterm .color1.color31{color:#FF0000} .xterm .color41{background:#CD0000}
651 .xterm .color32{color:#00CD00} .xterm .color1.color32{color:#00FFFF} .xterm .color42{background:#00CD00}
652 .xterm .color33{color:#CDCD00} .xterm .color1.color33{color:#FFFF00} .xterm .color43{background:#CDCD00}
653 .xterm .color34{color:#1E90FF} .xterm .color1.color34{color:#4682B4} .xterm .color44{background:#1E90FF}
654 .xterm .color35{color:#CD00CD} .xterm .color1.color35{color:#FF00FF} .xterm .color45{background:#CD00CD}
655 .xterm .color36{color:#00CDCD} .xterm .color1.color36{color:#00FFFF} .xterm .color46{background:#00CDCD}
656 .xterm .color37{color:#E5E5E5} .xterm .color1.color37{color:#FFFFFF} .xterm .color47{background:#E5E5E5}
657 .xterm.term {color:#E5E5E5; background:#000000}
658
659 /* Rxvt palette */
660 .rxvt .color30{color:#000000} .rxvt .color1.color30{color:#404040} .rxvt .color40{background:#000000}
661 .rxvt .color31{color:#CD0000} .rxvt .color1.color31{color:#FF0000} .rxvt .color41{background:#CD0000}
662 .rxvt .color32{color:#00CD00} .rxvt .color1.color32{color:#00FFFF} .rxvt .color42{background:#00CD00}
663 .rxvt .color33{color:#CDCD00} .rxvt .color1.color33{color:#FFFF00} .rxvt .color43{background:#CDCD00}
664 .rxvt .color34{color:#0000CD} .rxvt .color1.color34{color:#0000FF} .rxvt .color44{background:#0000CD}
665 .rxvt .color35{color:#CD00CD} .rxvt .color1.color35{color:#FF00FF} .rxvt .color45{background:#CD00CD}
666 .rxvt .color36{color:#00CDCD} .rxvt .color1.color36{color:#00FFFF} .rxvt .color46{background:#00CDCD}
667 .rxvt .color37{color:#FAEBD7} .rxvt .color1.color37{color:#FFFFFF} .rxvt .color47{background:#FAEBD7}
668 .rxvt.term {color:#FAEBD7; background:#000000}
669
670 /* Echo palette (http://mso-chronicles.blogspot.com/2013/02/xfce-terminal-and-xchat-colour-scheme.html) */
671 .echo .color30{color:#000000} .echo .color1.color30{color:#5E5E5E} .echo .color40{background:#000000}
672 .echo .color31{color:#B40000} .echo .color1.color31{color:#FF5200} .echo .color41{background:#B40000}
673 .echo .color32{color:#00AA00} .echo .color1.color32{color:#93DA00} .echo .color42{background:#00AA00}
674 .echo .color33{color:#CB7C00} .echo .color1.color33{color:#FFE139} .echo .color43{background:#CB7C00}
675 .echo .color34{color:#003F68} .echo .color1.color34{color:#0073A2} .echo .color44{background:#003F68}
676 .echo .color35{color:#BF00EF} .echo .color1.color35{color:#DB81FF} .echo .color45{background:#BF00EF}
677 .echo .color36{color:#00A6D0} .echo .color1.color36{color:#81E3FF} .echo .color46{background:#00A6D0}
678 .echo .color37{color:#C6C6C6} .echo .color1.color37{color:#FFFFFF} .echo .color47{background:#C6C6C6}
679 .echo.term {color:#C6C6C6; background:#000000}
680
681 .color1 { font-weight: bold; }
682
683 /* History table for terminal */
684 .history { width: 100%; }
685 .history td:nth-child(1), .history td:nth-child(2), .history td:nth-child(3) {
686 white-space: nowrap;
687 width: 1px;
688 }
689
690
691
692 /**********
693 * Inputs *
694 **********/
695
696 /*:default { outline: 1px dotted hsla(240, 100%, 50%, 0.5); outline-offset: -4px; }*/
697 :required { outline: 1px solid hsla( 30, 100%, 50%, 0.7); outline-offset: -3px; }
698 :invalid { outline: 2px solid hsla( 0, 100%, 50%, 0.7); outline-offset: -3px; }
699
700
701 /* HACK for Tazweb (as clean Webkit browser): remove 1px white border around textfield */
702 input[type="text"], input[type="password"], input[type="number"], textarea { -webkit-appearance: searchfield; }
703
704 textarea { display: block; color: CaptionText; font-family: monospace; box-sizing: border-box; }
705
706
707
708
709
710 /***********************
711 * System memory gauge *
712 ***********************/
713
714 .sysmem {
715 margin: 0.2rem; padding: 0;
716 border: 1pt solid;
717 border-radius: 0.2rem;
718 box-shadow: inset 0 0 0 1pt hsla(0, 0%, 100%, 0.05);
719 width: 100%; margin: 0; padding: 0;
720 }
721
722 .sysmem_used, .sysmem_buff, .sysmem_free {
723 display: inline-block;
724 padding: 0.2rem 0; margin: 0;
725 height: 120%;
726 text-align: center; vertical-align: middle;
727 text-shadow: 0 1px 1px hsla(0, 0%, 0%, 0.5);
728 text-align: center;
729 }
730
731 .sysmem_used {
732 background-color: #f28f68;
733 background-image: -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0.25), hsla(0, 0%, 0%, 0.2));
734 border-radius: 0.2rem 0 0 0.2rem;
735 }
736 .sysmem_buff {
737 background-color: #f28f68;
738 background-image:
739 -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0.25), hsla(0, 0%, 0%, 0.2)),
740 -webkit-linear-gradient(135deg,
741 transparent, transparent 25%,
742 #719fd1 25%, #719fd1 50%,
743 transparent 50%, transparent 75%,
744 #719fd1 75%);
745 background-size: 100% 100%;
746 }
747 .sysmem_free {
748 background-color: #719fd1;
749 background-image: -webkit-linear-gradient(top, hsla(0, 0%, 100%, 0.25), hsla(0, 0%, 0%, 0.2));
750 border-radius: 0 0.2rem 0.2rem 0;
751 }
752
753
754
755 /* Disable some links to root actions */
756 button:not([disabled]) { cursor: pointer; }
757 .user [data-root] { pointer-events: none; cursor: default !important; }
758
759
760 html,body { height: 100%; width: 100%; margin: 0; padding: 0; }
761 body > header { position: absolute; top: 0; }
762 body > footer { position: absolute; bottom: 0; left: 0; right: 0; }
763 #content, #content-sidebar {
764 position: absolute; top: 63px; bottom: 20px; left: 0; right: 0;
765 overflow-y: auto; overflow-x: hidden;
766 }
767
768 .bigNoScrollable { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; }
769 section.bigNoScrollable { margin: 0.5rem; }
770
771 .bigScrollable { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: auto; }
772 #fileContent.bigScrollable { margin: 0.2rem; top: 2.5rem; }