1 /***** Roundcube|Mail mail task styles *****/
13 /* border: 1px solid #cccccc; */
23 #messagetoolbar a.button,
24 #messagetoolbar a.buttonPas {
32 background: url(images/mail_toolbar.png) 0 0 no-repeat transparent;
33 opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
36 #messagetoolbar a.buttonPas {
40 #messagetoolbar a.checkmailSel {
41 background-position: 0 -32px;
44 #messagetoolbar a.back {
45 background-position: -32px 0;
48 #messagetoolbar a.backSel {
49 background-position: -32px -32px;
52 #messagetoolbar a.compose {
53 background-position: -64px 0;
56 #messagetoolbar a.composeSel {
57 background-position: -64px -32px;
60 #messagetoolbar a.reply {
61 background-position: -96px 0;
64 #messagetoolbar a.replySel {
65 background-position: -96px -32px;
68 #messagetoolbar a.replyAll {
69 background-position: -128px 0;
72 #messagetoolbar a.replyAllSel {
73 background-position: -128px -32px;
76 #messagetoolbar a.forward {
77 background-position: -160px 0;
80 #messagetoolbar a.forwardSel {
81 background-position: -160px -32px;
84 #messagetoolbar a.delete {
85 background-position: -192px 0;
88 #messagetoolbar a.deleteSel {
89 background-position: -192px -32px;
92 #messagetoolbar a.markmessage {
93 background-position: -256px 0;
96 #messagetoolbar a.messagemenu {
97 background-position: -288px 0;
100 #messagetoolbar a.spellcheck {
101 background-position: -384px 0;
104 #messagetoolbar a.spellcheckSel {
105 background-position: -384px -32px;
108 #messagetoolbar a.attach {
109 background-position: -352px 0;
112 #messagetoolbar a.attachSel {
113 background-position: -352px -32px;
116 #messagetoolbar a.insertsig {
117 background-position: -448px 0;
120 #messagetoolbar a.insertsigSel {
121 background-position: -448px -32px;
124 #messagetoolbar a.savedraft {
125 background-position: -322px 0;
128 #messagetoolbar a.savedraftSel {
129 background-position: -322px -32px;
132 #messagetoolbar a.send {
133 background-position: -416px 0;
136 #messagetoolbar a.sendSel {
137 background-position: -416px -32px;
140 #messagetoolbar select.mboxlist
147 #messagetoolbar select.mboxlist option
152 #messagetoolbar select.mboxlist option[value=""]
157 #messagemenu li a.active:hover,
158 #markmessagemenu li a.active:hover
161 background-color: #c00;
166 background: url(images/messageactions.png) no-repeat 7px 0;
167 background-position: 7px 20px;
170 #messagemenu li a.printlink
172 background-position: 7px 1px;
175 #messagemenu li a.downloadlink
177 background-position: 7px -17px;
180 #messagemenu li a.sourcelink
182 background-position: 7px -35px;
185 #messagemenu li a.openlink
187 background-position: 7px -53px;
190 #messagemenu li a.editlink
192 background-position: 7px -71px;
195 #markmessagemenu li a
197 background: url(images/messageicons.png) no-repeat;
200 #markmessagemenu li a.readlink
202 background-position: 7px -51px;
205 #markmessagemenu li a.unreadlink
207 background-position: 7px -119px;
210 #markmessagemenu li a.flaggedlink
212 background-position: 7px -153px;
215 #markmessagemenu li a.unflaggedlink
217 background-position: 7px -136px;
225 vertical-align: middle;
261 #messagepartcontainer
276 border: 1px solid #999999;
277 background-color: #F9F9F9;
287 border: 1px solid #999999;
288 background-color: #F9F9F9;
300 min-height: 100%; /* Chrome 14 bug */
307 min-height: 100%; /* Chrome 14 bug */
308 border: 1px solid #999999;
309 background-color: #F9F9F9;
326 vertical-align: middle;
330 #partheader table td.title
337 /** mailbox list styles */
339 #mailboxlist-container
346 border: 1px solid #999;
347 background-color: #F9F9F9;
357 list-style-image: none;
358 list-style-type: none;
361 background-color: #FFF;
369 background: url(images/icons/folders.png) 5px 0 no-repeat;
370 border-bottom: 1px solid #EBEBEB;
373 #mailboxlist li ul li:last-child
381 left: 8px !important;
388 #mailboxlist li div.collapsed,
389 #mailboxlist li div.expanded
394 #mailboxlist li div.collapsed
396 background: url(images/icons/collapsed.png) bottom right no-repeat;
399 #mailboxlist li div.expanded
401 background: url(images/icons/expanded.png) bottom right no-repeat;
404 #mailboxlist li.inbox
406 background-position: 5px -18px;
409 #mailboxlist li.drafts
411 background-position: 5px -37px;
416 background-position: 5px -54px;
421 background-position: 5px -73px;
424 #mailboxlist li.trash
426 background-position: 5px -91px;
437 text-decoration: none;
441 #mailboxlist li.unread
446 #mailboxlist li.virtual > a
451 #mailboxlist li.selected,
452 #mailboxlist li.droptarget li.selected
454 background-color: #929292;
457 #mailboxlist li.selected > a,
458 #mailboxlist li.droptarget li.selected a
464 #mailboxlist li.droptarget
466 background-color: #FFFFA6;
469 /* styles for nested folders */
474 border-top: 1px solid #EBEBEB;
476 background-position: 25px 1px;
477 background-color: #FFF;
505 #listcontrols a.button,
506 #listcontrols a.buttonPas
516 background: url(images/mail_footer.png) 0 0 no-repeat transparent;
517 opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
520 #listcontrols a.buttonPas
525 #listcontrols a.all {
526 background-position: -30px 0;
529 #listcontrols a.allsel {
530 background-position: -30px -15px;
533 #listcontrols a.page {
534 background-position: -135px 0;
537 #listcontrols a.pagesel {
538 background-position: -135px -15px;
541 #listcontrols a.unread {
542 background-position: -45px 0;
545 #listcontrols a.unreadsel {
546 background-position: -45px -15px;
549 #listcontrols a.invert {
550 background-position: -60px 0;
553 #listcontrols a.invertsel {
554 background-position: -60px -15px;
557 #listcontrols a.none {
558 background-position: -75px 0;
561 #listcontrols a.nonesel {
562 background-position: -75px -15px;
565 #listcontrols a.expand-all {
566 background-position: -90px 0;
569 #listcontrols a.expand-allsel {
570 background-position: -90px -15px;
573 #listcontrols a.collapse-all {
574 background-position: -105px 0;
577 #listcontrols a.collapse-allsel {
578 background-position: -105px -15px;
581 #listcontrols a.expand-unread {
582 background-position: -120px 0;
585 #listcontrols a.expand-unreadsel {
586 background-position: -120px -15px;
599 #countcontrols a.button,
600 #countcontrols a.buttonPas
606 /** message list styles */
611 background-color: #F9F9F9;
621 #messagelist thead tr td
624 padding: 0 4px 0 2px;
625 vertical-align: middle;
626 border-bottom: 1px solid #999999;
628 background: url(images/listheader.gif) top left repeat-x #CCC;
633 #messagelist thead tr td.sortedASC,
634 #messagelist thead tr td.sortedDESC
636 background-position: 0 -26px;
639 #messagelist thead tr td.sortedASC a
641 background: url(images/icons/sort.gif) right 0 no-repeat;
644 #messagelist thead tr td.sortedDESC a
646 background: url(images/icons/sort.gif) right -14px no-repeat;
649 #messagelist thead tr td a
652 width: auto !important;
655 text-decoration: none;
658 #messagelist thead tr td.size
663 #messagelist thead tr td.subject
668 #messagelist tbody tr td
674 vertical-align: middle;
676 text-overflow: ellipsis;
677 -o-text-overflow: ellipsis;
678 border-bottom: 1px solid #EBEBEB;
682 #messagelist tbody tr td a
685 text-decoration: none;
692 vertical-align: middle;
693 display: inline-block;
696 #messagelist tbody tr td.flag,
697 #messagelist tbody tr td.status,
698 #messagelist tbody tr td.subject span.status
703 #messagelist tr td.flag span,
704 #messagelist tr td.status span,
705 #messagelist tr td.attachment span,
706 #messagelist tr td.priority span
712 #messagelist tr td div.collapsed,
713 #messagelist tr td div.expanded,
714 #messagelist tr td.threads div.listmenu,
715 #messagelist tr td.attachment span.attachment,
716 #messagelist tr td.attachment span.report,
717 #messagelist tr td.priority span.priority,
718 #messagelist tr td.priority span.prio1,
719 #messagelist tr td.priority span.prio2,
720 #messagelist tr td.priority span.prio3,
721 #messagelist tr td.priority span.prio4,
722 #messagelist tr td.priority span.prio5,
723 #messagelist tr td.flag span.flagged,
724 #messagelist tr td.flag span.unflagged,
725 #messagelist tr td.flag span.unflagged:hover,
726 #messagelist tr td.status span.status,
727 #messagelist tr td.status span.msgicon,
728 #messagelist tr td.status span.deleted,
729 #messagelist tr td.status span.unread,
730 #messagelist tr td.status span.unreadchildren,
731 #messagelist tr td.subject span.msgicon,
732 #messagelist tr td.subject span.deleted,
733 #messagelist tr td.subject span.unread,
734 #messagelist tr td.subject span.replied,
735 #messagelist tr td.subject span.forwarded,
736 #messagelist tr td.subject span.unreadchildren
738 display: inline-block;
739 vertical-align: middle;
742 background: url(images/messageicons.png) center no-repeat;
745 #messagelist tr td.attachment span.attachment
747 background-position: 0 -170px;
750 #messagelist tr td.attachment span.report
752 background-position: 0 -255px;
755 #messagelist tr td.priority span.priority
757 background-position: 0 -309px;
760 #messagelist tr td.priority span.prio5
762 background-position: 0 -358px;
765 #messagelist tr td.priority span.prio4
767 background-position: 0 -340px;
770 #messagelist tr td.priority span.prio3
772 background-position: 0 -324px;
775 #messagelist tr td.priority span.prio2
777 background-position: 0 -309px;
780 #messagelist tr td.priority span.prio1
782 background-position: 0 -290px;
785 #messagelist tr td.flag span.flagged
787 background-position: 0 -153px;
790 #messagelist tr td.flag span.unflagged:hover
792 background-position: 0 -136px;
795 #messagelist tr td.subject span.msgicon,
796 #messagelist tr td.subject span.unreadchildren
798 background-position: 0 -51px;
802 #messagelist tr td.subject span.replied
804 background-position: 0 -85px;
807 #messagelist tr td.subject span.forwarded
809 background-position: 0 -68px;
812 #messagelist tr td.subject span.replied.forwarded
814 background-position: 0 -102px;
817 #messagelist tr td.status span.msgicon,
818 #messagelist tr td.flag span.unflagged,
819 #messagelist tr td.status span.unreadchildren
821 background-position: 0 17px; /* no icon */
824 #messagelist tr td.status span.msgicon:hover
826 background-position: 0 -272px;
829 #messagelist tr td.status span.deleted,
830 #messagelist tr td.subject span.deleted
832 background-position: 0 -187px;
835 #messagelist tr td.status span.status,
836 #messagelist tr td.status span.unread,
837 #messagelist tr td.subject span.unread
839 background-position: 0 -119px;
842 #messagelist tr td div.collapsed
844 background-position: 0 -221px;
848 #messagelist tr td div.expanded
850 background-position: 0 -204px;
854 #messagelist tr td.threads div.listmenu
856 background-position: 0 -238px;
860 #messagelist tbody tr td.subject
865 #messagelist tbody tr td.subject a
868 vertical-align: middle; /* #1487091 */
871 /* thread parent message with unread children */
872 #messagelist tbody tr.unroot td.subject a
874 text-decoration: underline;
877 #messagelist tr td.attachment,
878 #messagelist tr td.threads,
879 #messagelist tr td.status,
880 #messagelist tr td.flag,
881 #messagelist tr td.priority
887 #messagelist tr td.size
894 #messagelist tr td.from,
895 #messagelist tr td.to,
896 #messagelist tr td.cc,
897 #messagelist tr td.replyto
903 #messagelist tr td.date
909 #messagelist tr.message
911 background-color: #FFF;
914 #messagelist tr.unread
917 background-color: #FFFFFF;
920 #messagelist tr.flagged td,
921 #messagelist tr.flagged td a
926 #messagelist tr.selected td
929 background-color: #CC3333;
932 #messagelist tr.unfocused td
935 background-color: #929292;
938 #messagelist tr.selected td a
943 #messagelist tr.unfocused td a
948 #messagelist tr.deleted td,
949 #messagelist tr.deleted td a
966 border: 1px solid #999999;
973 padding: 8px 0 3px 0;
978 /***** tree indicators *****/
986 td span.branch div.tree
990 background: url(images/tree.gif) 0px 0px no-repeat;
993 td span.branch div.l1
995 background-position: 0px 0px; /* L */
998 td span.branch div.l2
1000 background-position: -30px 0px; /* | */
1003 td span.branch div.l3
1005 background-position: -15px 0px; /* |- */
1009 /** message view styles */
1018 border: 1px solid #999;
1019 background-color: #FFF;
1024 div.messageheaderbox
1026 margin: -14px 8px 0px 8px;
1027 border: 1px solid #ccc;
1033 background-color: #EBEBEB;
1036 #messagebody #full-headers,
1037 #messagebody table.headers-table
1041 background-color: #F4F4F4;
1044 table.headers-table tr td
1047 border-bottom:1px solid #FFFFFF;
1050 table.headers-table tr td.header-title
1056 white-space: nowrap;
1057 padding: 0 4px 0 8px;
1060 table.headers-table tr td.header
1065 table.headers-table tr td.subject
1070 table.headers-table tr td.header span
1072 white-space: nowrap;
1078 padding: 0 4px 0 8px;
1080 list-style-image: none;
1081 list-style-type: none;
1082 background: url(images/icons/attachment.png) 4px 2px no-repeat #DFDFDF;
1085 #messageframe #attachment-list
1087 border-bottom: 1px solid #ccc;
1090 .messageheaderbox #attachment-list
1092 border-top: 1px solid #ccc;
1095 #attachment-list:after
1110 padding: 2px 0px 0px 15px;
1111 white-space: nowrap;
1114 #attachment-list li a
1116 text-decoration: none;
1119 #attachment-list li a:hover
1121 text-decoration: underline;
1127 padding-bottom: 10px;
1128 background-color: #FFFFFF;
1132 div.message-htmlpart
1135 border-top: 1px solid #ccc;
1136 /* overflow: hidden; */
1139 #messagebody div:first-child
1145 div.message-htmlpart a
1150 div.message-part pre,
1151 div.message-htmlpart pre,
1152 div.message-part div.pre
1156 font-family: monospace;
1157 white-space: -moz-pre-wrap !important;
1158 white-space: pre-wrap !important;
1162 div.message-part span.sig
1167 div.message-part blockquote
1170 border-left: 2px solid blue;
1171 border-right: 2px solid blue;
1172 background-color: #F6F6F6;
1173 margin: 2px 0px 2px 0px;
1174 padding: 1px 8px 1px 10px;
1177 div.message-part blockquote blockquote
1180 border-left: 2px solid green;
1181 border-right: 2px solid green;
1184 div.message-part blockquote blockquote blockquote
1187 border-left: 2px solid #bb0000;
1188 border-right: 2px solid #bb0000;
1191 body.iframe div.message-htmlpart
1196 div.message-htmlpart div.rcmBody
1201 #message-objects div
1205 padding: 10px 10px 6px 46px;
1208 #message-objects div a
1214 #message-objects div a:hover
1234 border-bottom: 1px solid #ccc;
1235 background-color: #EBEBEB;
1238 .messageheaderbox #full-headers
1252 background: url(images/icons/down_small.gif) no-repeat center;
1257 background: url(images/icons/up_small.gif) no-repeat center;
1268 border: 1px solid #999999;
1275 /** message compose styles */
1296 #compose-div .boxfooter
1303 #compose-div .boxlistcontent
1317 font-family: monospace;
1318 border: 1px solid #999;
1327 #compose-headers td.editfield
1333 #compose-headers td.top
1335 vertical-align: top;
1338 #compose-headers td.title,
1339 #compose-subject td.title
1341 width: 80px !important;
1344 padding-right: 10px;
1345 white-space: nowrap;
1349 #compose-headers td textarea,
1350 #compose-headers td input
1354 border: 1px solid #999;
1357 #compose-headers td textarea
1364 width: 80% !important;
1375 #compose-editorfooter
1383 #compose-editorfooter label
1398 #compose-attachments
1405 border: 1px solid #999;
1406 background-color: #F9F9F9;
1409 #compose-attachments ul
1413 background-color: #FFF;
1414 list-style-image: none;
1415 list-style-type: none;
1418 #compose-attachments ul li
1425 border-bottom: 1px solid #EBEBEB;
1426 white-space: nowrap;
1428 text-overflow: ellipsis;
1429 -o-text-overflow: ellipsis;
1432 #compose-attachments ul li img
1435 vertical-align: middle;
1443 #attachment-form div
1448 #attachment-form div.buttons