]> code.citadel.org Git - citadel.git/blob - webcit/static/webcit.css
* A new display of messages in HTML / CSS.
[citadel.git] / webcit / static / webcit.css
1
2 * html {
3         overflow: hidden;
4 }
5
6 body {
7         margin:0;
8         padding: 0 0 0 0;
9         height: 100%;
10         overflow: auto;
11         background-color: #D8D8D8;
12         color: #000000;
13         font-weight: normal;
14         font-size: 10pt;
15         font-family: sans-serif;
16 }
17
18 #iconbar {
19         /* position:fixed; */
20         display:block;
21         top:0px;
22         left:0px;
23         width: 15%;
24         /* height:100%; */
25         background: #ffffee;
26 }
27
28 * html #iconbar {
29         position:absolute;
30         display:block;
31         top:0px;
32         left:0px;
33         width: 15%;
34         /* height:100%; */
35         background: #ffffee;
36 }
37
38 .logo, .logo_citadel {
39         display: block;
40         text-align: center;
41         border-bottom: 1px solid #aaaaaa;
42         margin: 0;
43         padding: 0;
44 }
45
46 .logo_citadel a, .logo_citadel img {
47         border: none;
48 }
49
50 #banner {
51         position:fixed;
52         display:block;
53         top:0px;
54         left: 15%;
55         width: 85%;
56         height: 15%;
57         background: #445;
58 }
59
60 * html #banner {
61         position:absolute;
62         display:block;
63         top:0px;
64         left: 15%;
65         width: 85%;
66         height: 15%;
67         background: #445;
68 }
69
70
71 #banner .room_banner {
72         float: left;
73         width: 48%;
74 }
75
76 .room_banner img {
77         float: left;
78         margin-top: 0;
79         margin-left: 0;
80         margin-bottom: 5px;
81         margin-right: 5px;
82 }
83
84 .room_banner h1 {
85         font-size: 14pt;
86         font-weight: bold;
87         color: #FFFFEE;
88         margin: 0;
89         padding: 2px;
90 }
91
92 .room_banner .infos {
93         font-size: 8pt;
94         color: #FFFFEE;
95         text-align: center;
96         padding: 2px;
97         cursor: help;
98 }
99
100 #room_infos {
101         position: absolute;
102         top: 0px;
103         left: 50%;
104         width: 45%;
105         padding: 11px;
106         margin: 0px;
107         z-index: 100;
108         color: #666;
109         background: white;
110 }
111
112 #room_infos .close_infos {
113         cursor: pointer;
114         font-size: 8pt;
115         color: black;
116         text-align: right;
117         padding: 2px;
118         margin-top: 5px;
119 }
120
121 #banner ul {
122         float: right;
123         text-align: right;
124         width: 48%;
125         margin: 0;
126         padding: 0;
127 }
128
129 #banner ul li {
130         text-align: right;
131         clear: right;
132         list-style: none;
133         margin: 0;
134         padding: 2px;
135         white-space: nowrap;
136 }
137
138 li.search {
139         font-size: 10pt;
140         float: left;
141         color: #FFFFFF;
142 }
143
144 li.view {
145         font-size: 10pt;
146         float: right;
147         color: #FFFFFF;
148 }
149
150 li.search form, li.view form {
151         margin: 0;
152         padding: 0;
153 }
154
155 li.nummsgs {
156         font-size: 10pt;
157         color: #DDDDCC;
158 }
159
160 li.start_page {
161         font-size: 8pt;
162         color: #DDDDCC;
163 }
164
165
166 #navbar {
167         position: absolute; 
168         bottom: 0px; 
169         left: 0px;
170 }
171
172 #navbar ul {
173         float: left;
174         width: 95%;
175         margin: 0;
176         padding: 0;
177         white-space: nowrap;
178         text-align: left;
179 }
180
181 #navbar ul li {
182         display: inline;
183         list-style: none;
184         margin-top: 0;
185         margin-right: 5px;
186         margin-bottom:0 ;
187         margin-left: 20px;
188         white-space: nowrap;
189 }
190
191 #navbar ul li img {
192         margin-top: 0;
193         margin-right: 2px;
194         margin-bottom:0 ;
195         margin-left: 2px;
196 }
197
198 .navbar_link {
199         font-size: 7pt;
200         color: #FFFFEE;
201 }
202
203
204 #important_message {
205         position:absolute;
206         top:0px; right:0px;
207         background-color: #880000;
208         z-index: 2;
209 }
210
211 #content {
212         position:fixed;
213         display:block;
214         top: 16%;
215         left: 15%;
216         width: 85%;
217         height: 84%;
218         overflow: auto;
219         /* overflow-x: hidden; */
220 }
221
222 * html #content {
223         position:absolute;
224         display:block;
225         top: 16%;
226         left: 15%;
227         width: 85%;
228         height: 84%;
229         overflow: auto;
230         /* overflow-x: hidden; */
231 }
232
233 #message_list_hdr {
234         position:fixed;
235         display:block;
236         top: 16%;
237         left: 15%;
238         width: 85%;
239         height: 5%;
240         overflow: none;
241         font-style: italic;
242         text-align: left;
243 }
244
245 * html #message_list_hdr {
246         position:absolute;
247         display:block;
248         top: 16%;
249         left: 15%;
250         width: 85%;
251         height: 5%;
252         overflow: none;
253         font-style: italic;
254         text-align: left;
255 }
256
257 #message_list {
258         position:fixed;
259         display:block;
260         top: 21%;
261         left: 15%;
262         width: 85%;
263         height: 20%;
264         overflow: auto;
265         cursor: pointer;
266 }
267
268 * html #message_list {
269         position:absolute;
270         display:block;
271         top: 21%;
272         left: 15%;
273         width: 85%;
274         height: 20%;
275         overflow: auto;
276         cursor: pointer;
277 }
278
279 #resize_msglist {
280         position:fixed;
281         display:block;
282         top: 41%;
283         left: 15%;
284         width: 85%;
285         height: 1%;
286         overflow: none;
287         cursor: s-resize;
288         background-color: #cccccc;
289 }
290
291 * html #resize_msglist {
292         position:absolute;
293         display:block;
294         top: 41%;
295         left: 15%;
296         width: 85%;
297         height: 1%;
298         overflow: none;
299         cursor: s-resize;
300 }
301
302 #resize_msglist hr {
303         color: darkgrey;
304         background-color: darkgrey;
305         height: 3px;
306         border: 0;
307 }
308
309 #preview_pane {
310         position:fixed;
311         display:block;
312         top: 42%;
313         left: 15%;
314         width: 85%;
315         height: 58%;
316         overflow: auto;
317 }
318
319 * html #preview_pane {
320         position:absolute;
321         display:block;
322         top: 42%;
323         left: 15%;
324         width: 85%;
325         height: 58%;
326         overflow: auto;
327 }
328
329
330 .fix_scrollbar_bug {
331         margin-right:1px;               /* Gecko and other non-broken browsers */
332         width: expression('97%');       /* Only IE6 understands 'expression' - fixes weird scrollbarbug */
333 }
334
335 #button {
336         width: 100%;
337         background-color: #ffffee;
338         color: #aaaaaa;
339         font-size: 8pt;
340         list-style: none;
341         margin: 0;
342         padding: 0;
343         border: none;
344 }
345
346 #button li, #button li.switch {
347         border-bottom: 1px solid #aaaaaa;
348         margin: 0;
349 }
350
351 #button li.switch {
352         text-align: center;
353 }
354
355 #button img {
356         vertical-align: middle;
357         padding-left: 2px;
358         padding-right: 5px;
359 }
360
361 #button li a {
362         display: block;
363         background-color: #ffffee;
364         color: #000000;
365         text-decoration: none;
366         width: 100%;
367 }
368
369 html>body #button li a {
370         width: auto;
371 }
372
373 #button li a:hover {
374         background-image:url(/static/body-background.gif);
375         color: #000000;
376 }
377
378 a:link {
379         color: #0000FF;
380         text-decoration: none;
381 }
382
383 a:visited {
384         color: #0000FF;
385         text-decoration: none;
386 }
387
388 a:active {
389         color: #0000FF;
390         text-decoration: none;
391 }
392
393 a:hover {
394         text-decoration: underline;
395 }
396
397 .menubar_link {
398         font-size: 9pt;
399 }
400
401 .titlebar {
402         font-size: 12pt;
403         color: #FFFFEE;
404 }
405
406 .mainmenu {
407         font-size: 10pt;
408         font-weight: bold;
409         color: #880000;
410 }
411
412 .menudesc {
413         font-size: 8pt;
414         color: #000088;
415 }
416
417 .message {
418         margin: 5px;
419         padding: 0;
420         border: 1px solid darkgrey;
421         background-color: lightgrey;
422 }
423
424
425 .message_header, .message_subject {
426         font-size: 10pt;
427         color: black;
428         margin: 0;
429         padding: 3px;
430         background-color: lightgrey;
431 }
432
433 .message_subject {
434         padding-top: 0;
435         font-style: italic;
436         float: left;
437 }
438
439
440 #delbutton, .msgbuttons a {
441         font-size: 6pt;
442         padding: 2px;
443         margin-left: 2px; 
444         margin-right: 2px; 
445         border: 2px outset darkgrey;
446         color: black;
447         font-weight: bold;
448         text-transform: uppercase;
449 }
450
451 .msgbuttons {
452         float: right;
453         background-color: lightgrey;
454 }
455
456 .msgbuttons a span {
457         display: none;
458 }
459
460 .message_content {
461         background-color: white;
462         margin: 0;
463         padding: 3px;
464         clear: both;
465 }
466
467 .tablabel {
468         font-size: 10pt;
469         font-weight: bold;
470         color: #000000;
471 }
472
473 .boxlabel {
474         font-size: 7pt;
475         font-weight: bold;
476         color: #FFFFEE;
477 }
478
479 .boxlabel a {
480         color: #FFFFEE;
481 }
482
483 .customize {
484         font-size: 8pt;
485         font-style: italic;
486         color: #000044;
487         background-color: #DDDDCC;
488 }
489
490 .room_banner_room_name {
491 }
492
493 .room_banner_room_info {
494 }
495
496 .room_banner_new_messages {
497 }
498
499 .room_banner_start_page {
500 }
501
502 .view_name, .search_name, .selectbox, .inputbox {
503         font-size: 7pt;
504         background: #444455; 
505         color: #ddddcc;
506 }
507
508 .menubar_bg {
509         background-color: #FF0000;
510 }
511
512
513 .roomlist_floor {
514         font-size: 12pt;
515         font-weight: bold;
516         color: #000000;
517 }
518
519 .roomlist_new {
520         font-size: 10pt;
521         color: #880000;
522         font-weight: bold;
523 }
524
525 .roomlist_old {
526         font-size: 10pt;
527         color: #000088;
528 }
529
530 .ib_roomlist_floor {
531         font-size: 8pt;
532         font-weight: bold;
533         color: #000000;
534         cursor: pointer;
535 }
536
537 .ib_roomlist_new {
538         font-size: 10px;
539         color: #880000;
540         font-weight: bold;
541         cursor: pointer;
542 }
543
544 .ib_roomlist_old {
545         font-size: 10px;
546         color: #000088;
547         cursor: pointer;
548 }
549
550 .mailbox_summary {
551         font-size: 10pt;
552         color: #000000;
553         background-color: #FFFFFF;
554 }
555
556 .mailbox_summary tr {
557         width: 100%;
558 }
559
560 .mailbox_summary td {
561         border-top: 1px solid darkgrey;
562 }
563
564 blockquote {
565         color: navy !important; background-color: RGB(245,245,245) !important; 
566 }
567 blockquote blockquote {
568         color: maroon !important; background-color: RGB(235,235,235) !important;
569 }
570 blockquote blockquote blockquote {
571         color: green !important; background-color: RGB(225,225,225) !important;
572 }
573 blockquote blockquote blockquote blockquote {
574         color: purple !important; background-color: RGB(215,215,215) !important;
575 }
576 blockquote blockquote blockquote blockquote blockquote {
577         color: teal !important; background-color: RGB(205,205,205) !important;
578 }
579
580 blockquote pre {
581         margin-left: 1%;
582         margin-right: 1%;
583 }
584
585
586 var sub {
587         font-style: normal;
588 }
589
590 .note {
591         font-size: 85%;
592         margin-left: 10%;
593 }
594
595 .toolbar {
596         text-align: center;
597 }
598
599 .toolbar IMG {
600         float: right;
601 }
602
603 .errormsg {
604         color: #AA0000;
605         background: none;
606         font-weight: bold;
607         font-style: italic;
608 }
609
610 .imsg {
611         color: #aaaaaa;
612         background: none;
613         font-weight: bold;
614         font-style: italic;
615         text-align: center;
616 }
617
618 .warning {
619         color: #FF4500;
620         background: none;
621         text-decoration: none;
622 }
623
624 .error strong {
625         color: #DC143C;
626         background: #FFD700;
627         text-decoration: none;
628 }
629
630 .warning strong {
631         color: #FF4500;
632         background: #FFD700;
633         text-decoration: none;
634 }
635
636 .warning a:link, .warning a:visited, .warning a:active {
637         color: #FF4500;
638         background: none;
639         text-decoration: underline;
640 }
641
642 .error a:link, .error a:visited, .error a:active {
643         color: #DC143C;
644         background: none;
645         text-decoration: underline;
646 }
647
648 .error strong a:link, .error strong a:visited, .error strong a:active {
649         color: #DC143C;
650         background: #FFD700;
651 }
652
653 .warning strong a:link, .warning strong a:visited, .warning strong a:active {
654         color: #FF4500;
655         background: #FFD700;
656 }
657
658 colgroup.entity {
659         text-align: center;
660 }
661
662 .default {
663         text-decoration: underline;
664         font-style: normal;
665 }
666
667 .required {
668         font-weight: bold;
669 }
670
671 td li.transitional, .elements li.transitional {
672         font-weight: lighter;
673         color: #696969;
674         background: none;
675 }
676
677 td li.frameset, .elements li.frameset {
678         font-weight: lighter;
679         color: #808080;
680         background: none;
681 }
682
683 @media print {
684         input#toggler, .toolbar { display: none }
685 }
686
687
688 .treetitle {
689         padding:2px;
690         cursor:default;
691         
692         font-size: 11px;
693         color: #000000;
694 }
695 .editednode {
696         padding:2px;
697         cursor:default;
698         background-color: #FFFFFF;;
699         color: #000000;
700         
701         font-size: 11px;
702 }
703 .editednodeinput {
704         background-color: #FFFFFF;;
705         color: #000000;
706         
707         width: 150px;
708         height: 17px;
709         
710         border-style: solid;
711         border-width: 1px;
712         border-color: #000000;
713         
714         font-size: 11px;
715 }
716 .treetitleselectedfocused {
717         padding:2px;
718         cursor:default;
719         background-color: highlight;
720         color: highlighttext;
721         
722         font-size: 11px;
723 }
724 .treetitleselectedblured {
725         padding:2px;
726         cursor:default;
727         background-color: menu;
728         color: windowtext;
729         font-size: 11px;
730 }
731
732
733
734 div.auto_complete {
735         width: 350px;
736         background: #fff;
737 }
738
739 div.auto_complete ul {
740         border:1px solid #888;
741         margin:0;
742         padding:0;
743         width:100%;
744         list-style-type: none;
745         background: #fff;
746 }
747
748 div.auto_complete ul li {
749         margin:0;
750         padding:3px;
751 }
752
753 div.auto_complete ul li.selected {
754         background-color: #ffc;
755
756
757 div.auto_complete ul strong.highlight {
758         color: #800;
759         margin:0;
760         padding:0;
761 }
762
763
764 .floors_config, .roomops_zap {
765         border: 0;
766         background-color: #770000;
767         width: 100%;
768 }
769
770 .roomops_cell_label {
771         background-color: #FFFFFF;
772 }
773
774 .roomops_cell, .roomops_cell_edit {
775         background-color: #CCCCCC;
776 }
777
778 .auth_validate, .event_background, .calendar_background, .calendar_view_background, .graphics_background, .iconbar_background {
779         border: 0;
780         width: 100%;
781         background-color: #ffffff;
782 }
783
784 .mainmenu_background, .messages_background, .paging_background, .preferences_background, .roomops_background, .sieve_background, .siteconfig_background { 
785         border: 0;
786         width: 100%;
787         background-color: #ffffff;
788 }
789
790 .smtpqueue_background, .tabs_background, .useredit_background, .userlist_background, .downloads_background, .vcard_edit_background, .who_background   {
791         border: 0;
792         width: 100%;
793         background-color: #ffffff;
794 }
795
796 .auth_banner, .event_banner, .floors_banner, .calendar_banner, .graphics_banner, .iconbar_banner, .inetconf_banner, .listsub_banner {
797         border: 0;
798         width: 100%;
799         background-color: #444455;
800 }
801
802 .mainmenu_banner, .netconf_banner, .paging_banner, .preferences_banner, .roomops_banner, .setup_banner, .sieve_banner, .siteconfig_banner {
803         border: 0;
804         width: 100%;
805         background-color: #444455;
806 }
807
808 .smtpqueue_banner, .summary_banner, .useredit_banner, .userlist_banner, .downloads_banner, .vcard_edit_banner, .who_banner, .room_banner   {
809         border: 0;
810         width: 100%;
811         background-color: #444455;
812 }
813
814
815 .vcard_edit_background_alt, .roomops_background_alt {
816         border: 0;
817         width: 100%;
818         background-color: #dddddd;
819 }
820
821
822 .box {
823         width: 100%;
824         padding: 0px;
825         background-color: #FFFFFF;
826 }
827
828 .boxlabel, .boxcontent {
829         padding: 5px;
830 }
831
832 .boxlabel {
833         background-color: #000088;
834         text-align: center;
835 }
836
837 #login_screen {
838         margin: 3%;
839 }
840
841 .login_content {
842         background-color: white;
843 }
844
845 .login_message, .login_hello {
846         position: relative;
847         margin-left: auto;
848         margin-right: auto;
849         width: 80%;
850         text-align: center;
851 }
852
853 .login_image {
854         display: block;
855         margin-left: auto;
856         margin-right: auto;
857         text-align: center;
858 }
859
860 .login_message {
861         color: red;
862         font-weight: bold;
863         font-size: 16px;
864 }
865
866 #login_form {
867         position: relative;
868         display: block;
869         margin-top: 20px;
870         margin-left: auto;
871         margin-right: auto;
872         margin-bottom: 20px;
873         padding: 6px;
874         width: 300px;
875         background-color: #DDDDDD;
876 }
877
878 #login_form input, #login_form label, #login_form select {
879         display: block;
880         float: left;
881         margin: 6px;
882 }
883
884 #login_form label {
885         width: 130px;
886         text-align: left;
887 }
888
889 #pname, #uname {
890         width: 130px;
891         text-align: left;
892 }
893
894 #login_form br {
895         clear: left;
896 }
897
898 #login_form .logbuttons {
899         margin-left: auto;
900         margin-right: auto;
901 }
902
903 #login_form .logbutton {
904         width: auto;
905         text-align: center;
906 }
907
908 .login_infos {
909         display: block;
910         margin-top: 30px;
911         margin-left: auto;
912         margin-right: auto;
913         width: 80% ;
914         text-align: left;
915 }
916
917 #address_book_popup {
918         position: absolute;
919         top: 100px;
920         right: 25px;
921         width: 320px;
922         height: auto;
923         z-index: 100;
924         background-color: #fff;
925         color: #000;
926         display: none;
927         border: 1px solid black;
928 }
929
930 #address_book_popup_container_div {
931         position: relative;
932         width: 100%;
933         height: 100%;
934         background-color: #ffd;
935 }
936
937 #address_book_popup_middle_div {
938         position: relative;
939         background-color: #ffd;
940 }
941
942 #address_book_inner_div {
943         margin: 5px;
944 }
945
946 #address_book_inner_div select {
947         width: 100%;
948         background-color: #ffd;
949 }
950
951 .address_book_popup_title {
952         font-size: 12pt;
953         background-color: #ffd;
954         color: #000;
955 }