* luci/themes: fix help text styles in openwrt.org theme
[project/luci.git] / themes / openwrt.org / htdocs / luci-static / openwrt.org / cascade.css
1 * {
2 margin: 0;
3 padding: 0;
4 }
5
6 body {
7 background-color: #4a6b7c;
8 background-image: url(bg.jpg);
9 background-position: bottom center;
10 background-attachment: fixed;
11 background-repeat: repeat-x;
12 color: #ffffff;
13 font-family: Verdana, Arial, sans-serif;
14 font-size: 100%;
15 line-height: 100%;
16 }
17
18 code {
19 font-family: monospace;
20 white-space: pre;
21 }
22
23 div#content ul {
24 margin-left: 2em;
25 }
26
27 .warning {
28 color: red !important;
29 font-weight: bold;
30 }
31
32 .clear {
33 clear: both;
34 height: 1px;
35 }
36
37 .hidden {
38 display: none;
39 }
40
41 .error {
42 color: #ff0000;
43 }
44
45 #header {
46 min-height: 98px;
47 background-image: url(header.png);
48 background-repeat: no-repeat;
49 background-position: left center;
50 background-color: #557788;
51 text-align: right;
52 }
53
54 #header .info {
55 padding: 1em 1em;
56 font-size: 70%;
57 line-height: 160%;
58 }
59
60 #header .title {
61 display: none;
62 }
63
64 .pathbar {
65 display: none;
66 }
67
68 .menubar {
69 width: 100%;
70 min-height: 1.8em;
71 background: #000000;
72 color: #ffffff;
73 }
74
75 .mainmenu {
76 float: left;
77 width: auto;
78 min-height: 1.8em;
79 background: #000000;
80 color: #ffffff;
81 }
82
83 .mainmenu div {
84 float: left;
85 }
86
87 .mainmenu li {
88 white-space: nowrap;
89 }
90
91 .mainmenu div ul {
92 display: none;
93 position: absolute;
94 background: #000000;
95 color: #ffffff;
96 border-width: 0 1px 1px 1px;
97 border-style: solid;
98 border-color: #444444;
99 list-style-type: none;
100 }
101
102 .mainmenu ul li:hover > ul,
103 .mainmenu div:hover > ul {
104 display: block;
105 }
106
107 .mainmenu ul li > ul {
108 left: 100%;
109 margin-top: -1.8em;
110 border-width: 1px;
111 }
112
113 .modemenu a,
114 .mainmenu a {
115 display: block;
116 padding: 0.5em;
117 color: #ffffff;
118 text-decoration: none;
119 font-size: 80%;
120 }
121
122 .mainmenu .active a,
123 .modemenu .active a {
124 color: #ffff00;
125 font-weight: bold;
126 }
127
128 .mainmenu li:hover > span > a,
129 .mainmenu div:hover > a {
130 font-weight: bold;
131 }
132
133 .modemenu a:hover,
134 .modemenu a:focus,
135 .mainmenu a:hover,
136 .mainmenu a:focus {
137 color: #ffff00;
138 font-weight: bold;
139 }
140
141 .mainmenu div.preactive > a {
142 color: #ffff00;
143 font-weight: bold;
144 }
145
146 .modemenu ul {
147 width: auto;
148 background: #000000;
149 color: #ffffff;
150 list-style-type: none;
151 }
152
153 .modemenu li {
154 float: right;
155 }
156
157 #content {
158 clear: both;
159 width: 80%;
160 margin: 0 auto;
161 padding: 0.5em;
162 background: #f5f5f5;
163 color: #000000;
164 border-width: 0 1px 1px 1px;
165 border-style: solid;
166 border-color: #444444;
167 font-size: 80%;
168 }
169
170 #content h1 {
171 margin: 0.25em 0 0.5em 0;
172 font-size: 150%;
173 font-weight: normal;
174 }
175
176 #content h2 {
177 margin: 0.5em 0;
178 font-size: 120%;
179 font-weight: normal;
180 text-decoration: underline;
181 }
182
183 #content p {
184 margin-bottom: 1em;
185 }
186
187 .cbi-section {
188 margin-bottom: 0.5em;
189 padding: 0.5em 1em;
190 border: 1px dotted #555555;
191 background-color: #ffffff;
192 }
193
194 .cbi-section legend {
195 font-size: 110%;
196 font-weight: bold;
197 height: 1em;
198 padding: 0 0.25em;
199 color: #555555;
200 }
201
202 .cbi-section h2 {
203 margin: 0em 0 0.5em -0.5em !important;
204 }
205
206 .cbi-section h3 {
207 height: 1.5em;
208 font-size: 90%;
209 color: #555555;
210 }
211
212 .cbi-section-descr {
213 margin-bottom: 0.5em;
214 font-size: 95%;
215 }
216
217 .cbi-title-ref {
218 color: inherit;
219 text-decoration: none;
220 padding-right: 18px;
221 background: url('../resources/cbi/link.gif') no-repeat scroll right center;
222 background-color: inherit;
223 }
224
225 input[type=submit],
226 input[type=reset],
227 input[type=image],
228 label {
229 cursor: pointer;
230 }
231
232
233 select,
234 input,
235 textarea {
236 background: #eeeeee;
237 color: #000000;
238 border-width: 1px;
239 border-color: #000000;
240 }
241
242 input[type=image] {
243 border: none;
244 }
245
246 input:focus,
247 input:hover,
248 select:focus,
249 select:hover,
250 textarea:focus,
251 textarea:hover {
252 background-color: #ffffff;
253 }
254
255 select,
256 input[type=text],
257 input[type=password] {
258 width: 20em;
259 }
260
261 td select,
262 td input[type=text],
263 td input[type=password] {
264 width: 99%;
265 }
266
267 input.cbi-input-user {
268 background: url('../resources/cbi/user.gif') no-repeat scroll 1px center;
269 background-color: inherit;
270 padding-left: 17px;
271 }
272
273 input.cbi-input-key {
274 background: url('../resources/cbi/key.gif') no-repeat scroll 1px center;
275 background-color: inherit;
276 padding-left: 17px;
277 }
278
279 input.cbi-input-find {
280 background: url('../resources/cbi/find.gif') no-repeat scroll 1px center;
281 background-color: inherit;
282 padding-left: 17px;
283 }
284
285 input.cbi-input-reload {
286 background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center;
287 background-color: inherit;
288 padding-left: 17px;
289 }
290
291 input.cbi-input-add,
292 input.cbi-button-add {
293 background: url('../resources/cbi/add.gif') no-repeat scroll 1px center;
294 background-color: inherit;
295 padding-left: 17px;
296 padding-right: 1px;
297 }
298
299 input.cbi-input-fieldadd,
300 input.cbi-button-fieldadd {
301 background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center;
302 background-color: inherit;
303 padding-left: 17px;
304 padding-right: 1px;
305 }
306
307 input.cbi-input-reset,
308 input.cbi-button-reset {
309 background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center;
310 background-color: inherit;
311 padding-left: 17px;
312 padding-right: 1px;
313 }
314
315 input.cbi-input-save,
316 input.cbi-button-save {
317 background: url('../resources/cbi/save.gif') no-repeat scroll 1px center;
318 background-color: inherit;
319 padding-left: 17px;
320 padding-right: 1px;
321 }
322
323 input.cbi-input-apply,
324 input.cbi-button-apply {
325 background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center;
326 background-color: inherit;
327 padding-left: 17px;
328 padding-right: 1px;
329 }
330
331 input.cbi-input-remove,
332 div.cbi-section-remove input {
333 background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center;
334 background-color: inherit;
335 padding-left: 17px;
336 padding-right: 1px;
337 }
338
339 div.cbi-section-remove input {
340 border-bottom: none;
341 }
342
343 textarea {
344 margin-left: -1px;
345 margin-bottom: 0.5em;
346 }
347
348 form > div > input[type=submit],
349 form > div > input[type=reset] {
350 float: right;
351 margin-left: 0.5em;
352 }
353
354 table.smalltext {
355 background: #f5f5f5;
356 border-top: 1px solid #666666;
357 border-right: 1px solid #666666;
358 border-bottom: 1px solid #666666;
359 font-size: 90%;
360 width: 80%;
361 margin-left: auto;
362 margin-right: auto;
363 border-collapse: collapse;
364 }
365
366 table.smalltext tr:hover td {
367 background-color: #bbddee;
368 }
369
370 table.smalltext tr th {
371 padding: 0 0.25em;
372 border-left: 1px solid #666666;
373 text-align: left;
374 }
375
376 table.smalltext tr td {
377 padding: 0 0.25em;
378 border-top: 1px solid #666666;
379 border-left: 1px solid #666666;
380 }
381
382 .cbi-rowstyle-1 {
383 background-color: #eeeeff;
384 }
385
386 .cbi-rowstyle-2 {
387
388 }
389
390 div.cbi-value {
391 clear: left;
392 vertical-align: middle;
393 padding-left: 0.25em;
394 border-bottom: 1px dotted #bbbbbb;
395 }
396
397 div.cbi-value:hover {
398 background: #f8f8f8;
399 }
400
401 div.cbi-value:last-child {
402 border: none;
403 }
404
405 .cbi-value-title {
406 float: left;
407 width: 40%;
408 }
409
410 div.cbi-value-field {
411 width: 58%;
412 margin: 0.25em 0 0.25em 40%;
413 }
414
415 div.cbi-value-description {
416 font-size: 90%;
417 display: inline;
418 }
419
420 /*
421 div.cbi-value-field > div.cbi-value-description {
422 display: none;
423 }
424
425 div.cbi-value:hover div.cbi-value-field > div.cbi-value-description {
426 display: block;
427 }
428 */
429
430 div.cbi-section-create {
431 clear: left;
432 }
433
434 div.cbi-map-descr {
435 margin-bottom: 1em;
436 }
437
438 div.cbi-optionals {
439 margin: 0.5em 0;
440 padding: 0 0.25em;
441 }
442
443 div.cbi-section-remove {
444 float: right;
445 }
446
447 .cbi-section-node {
448 CLEAR: Both;
449 border: 1px dotted #bbbbbb;
450 padding-bottom: 0;
451 }
452
453 .cbi-section-node div.cbi-section-table-row {
454 margin: 0.25em;
455 }
456
457 table.cbi-section-table {
458 width: 100%;
459 font-size: 95%;
460 }
461
462 table.cbi-section-table th,
463 table.cbi-section-table td {
464 text-align: center;
465 }
466
467 tr.cbi-section-table-descr th {
468 font-weight: normal;
469 font-size: 90%;
470 }
471
472 td.cbi-section-table-optionals {
473 text-align: left !important;
474 padding-top: 1em;
475 }
476
477 .cbi-value-helpicon img {
478 vertical-align: bottom;
479 }
480
481 div.cbi-error {
482 font-size: 95%;
483 font-weight: bold;
484 color: #FF0000;
485 }
486
487 .right {
488 text-align: right;
489 }
490
491 .luci {
492 position: fixed;
493 bottom: 0;
494 left: 0;
495 text-align: right;
496 }
497
498 .luci a {
499 color: #666666;
500 text-decoration: none;
501 font-size: 70%;
502 }
503
504 .inline {
505 display: inline;
506 }
507
508 .error500 {
509 white-space: normal;
510 border: 1px dotted #FF0000;
511 background-color: #FFFFFF;
512 padding: 0.5em;
513 }
514
515 #memorybar {
516 width:200px;
517 height:8px;
518 border:1px solid #bbb;
519 background-color:red
520 }
521
522 #memfree, #membuffers, #memcached {
523 float:right;
524 border:1px solid #bbb;
525 height:6px;
526 }
527
528 #memfree {
529 background-color:green;
530 }
531
532 #membuffers {
533 background-color:yellow;
534 }
535
536 #memcached {
537 background-color:orange;
538 }
539
540
541 /* obligatory IE6 Voodoo Code */
542 * html body {
543 padding-left: 50% !important;
544 }
545
546 * html div#header {
547 margin-left: -100% !important;
548 }
549
550 * html div.menubar {
551 margin-left: -100% !important;
552 width: 200% !important;
553 }
554
555 * html div#content {
556 margin-left: -80% !important;
557 width: 160% !important;
558 }
559
560 * html div.mainmenu div.hover ul,
561 * html div.mainmenu div li.hover ul,
562 * html div.mainmenu div li li.hover ul,
563 * html div.mainmenu div li li li.hover ul,
564 * html div.mainmenu div li li li li.hover ul {
565 display: block !important;
566 margin-left: 3em;
567 }
568
569 * html div.mainmenu div.hover ul {
570 margin-left: 0;
571 }
572
573 * html div.mainmenu .hover ul ul,
574 * html div.mainmenu .hover ul ul ul,
575 * html div.mainmenu .hover ul ul ul ul,
576 * html div.mainmenu .hover ul ul ul ul ul {
577 display: none !important;
578 }
579
580 * html div.mainmenu li {
581 height: 1em !important;
582 width: 10em !important;
583 }
584
585 * html .mainmenu {
586 height: 1.8em;
587 }
588
589 * html div.cbi-value-description {
590 margin-left: 40%;
591 }