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="0"]
162 #searchmenu ul.toolbarmenu
167 #searchmenu ul.toolbarmenu li
172 #messagemenu li a.active:hover,
173 #markmessagemenu li a.active:hover
176 background-color: #c00;
181 background: url(images/messageactions.png) no-repeat 7px 0;
182 background-position: 7px 20px;
185 #messagemenu li a.printlink
187 background-position: 7px 1px;
190 #messagemenu li a.downloadlink
192 background-position: 7px -17px;
195 #messagemenu li a.sourcelink
197 background-position: 7px -35px;
200 #messagemenu li a.openlink
202 background-position: 7px -53px;
205 #messagemenu li a.editlink
207 background-position: 7px -71px;
210 #markmessagemenu li a
212 background: url(images/messageicons.png) no-repeat;
215 #markmessagemenu li a.readlink
217 background-position: 7px -51px;
220 #markmessagemenu li a.unreadlink
222 background-position: 7px -119px;
225 #markmessagemenu li a.flaggedlink
227 background-position: 7px -153px;
230 #markmessagemenu li a.unflaggedlink
232 background-position: 7px -136px;
240 vertical-align: middle;
276 #messagepartcontainer
291 border: 1px solid #999999;
292 background-color: #F9F9F9;
302 border: 1px solid #999999;
303 background-color: #F9F9F9;
321 border: 1px solid #999999;
322 background-color: #F9F9F9;
339 vertical-align: middle;
343 #partheader table td.title
350 /** mailbox list styles */
352 #mailboxlist-container
359 border: 1px solid #999;
360 background-color: #F9F9F9;
370 list-style-image: none;
371 list-style-type: none;
374 background-color: #FFF;
382 background: url(images/icons/folders.png) 5px 0 no-repeat;
383 border-bottom: 1px solid #EBEBEB;
389 left: 8px !important;
396 #mailboxlist li div.collapsed,
397 #mailboxlist li div.expanded
402 #mailboxlist li div.collapsed
404 background: url(images/icons/collapsed.png) bottom right no-repeat;
407 #mailboxlist li div.expanded
409 background: url(images/icons/expanded.png) bottom right no-repeat;
412 #mailboxlist li.inbox
414 background-position: 5px -18px;
417 #mailboxlist li.drafts
419 background-position: 5px -37px;
424 background-position: 5px -54px;
429 background-position: 5px -73px;
432 #mailboxlist li.trash
434 background-position: 5px -91px;
445 text-decoration: none;
448 #mailboxlist li.unread
453 #mailboxlist li.virtual > a
458 #mailboxlist li.selected,
459 #mailboxlist li.droptarget li.selected
461 background-color: #929292;
464 #mailboxlist li.selected > a,
465 #mailboxlist li.droptarget li.selected a
471 #mailboxlist li.droptarget
473 background-color: #FFFFA6;
476 /* styles for nested folders */
481 border-top: 1px solid #EBEBEB;
483 background-position: 25px 1px;
484 background-color: #FFF;
512 #listcontrols a.button,
513 #listcontrols a.buttonPas
523 background: url(images/mail_footer.png) 0 0 no-repeat transparent;
524 opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */
527 #listcontrols a.buttonPas
532 #listcontrols a.all {
533 background-position: -30px 0;
536 #listcontrols a.allsel {
537 background-position: -30px -15px;
540 #listcontrols a.page {
541 background-position: -135px 0;
544 #listcontrols a.pagesel {
545 background-position: -135px -15px;
548 #listcontrols a.unread {
549 background-position: -45px 0;
552 #listcontrols a.unreadsel {
553 background-position: -45px -15px;
556 #listcontrols a.invert {
557 background-position: -60px 0;
560 #listcontrols a.invertsel {
561 background-position: -60px -15px;
564 #listcontrols a.none {
565 background-position: -75px 0;
568 #listcontrols a.nonesel {
569 background-position: -75px -15px;
572 #listcontrols a.expand-all {
573 background-position: -90px 0;
576 #listcontrols a.expand-allsel {
577 background-position: -90px -15px;
580 #listcontrols a.collapse-all {
581 background-position: -105px 0;
584 #listcontrols a.collapse-allsel {
585 background-position: -105px -15px;
588 #listcontrols a.expand-unread {
589 background-position: -120px 0;
592 #listcontrols a.expand-unreadsel {
593 background-position: -120px -15px;
606 #countcontrols a.button,
607 #countcontrols a.buttonPas
613 /** message list styles */
618 background-color: #F9F9F9;
628 #messagelist thead tr td
631 padding: 0 4px 0 2px;
632 vertical-align: middle;
633 border-bottom: 1px solid #999999;
635 background: url(images/listheader.gif) top left repeat-x #CCC;
640 #messagelist thead tr td.sortedASC,
641 #messagelist thead tr td.sortedDESC
643 background-position: 0 -22px;
646 #messagelist thead tr td.sortedASC a
648 background: url(images/icons/sort.gif) right 0 no-repeat;
651 #messagelist thead tr td.sortedDESC a
653 background: url(images/icons/sort.gif) right -14px no-repeat;
656 #messagelist thead tr td a
659 width: auto !important;
662 text-decoration: none;
665 #messagelist thead tr td.size
670 #messagelist thead tr td.subject
675 #messagelist tbody tr td
681 vertical-align: middle;
683 text-overflow: ellipsis;
684 -o-text-overflow: ellipsis;
685 border-bottom: 1px solid #EBEBEB;
689 #messagelist tbody tr td a
692 text-decoration: none;
697 #messagelist td span,
700 vertical-align: middle;
701 display: inline-block;
704 #messagelist tbody tr td.flag,
705 #messagelist tbody tr td.status,
706 #messagelist tbody tr td.subject span.status
711 #messagelist tr td.flag span,
712 #messagelist tr td.status span,
713 #messagelist tr td.attachment span
718 #messagelist tr td div.collapsed,
719 #messagelist tr td div.expanded,
720 #messagelist tr td.threads div.listmenu,
721 #messagelist tr td.attachment span.attachment,
722 #messagelist tr td.attachment span.report,
723 #messagelist tr td.flag span.flagged,
724 #messagelist tr td.flag span.unflagged:hover,
725 #messagelist tr td.status span.status,
726 #messagelist tr td.status span.msgicon,
727 #messagelist tr td.status span.deleted,
728 #messagelist tr td.status span.unread,
729 #messagelist tr td.status span.unreadchildren,
730 #messagelist tr td.subject span.msgicon,
731 #messagelist tr td.subject span.deleted,
732 #messagelist tr td.subject span.unread,
733 #messagelist tr td.subject span.replied,
734 #messagelist tr td.subject span.forwarded,
735 #messagelist tr td.subject span.unreadchildren
737 vertical-align: middle;
740 background: url(images/messageicons.png) center no-repeat;
743 #messagelist tr td.attachment span.attachment
745 background-position: 0 -170px;
748 #messagelist tr td.attachment span.report
750 background-position: 0 -255px;
753 #messagelist tr td.flag span.flagged
755 background-position: 0 -153px;
758 #messagelist tr td.flag span.unflagged:hover
760 background-position: 0 -136px;
763 #messagelist tr td.subject span.msgicon,
764 #messagelist tr td.subject span.unreadchildren
766 background-position: 0 -51px;
770 #messagelist tr td.subject span.replied
772 background-position: 0 -85px;
775 #messagelist tr td.subject span.forwarded
777 background-position: 0 -68px;
780 #messagelist tr td.subject span.replied.forwarded
782 background-position: 0 -102px;
785 #messagelist tr td.status span.msgicon,
786 #messagelist tr td.status span.unreadchildren
788 background-position: 0 17px; /* no icon */
791 #messagelist tr td.status span.msgicon:hover
793 background-position: 0 -272px;
796 #messagelist tr td.status span.deleted,
797 #messagelist tr td.subject span.deleted
799 background-position: 0 -187px;
802 #messagelist tr td.status span.status,
803 #messagelist tr td.status span.unread,
804 #messagelist tr td.subject span.unread
806 background-position: 0 -119px;
809 #messagelist tr td div.collapsed
811 background-position: 0 -221px;
815 #messagelist tr td div.expanded
817 background-position: 0 -204px;
821 #messagelist tr td.threads div.listmenu
823 background-position: 0 -238px;
827 #messagelist tbody tr td.subject
832 #messagelist tbody tr td.subject a
835 display: inline-block;
836 vertical-align: middle;
839 /* thread parent message with unread children */
840 #messagelist tbody tr.unroot td.subject a
842 text-decoration: underline;
845 #messagelist tr td.attachment,
846 #messagelist tr td.threads,
847 #messagelist tr td.status,
848 #messagelist tr td.flag
854 #messagelist tr td.size
861 #messagelist tr td.from,
862 #messagelist tr td.to,
863 #messagelist tr td.cc,
864 #messagelist tr td.replyto
870 #messagelist tr td.date
876 #messagelist tr.message
878 background-color: #FFF;
884 background-color: #F9F9F9;
888 #messagelist tr.unread
891 background-color: #FFFFFF;
894 #messagelist tr.flagged td,
895 #messagelist tr.flagged td a
900 #messagelist tr.selected td
903 background-color: #CC3333;
906 #messagelist tr.unfocused td
909 background-color: #929292;
912 #messagelist tr.selected td a
917 #messagelist tr.unfocused td a
922 #messagelist tr.deleted td,
923 #messagelist tr.deleted td a
940 border: 1px solid #999999;
947 padding: 8px 0 3px 0;
952 /***** tree indicators *****/
960 td span.branch div.tree
964 background: url(images/tree.gif) 0px 0px no-repeat;
967 td span.branch div.l1
969 background-position: 0px 0px; /* L */
972 td span.branch div.l2
974 background-position: -30px 0px; /* | */
977 td span.branch div.l3
979 background-position: -15px 0px; /* |- */
983 /** message view styles */
992 border: 1px solid #999;
993 background-color: #FFF;
1000 margin: 6px 8px 0px 8px;
1001 border: 1px solid #ccc;
1007 background-color: #EBEBEB;
1010 #messagebody table.headers-table
1014 background-color: #F4F4F4;
1015 border: 1px solid #ccc;
1018 #messageframe table.headers-table
1020 border-bottom: 1px solid #ccc;
1023 table.headers-table tr td
1026 border-bottom:1px solid #FFFFFF;
1029 table.headers-table tr td.header-title
1035 white-space: nowrap;
1039 table.headers-table tr td.header
1044 table.headers-table tr td.subject
1049 table.headers-table tr td.all
1054 padding-right: 10px;
1056 padding: 2px 6px 4px 6px;
1060 table.headers-table tr td.more-headers
1071 padding: 0 4px 0 8px;
1073 list-style-image: none;
1074 list-style-type: none;
1075 background: url(images/icons/attachment.png) 4px 2px no-repeat #DFDFDF;
1078 #attachment-list:after
1093 padding: 2px 0px 0px 15px;
1094 white-space: nowrap;
1097 #attachment-list li a
1099 text-decoration: none;
1102 #attachment-list li a:hover
1104 text-decoration: underline;
1110 padding-bottom: 10px;
1111 background-color: #FFFFFF;
1115 div.message-htmlpart
1118 border-top: 1px solid #ccc;
1119 /* overflow: hidden; */
1122 #messagebody div:first-child
1128 div.message-htmlpart a
1133 div.message-part pre,
1134 div.message-htmlpart pre,
1135 div.message-part div.pre
1139 font-family: monospace;
1140 white-space: -moz-pre-wrap !important;
1141 white-space: pre-wrap !important;
1145 div.message-part span.sig
1150 div.message-part blockquote
1153 border-left: 2px solid blue;
1154 border-right: 2px solid blue;
1155 background-color: #F6F6F6;
1156 margin: 2px 0px 2px 0px;
1157 padding: 1px 8px 1px 10px;
1160 div.message-part blockquote blockquote
1163 border-left: 2px solid green;
1164 border-right: 2px solid green;
1167 div.message-part blockquote blockquote blockquote
1170 border-left: 2px solid #bb0000;
1171 border-right: 2px solid #bb0000;
1174 body.iframe div.message-htmlpart
1179 div.message-htmlpart div.rcmBody
1184 #remote-objects-message
1189 padding: 10px 10px 6px 46px;
1192 #remote-objects-message a
1198 #remote-objects-message a:hover
1215 background: url(images/icons/down_small.gif) no-repeat center;
1220 background: url(images/icons/up_small.gif) no-repeat center;
1237 white-space: nowrap;
1238 border: 1px solid #999999;
1245 /** message compose styles */
1266 #compose-div .boxfooter
1273 #compose-div .boxlistcontent
1287 font-family: monospace;
1288 border: 1px solid #999;
1297 #compose-headers td.editfield
1303 #compose-headers td.top
1305 vertical-align: top;
1308 #compose-headers td.title,
1309 #compose-subject td.title
1311 width: 80px !important;
1314 padding-right: 10px;
1315 white-space: nowrap;
1319 #compose-headers td textarea,
1320 #compose-headers td input
1324 border: 1px solid #999;
1327 #compose-headers td textarea
1334 width: 80% !important;
1346 .formlinks a:visited
1350 text-decoration: none;
1354 .formlinks a:visited
1359 #compose-editorfooter
1367 #compose-editorfooter label
1382 #compose-attachments
1389 border: 1px solid #999;
1390 background-color: #F9F9F9;
1393 #compose-attachments ul
1397 background-color: #FFF;
1398 list-style-image: none;
1399 list-style-type: none;
1402 #compose-attachments ul li
1409 border-bottom: 1px solid #EBEBEB;
1410 white-space: nowrap;
1412 text-overflow: ellipsis;
1413 -o-text-overflow: ellipsis;
1416 #compose-attachments ul li img
1419 vertical-align: middle;
1427 #attachment-form div
1432 #attachment-form div.buttons