thomascube
2010-12-17 db1a87cd6c506f2afbd1a37c64cb56ae11120b49
commit | author | age
e019f2 1 /***** Roundcube|Mail basic styles *****/
4e17e6 2
T 3 body
4 {
5   margin: 8px;
0f8ff2 6   background-color: #F6F6F6;
4e17e6 7   color: #000000;
T 8 }
9
10 body.iframe
11 {
12   margin: 0px;
a02d48 13   background-color: #FFF;
4e17e6 14 }
T 15
16 body.extwin
17 {
18   margin: 10px;
19 }
20
fa7912 21 body, td, th, div, p, h3, select, input, textarea
4e17e6 22 {
T 23   font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
24   font-size: 12px;
25 }
26
27 th
28 {
29   font-weight: normal;
30 }
31
32 h3
33 {
34   font-size: 18px;
35 }
36
37 a, a:active, a:visited
38 {
39   color: #000000;
c8c1e0 40   outline: none;
4e17e6 41 }
T 42
43 a.button, a.button:visited, a.tab, a.tab:visited, a.axislist
44 {
45   color: #000000;
46   text-decoration: none;
47 }
48
49 a.tab
50 {
51   width: 80px;
52   display: block;
53   text-align: center;
54 }
55
56 hr
57 {
58   height: 1px;
59   background-color: #666666;
60   border-style: none;
61 }
62
6291c9 63 input[type="text"],
A 64 input[type="button"],
65 input[type="password"],
66 textarea
4e17e6 67 {
6291c9 68   border: 1px solid #666666;
632102 69   color: #333333;
4e17e6 70   background-color: #ffffff;
T 71 }
72
0b0a29 73 input, textarea
f1a16f 74 {
7e7edf 75   color: black;
fa7912 76   padding: 1px 3px;
0b0a29 77 }
A 78
4e17e6 79 input.button
T 80 {
81   height: 20px;
82   color: #333333;
83   font-size: 12px;
84   padding-left: 8px;
85   padding-right: 8px;
86   background: url(images/buttons/bg.gif) repeat-x #f0f0f0;
87   border: 1px solid #a4a4a4;
88 }
89
90 input.button:hover
91 {
92   color: black;
93 }
94
ed132e 95 input.mainaction
T 96 {
97   font-weight: bold;
98   border: 1px solid #999;
99 }
100
4e17e6 101 img
T 102 {
c47ff4 103   border: 0;
4e17e6 104 }
T 105
106 .alttext
107 {
108   font-size: 11px;
109 }
110
a8d23d 111 .hint
T 112 {
113   color: #666;
114   font-size: 11px;
115 }
4e17e6 116
T 117 /** common user interface objects */
118
087c7d 119 #mainscreen
A 120 {
121   position: absolute;
122   top: 85px;
123   right: 20px;
124   bottom: 20px;
125   left: 20px;
126 }
127
4e17e6 128 #header
T 129 {
7902df 130   position: absolute;
4b1647 131   top: 8px;
T 132   left: 19px;
4e17e6 133   width: 170px;
T 134   height: 40px;
7902df 135   z-index: 100;
4e17e6 136 }
T 137
138 #taskbar
139 {
7902df 140   position: absolute;
T 141   top: 0px;
142   right: 0px;
8955ca 143   height: 24px;
ee09d4 144   width: 100%;
510df5 145   background: url(images/taskbar.png) top right no-repeat;
8955ca 146   padding: 10px 4px 5px 0px;
7902df 147   text-align: right;
T 148   white-space: nowrap;
149   z-index: 2;
4e17e6 150 }
T 151
d7f49d 152 #taskbar a
4e17e6 153 {
7902df 154   font-size: 11px;
T 155   color: #666666;
156   text-decoration: none;
35a390 157   padding: 6px 12px 6px 26px;
9224c8 158   background: url(images/taskicons.gif) no-repeat;
7902df 159 }
T 160
161 #taskbar a:hover
162 {
163   color: #333333;
164 }
165
d7f49d 166 #taskbar a.button-mail
7902df 167 {
d7f49d 168   background-position: 0 0;
7902df 169 }
T 170
d7f49d 171 #taskbar a.button-addressbook
7902df 172 {
d7f49d 173   background-position: 0 -25px;
7902df 174 }
T 175
d7f49d 176 #taskbar a.button-settings
7902df 177 {
d7f49d 178   background-position: 0 -50px;
7902df 179 }
T 180
d7f49d 181 #taskbar a.button-logout
7902df 182 {
d7f49d 183   background-position: 0 -75px;
4e17e6 184 }
T 185
186 #message
187 {
188   position: absolute;
189   display: none;
7902df 190   top: -1px;
c7a815 191   margin-left: -225px;
A 192   left: 50%;
4e17e6 193   z-index: 5000;
a95e0e 194   opacity: 0.85;
4e17e6 195 }
T 196
197 #message div
198 {
199   width: 400px;
200   margin: 0px auto;
d7f49d 201   min-height: 22px;
4e17e6 202   padding: 8px 10px 8px 46px;
T 203 }
204
205 #message div.notice,
206 #remote-objects-message
207 {
9224c8 208   background: url(images/display/icons.png) 6px 3px no-repeat;
4e17e6 209   background-color: #F7FDCB;
T 210   border: 1px solid #C2D071;
211 }
212
213 #message div.error,
214 #message div.warning
215 {
9224c8 216   background: url(images/display/icons.png) 6px -97px no-repeat;
4e17e6 217   background-color: #EF9398;
T 218   border: 1px solid #DC5757;
219 }
220
221 #message div.confirmation
222 {
9224c8 223   background: url(images/display/icons.png) 6px -47px no-repeat;
4e17e6 224   background-color: #A6EF7B;
T 225   border: 1px solid #76C83F;
226 }
227
228 #message div.loading
229 {
9224c8 230   background: url(images/display/loading.gif) 6px 3px no-repeat;
7902df 231   background-color: #EBEBEB;
4e17e6 232   border: 1px solid #CCCCCC;
T 233 }
234
087c7d 235 .box
cc97ea 236 {
087c7d 237   border: 1px solid #999;
cc97ea 238 }
T 239
ce06d3 240 .boxtitle
A 241 {
242   height: 12px !important;
243   padding: 2px 10px 5px 5px;
244   border-bottom: 1px solid #999;
245   color: #333;
246   font-size: 11px;
247   font-weight: bold;
087c7d 248   overflow: hidden;
ce06d3 249   background: url(images/listheader.gif) top left repeat-x #CCC;
A 250 }
251
db1a87 252 .boxtitle .rightalign
T 253 {
254   float: right;
255 }
256
ce06d3 257 .boxcontent
A 258 {
259   padding: 15px 10px 10px 10px;
260   background-color: #F2F2F2;
261 }
262
263 .boxcontent table td.title
264 {
265   color: #666;
266   padding-right: 10px;
267 }
268
269 .boxlistcontent
270 {
271   position: absolute;
272   top: 20px;
273   bottom: 22px;
274   left: 0;
275   right: 0;
7888dc 276   width: 100%;
ce06d3 277   overflow-y: auto;
A 278   overflow-x: hidden;
087c7d 279 }
A 280
281 .boxsubject
282 {
283   position: absolute;
284   top: 0px;
285   left: 0px;
286   right: 0px;
287   overflow: hidden;
288   height: 22px;
289   border-bottom: 1px solid #999;
290   background: url(images/listheader.gif) top left repeat-x #CCC;
ce06d3 291 }
A 292
293 .boxfooter
294 {
295   position: absolute;
296   bottom: 0px;
297   left: 0px;
298   right: 0px;
299   overflow: hidden;
300   height: 22px;
301   border-top: 1px solid #999;
a2e817 302   background: url(images/listheader.gif) top left repeat-x #CCC;
ce06d3 303 }
A 304
305 .boxfooter a.button,
306 .boxfooter a.buttonPas
307 {
308   display: block;
309   float: left;
310   width: 34px;
311   height: 22px;
312   padding: 0px;
313   margin: 0;
314   overflow: hidden;
a2e817 315   background: url(images/icons/groupactions.png) 0 0 no-repeat transparent;
ce06d3 316   opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
A 317 }
318
319 .boxfooter a.groupactions
320 {
321   background-position: 0 -26px;
322 }
323
324 .boxfooter a.buttonPas
325 {
326   opacity: 0.35;
327 }
328
0d35d6 329 .pagenav
A 330 {
331   min-width: 250px;
332 }
333
ce06d3 334 .pagenav span
A 335 {
9689f5 336   color: #444;
ce06d3 337   font-size: 11px;
A 338   text-shadow: white 1px 1px;
087c7d 339   white-space: nowrap;
ce06d3 340 }
A 341
4a4265 342 .pagenav a.button,
T 343 .pagenav a.buttonPas
344 {
345   display: block;
346   float: left;
347   width: 11px;
348   height: 11px;
349   padding: 0;
350   margin: 1px;
351   overflow: hidden;
9224c8 352   background: url(images/pagenav.gif) 0 0 no-repeat transparent;
4a4265 353   opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
T 354 }
355
356 .pagenav a.buttonPas {
357   opacity: 0.35;
358 }
359
360 .pagenav a.firstpageSel {
361   background-position: 0 -11px;
362 }
363
364 .pagenav a.prevpage {
365   background-position: -11px 0;
366 }
367
368 .pagenav a.prevpageSel {
369   background-position: -11px -11px;
370 }
371
372 .pagenav a.nextpage {
373   background-position: -22px 0;
374 }
375
376 .pagenav a.nextpageSel {
377   background-position: -22px -11px;
378 }
379
380 .pagenav a.lastpage {
381   background-position: -33px 0;
382 }
383
384 .pagenav a.lastpageSel {
385   background-position: -33px -11px;
386 }
387
a7d5c6 388 .splitter
T 389 {
e5686f 390   user-select: none;
A 391   -moz-user-select: none;
392   -khtml-user-select: none;
a7d5c6 393   position: absolute;
T 394   background: url(images/dimple.png) center no-repeat;
395 }
396
397 .splitter-h
398 {
399   cursor: n-resize;
400   background-position: center 2px;
401 }
402
403 .splitter-v
404 {
405   cursor: e-resize;
e5686f 406   background-position: 2px center;
a7d5c6 407 }
T 408
c16986 409 .popupmenu
A 410 {
411   position: absolute;
412   top: 32px;
413   left: 90px;
414   width: auto;
415   display: none;
416   background-color: #fff;
417   background-color: rgba(255, 255, 255, 0.95);
418   border: 1px solid #999;
419   padding: 4px;
420   z-index: 240;
421   border-radius: 3px;
422   -moz-border-radius: 3px;
423   -webkit-border-radius: 3px;
424   -moz-box-shadow: 1px 1px 12px #999;
425   -webkit-box-shadow: #999 1px 1px 12px;
426 }
427
9b3fdc 428 .popupmenu ul
A 429 {
430   margin: -4px 0;
431   padding: 0;
432   list-style: none;
433 }
434
435 .popupmenu ul li
436 {
437   font-size: 11px;
438   white-space: nowrap;
439   min-width: 100px;
440   margin: 3px -4px;
441 }
442
443 .popupmenu li a
444 {
445   display: block;
446   color: #a0a0a0;
447   padding: 2px 10px;
448   text-decoration: none;
449   min-height: 14px;
450 }
451
452 .popupmenu li a.active,
453 .popupmenu li a.active:active,
454 .popupmenu li a.active:visited
455 {
456   color: #333;
457 }
458
459 .popupmenu li a.active:hover
460 {
461   color: #fff;
462   background-color: #c00;
463 }
e9b5a6 464
7a0b9b 465 .darkbg
A 466 {
467   background-color: #F2F2F2 !important;
468 }
469
e25a35 470 .dropbutton,
A 471 .dropbutton span
472 {
473   float: left;
474   height: 32px;
475 }
476
477 .dropbutton:hover
478 {
e363b0 479 /*  background: url(images/dbutton.png) 0 0 no-repeat transparent; */
e25a35 480 }
A 481
482 .dropbutton span
483 {
484   width: 9px;
485   background: url(images/dbutton.png) -53px 0 no-repeat transparent;
486 }
487
488 .dropbutton span:hover
489 {
490   cursor: pointer;
e363b0 491   background-position: -74px 0;
e25a35 492 }
A 493
6fff3c 494
4e17e6 495 /***** common table settings ******/
T 496
497 table.records-table thead tr td
498 {
499   height: 20px;
500   padding: 0px 4px 0px 4px;
501   vertical-align: middle;
502   border-bottom: 1px solid #999999;
503   color: #333333;
9224c8 504   background: url(images/listheader.gif) top left repeat-x #CCC;
4e17e6 505   font-size: 11px;
T 506   font-weight: bold;
507 }
508
509 table.records-table tbody tr td
510 {
511   height: 16px;
512   padding: 2px 4px 2px 4px;
513   font-size: 11px;
514   white-space: nowrap;
515   border-bottom: 1px solid #EBEBEB;
516   overflow: hidden;
517   text-align: left;  
518 }
519
520 table.records-table tr
521 {
522   background-color: #FFFFFF;
523 }
524
525 table.records-table tr.selected td
526 {
527   color: #FFFFFF;
528   background-color: #CC3333;
529 }
530
6b47de 531 table.records-table tr.focused td
T 532 {
533 }
534
535 table.records-table tr.unfocused td
536 {
537   color: #FFFFFF;
538   background-color: #929292;
539 }
4e17e6 540
T 541
f11541 542 /***** mac-style quicksearch field *****/
T 543
544 #quicksearchbar
545 {
546   position: absolute;
e538b3 547   top: 55px;
834432 548   right: 20px;
f11541 549   width: 182px;
T 550   height: 20px;
551   text-align: right;
9224c8 552   background: url(images/searchfield.gif) top left no-repeat;
f11541 553 }
T 554
30b152 555 #searchreset
f11541 556 {
T 557   position: absolute;
558   top: 3px;
559   right: 4px;
560   text-decoration: none;
561 }
562
9e5550 563 #searchmenulink
30b152 564 {
A 565  position: absolute;
566  top: 3px;
562c0e 567  right: 160px;
30b152 568 }
A 569
f11541 570 #quicksearchbar img
T 571 {
572   vertical-align: middle;
573 }
574
575 #quicksearchbox
576 {
577   position: absolute;
578   top: 2px;
562c0e 579   left: 24px;
f11541 580   width: 140px;
269719 581   height: 15px;
f11541 582   font-size: 11px;
T 583   padding: 0px;
584   border: none;
585 }
586
587
4e17e6 588 /***** roundcube webmail pre-defined classes *****/
T 589
479a99 590 #rcmversion
f11541 591 {
T 592   position: absolute;
479a99 593   bottom: 10px;
A 594   right: 20px;
595   text-align: right;
596   white-space: nowrap;
597   font-size: 8pt;
598   color: #999;
f11541 599 }
T 600
601 #rcmdraglayer
602 {
633142 603   min-width: 300px;
T 604   width: auto !important;
f11541 605   width: 300px;
T 606   border: 1px solid #999999;
5800fb 607   background-color: #fff;
f11541 608   padding-left: 8px;
T 609   padding-right: 8px;
610   padding-top: 3px;
611   padding-bottom: 3px;
612   font-size: 11px;
633142 613   white-space: nowrap;
ca38db 614   opacity: 0.82;
T 615   border-radius: 3px;
616   -moz-border-radius: 3px;
617   -webkit-border-radius: 3px;
618   -moz-box-shadow: 1px 1px 12px #999;
619   -webkit-box-shadow: #999 1px 1px 12px;
620 }
621
5800fb 622 .draglayercopy:before
T 623 {
ca38db 624   position: absolute;
T 625   bottom: -5px;
626   left: -6px;
627   content: " ";
628   width: 14px;
629   height: 14px;
630   background: url(images/messageactions.png) -2px -128px no-repeat;
f11541 631 }
T 632
4e17e6 633 a.rcmContactAddress
T 634 {
635   text-decoration: none;
636 }
637
638 a.rcmContactAddress:hover
639 {
640   text-decoration: underline;
641 }
642
643 #rcmKSearchpane
644 {
645   background-color: #F9F9F9;
646   border: 1px solid #CCCCCC;
647 }
648
649 #rcmKSearchpane ul
650 {
651   margin: 0px;
652   padding: 2px;
653   list-style-image: none;
654   list-style-type: none;
655 }
656
657 #rcmKSearchpane ul li
658 {
2c8e84 659   display: block;
4e17e6 660   height: 16px;
T 661   font-size: 11px;
2c8e84 662   padding-left: 6px;
4e17e6 663   padding-top: 2px;
2c8e84 664   padding-right: 6px;
T 665   white-space: nowrap;
666   cursor: pointer;
4e17e6 667 }
T 668
669 #rcmKSearchpane ul li.selected
670 {
671   color: #ffffff;
672   background-color: #CC3333;
673 }
674
f055b1 675 #login-form
A 676 {
677   margin-left: auto;
678   margin-right: auto;
679   margin-top: 50px;
680   width: 400px;
681   border: 1px solid #999;
682 }
683
684 #login-form table td.title
685 {
686   text-align: right;
687   white-space: nowrap;
688 }
689
690 #login-form table
691 {
692   width: 1%;
693   margin: auto;
694 }
09839a 695
df2a51 696 #rcmloginuser, #rcmloginpwd, #rcmloginhost
V 697 {
698   width: 200px;
699 }
700
09839a 701 #console
A 702 {
703   opacity: 0.8;
704 }
6fff3c 705
6769ba 706 .disabled
A 707 {
708   color: #999;
709 }
710
711 font.bold
712 {
713   font-weight: bold;
714 }
715
7a0b9b 716
6fff3c 717 /***** onclick menu list *****/
A 718
719 ul.toolbarmenu
720 {
f52c93 721   margin: -4px 0 -4px 0;
6fff3c 722   padding: 0;
A 723   list-style: none;
724 }
725
726 ul.toolbarmenu li
727 {
728   font-size: 11px;
729   white-space: nowrap;
730   min-width: 130px;
cf3992 731   margin: 2px -4px;
6fff3c 732 }
A 733
734 ul.toolbarmenu li a
735 {
736   display: block;
737   color: #a0a0a0;
f1ad36 738   padding: 1px 12px 3px 28px;
6fff3c 739   text-decoration: none;
A 740   min-height: 14px;
741 }
742
743 ul.toolbarmenu li a.active,
744 ul.toolbarmenu li a.active:active,
745 ul.toolbarmenu li a.active:visited
746 {
747   color: #333;
748 }
749
750 ul.toolbarmenu li input
751 {
752   vertical-align: middle;
753 }
754
755 ul.toolbarmenu li hr
756 {
757   color: #ccc;
758   width: 130px;
759   height: 1px;
760   margin: 2px 1px 2px 1px;
761 }
762
763 ul.toolbarmenu li img
764 {
765   float: left;
766   margin: 0 2px;
767 }
768
e9b5a6 769 div.popupmenu ul li.separator_below,
6fff3c 770 ul.toolbarmenu li.separator_below
A 771 {
772   border-bottom: 1px solid #ccc;
773   margin-bottom: 2px;
774   padding-bottom: 2px;
775 }
776
e9b5a6 777 div.popupmenu ul li.separator_above,
6fff3c 778 ul.toolbarmenu li.separator_above
A 779 {
780   border-top: 1px solid #ccc;
781   margin-top: 2px;
782   padding-top: 2px;
783 }
f52c93 784
6769ba 785
A 786 /***** tabbed interface elements *****/
787
788 div.tabsbar,
789 #tabsbar
f52c93 790 {
6769ba 791   position: absolute;
A 792   top: 50px;
793   left: 220px;
794   right: 20px;
795   height: 22px;
796   border-bottom: 1px solid #999999;
797   white-space: nowrap;
f52c93 798 }
087c7d 799
6769ba 800 div.tabsbar
087c7d 801 {
6769ba 802   top: 35px;
A 803   left: 12px;
804   right: 12px;
087c7d 805 }
6769ba 806
A 807 span.tablink,
808 span.tablink-selected
809 {
810   float: left;
811   height: 23px !important;
812   height: 22px;
813   overflow: hidden;
814   background: url(images/tabs-left.gif) top left no-repeat;
815 }
816
817 span.tablink
818 {
819   cursor: pointer;
820 }
821
822 span.tablink-selected
823 {
824   cursor: default;
825   background-position: 0px -23px;
826 }
827
828 span.tablink a,
829 span.tablink-selected a
830 {
831   display: block;
832   padding: 5px 10px 0 5px;
833   margin-left: 5px;
834   height: 23px;
835   color: #555555;
836   max-width: 185px;
837   text-decoration: none;
838   overflow: hidden;
839   text-overflow: ellipsis;
840   -o-text-overflow: ellipsis;
841   background: url(images/tabs-right.gif) top right no-repeat;
842 }
843
844 span.tablink-selected a
845 {
846   cursor: inherit;
847   color: #000000;
848   background-position: right -23px;
849 }
850
cb7d32 851 fieldset
T 852 {
853   margin-bottom: 1em;
854   border: 1px solid #999999;
855   padding: 4px 8px 9px 8px; 
856 }
857
858 legend
859 {
860   color: #999999;
861 }
862
6769ba 863 fieldset.tabbed
A 864 {
865   margin-top: 22px;
866   padding-top: 12px;
867 }
868
db1a87 869 .quota_text {
T 870   text-align: center;
871   font-size: 10px;
872   color: #666;
873   border: 1px solid #999;
874   cursor: default;
875 }
876 .quota_bg { background-color: white; }
877 .quota_high { background-color: #F33131; }
878 .quota_mid { background-color: #F5AD3C; }
879 .quota_low { background-color: #91E164; }
880 .quota_text_high { color: white; }
881 .quota_text_mid { color: #666; }
882 .quota_text_low { color: #666; }