/** * Roundcube webmail styles for the Email section * * Copyright (c) 2011, The Roundcube Dev Team * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com * * The contents are subject to the Creative Commons Attribution-ShareAlike * License. It is allowed to copy, distribute, transmit and to adapt the work * by keeping credits to the original autors in the README file. * See http://creativecommons.org/licenses/by-sa/3.0/ for details. * * $Id$ */ #mailview-left { position: absolute; top: 0; left: 0; width: 240px; bottom: 0; } #mailview-right { position: absolute; top: 0; left: 250px; right: 0; bottom: 0; } #mailview-top { position: absolute; top: 42px; left: 0; width: 100%; bottom: 28px; } #mailview-bottom { position: absolute; left: 0; bottom: 0; width: 100%; height: 26px; } #mailboxcontainer, #messagelistcontainer { position: absolute; top: 42px; left: 0; width: 100%; bottom: 0; } #messagelistcontainer { top: 0; bottom: 32px; overflow: auto; } #messagelistfooter { position: absolute; bottom: 0; left: 0; right: 0; height: 26px; padding: 2px; } #messagelistfooter.rightalign { text-align: right; } #messagelistfooter #countcontrols { display: inline-block; } #mailboxlist li.mailbox { position: relative; background-repeat: no-repeat; background-position: 6px 2px; } #mailboxlist li.mailbox a { padding-left: 36px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background-image: url(images/listicons.png); background-repeat: no-repeat; background-position: 6px 3px; } #mailboxlist li.mailbox.selected > a { background-position: 6px -21px; } #mailboxlist li.inbox > a { background-position: 6px -189px; } #mailboxlist li.inbox.selected > a { background-position: 6px -213px; } #mailboxlist li.drafts > a { background-position: 6px -238px; } #mailboxlist li.drafts.selected > a { background-position: 6px -262px; } #mailboxlist li.sent > a { background-position: 6px -286px; } #mailboxlist li.sent.selected > a { background-position: 6px -310px; } #mailboxlist li.junk > a { background-position: 6px -334px; } #mailboxlist li.junk.selected > a { background-position: 6px -358px; } #mailboxlist li.trash > a { background-position: 6px -382px; } #mailboxlist li.trash.selected > a { background-position: 6px -406px; } #mailboxlist li.virtual > a { color: #aaa; } #mailboxlist li.mailbox ul { padding: 0; border-top: 1px solid #bbd3da; } #mailboxlist li.mailbox ul li { padding-left: 26px; } #mailboxlist li.mailbox ul li a { background-position: 6px -93px; } #mailboxlist li.mailbox ul li.selected a { background-position: 6px -117px; } #mailboxlist li.mailbox ul li:last-child { border-bottom: 0; } #mailboxlist li.mailbox div.collapsed, #mailboxlist li.mailbox div.expanded { position: absolute; top: 14px; left: 20px; width: 14px; height: 14px; background: url(images/listicons.png) -3px -144px no-repeat; cursor: pointer; } #mailboxlist li.mailbox div.expanded { background-position: -3px -168px; } #mailboxlist li.mailbox ul li div.collapsed, #mailboxlist li.mailbox ul li div.expanded { left: 45px; top: 15px; } #mailboxlist li.mailbox .unreadcount { position: absolute; top: 4px; right: 6px; width: 2.8em; padding: 2px; background: #82acb5; background: -moz-linear-gradient(top, #82acb5 0%, #6a939f 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82acb5), color-stop(100%,#6a939f)); background: -o-linear-gradient(top, #82acb5 0%, #6a939f 100%); background: -ms-linear-gradient(top, #82acb5 0%, #6a939f 100%); background: linear-gradient(top, #82acb5 0%, #6a939f 100%); box-shadow: inset 0 1px 1px 0 #536d72; -o-box-shadow: inset 0 1px 1px 0 #536d72; -webkit-box-shadow: inset 0 1px 1px 0 #536d72; -moz-box-shadow: inset 0 1px 1px 0 #536d72; border-radius: 9px; color: #fff; text-align: center; font-weight: bold; text-shadow: none; } #mailboxlist li.mailbox.selected .unreadcount { background: #005d76; background: -moz-linear-gradient(top, #005d76 0%, #004558 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#005d76), color-stop(100%,#004558)); background: -o-linear-gradient(top, #005d76 0%, #004558 100%); background: -ms-linear-gradient(top, #005d76 0%, #004558 100%); background: linear-gradient(top, #005d76 0%, #004558 100%); box-shadow: inset 0 1px 1px 0 #003645; -o-box-shadow: inset 0 1px 1px 0 #003645; -webkit-box-shadow: inset 0 1px 1px 0 #003645; -moz-box-shadow: inset 0 1px 1px 0 #003645; } #searchfilter { width: 16em; } #mailview-left select.mailboxlist { position: relative; top: 10px; width: 100%; } #messagetoolbar { position: absolute; top: -6px; right: 0; left: 15em; height: 40px; } #messagetoolbar.fullwidth { left: 0; } #mailtoolbar { text-align: right; } #mailpreviewtoggle { display: block; position: absolute; top: 4px; right: 2px; width: 20px; height: 18px; background: url(images/buttons.png) -5px -318px no-repeat; } #mailpreviewtoggle.enabled { background-position: -28px -318px; } /*** message list ***/ .boxlistcontent table { display: table; width: 100%; table-layout: fixed; border-collapse: collapse; border-spacing: 0; } .boxlistcontent thead tr td { font-size: 11px; font-weight: bold; background: #d6eaf3; background: -moz-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0,#e3f2f6), color-stop(14px,#d6eaf3), color-stop(100%,#d6eaf3)); background: -o-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%); background: -ms-linear-gradient(left, #e3f2f6 0, #d6eaf3 14px ,#d6eaf3 100%); background: linear-gradient(left, #e3f2f6 0, #d6eaf3 14px, #d6eaf3 100%); border-left: 1px solid #bbd3da; } .boxlistcontent thead tr td a { display: block; padding: 8px 7px; color: #69939e; text-decoration: none; } .boxlistcontent tbody tr td { font-size: 11px; padding: 4px 7px; border-bottom: 1px solid #ddd; border-left: 1px dotted #bbd3da; white-space: nowrap; cursor: default; overflow: hidden; text-overflow: ellipsis; } .boxlistcontent thead tr td:first-child, .boxlistcontent tbody tr td:first-child { border-left: 0; } .boxlistcontent tbody tr td a { color: #333; text-decoration: none; white-space: nowrap; cursor: default; } .boxlistcontent tr.selected td { color: #fff !important; background: #019bc6; background: -moz-linear-gradient(top, #019bc6 0%, #017cb4 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#019bc6), color-stop(100%,#017cb4)); background: -o-linear-gradient(top, #019bc6 0%, #017cb4 100%); background: -ms-linear-gradient(top, #019bc6 0%, #017cb4 100%); background: linear-gradient(top, #019bc6 0%, #017cb4 100%); } .boxlistcontent tr.selected td a, .boxlistcontent tr.selected td span { color: #fff !important; } .boxlistcontent tr.unfocused td { color: #fff !important; background: #4db0d2; } .boxlistcontent tr.unfocused td a, .boxlistcontent tr.unfocused td span { color: #fff !important; } .boxlistcontent tr.deleted td, .boxlistcontent tr.deleted td a { color: #ccc !important; } #messagelist tr td.attachment, #messagelist tr td.threads, #messagelist tr td.status, #messagelist tr td.flag, #messagelist tr td.priority { width: 20px; padding: 4px 3px; } html.chrome #messagelist tr td.attachment, html.chrome #messagelist tr td.threads, html.chrome #messagelist tr td.status, html.chrome #messagelist tr td.flag, html.chrome #messagelist tr td.priority { width: 26px; } #messagelist tr td.threads { width: 26px; } html.chrome #messagelist tr td.threads { width: 30px; } #messagelist tr td.flag, #messagelist tr td.status, #messagelist tr td.threads { border-left: 0; } #messagelist tr td.size { width: 60px; text-align: right; } #messagelist tr td.from, #messagelist tr td.to, #messagelist tr td.cc, #messagelist tr td.replyto { width: 180px; } #messagelist tr td.date { width: 118px; } #messagelist tr.message { /* background-color: #fff; */ } #messagelist tr.unread { font-weight: bold; /* background-color: #fff; */ } #messagelist tr.flagged td, #messagelist tr.flagged td a { color: #f30; } #messagelist thead tr td.sortedASC a, #messagelist thead tr td.sortedDESC a { color: #004458; text-decoration: underline; background: url(images/listicons.png) right -912px no-repeat; } #messagelist thead tr td.sortedASC a { background-position: right -944px; } #messagelist td img { vertical-align: middle; display: inline-block; } #messagelist tbody tr td.flag, #messagelist tbody tr td.status, #messagelist tbody tr td.subject span.status { cursor: pointer; } #messagelist tr td.flag span, #messagelist tr td.status span, #messagelist tr td.attachment span, #messagelist tr td.priority span { display: block; width: 20px; } #messagelist tr td div.collapsed, #messagelist tr td div.expanded, #messagelist tr td.threads div.listmenu, #messagelist tr td.attachment span.attachment, #messagelist tr td.attachment span.report, #messagelist tr td.priority span.priority, #messagelist tr td.priority span.prio1, #messagelist tr td.priority span.prio2, #messagelist tr td.priority span.prio3, #messagelist tr td.priority span.prio4, #messagelist tr td.priority span.prio5, #messagelist tr td.flag span.flagged, #messagelist tr td.flag span.unflagged, #messagelist tr td.flag span.unflagged:hover, #messagelist tr td.status span.status, #messagelist tr td.status span.msgicon, #messagelist tr td.status span.deleted, #messagelist tr td.status span.unread, #messagelist tr td.status span.unreadchildren, #messagelist tr td.subject span.msgicon, #messagelist tr td.subject span.deleted, #messagelist tr td.subject span.unread, #messagelist tr td.subject span.replied, #messagelist tr td.subject span.forwarded, #messagelist tr td.subject span.unreadchildren { display: inline-block; vertical-align: middle; height: 18px; width: 20px; background: url(images/listicons.png) -100px 0 no-repeat; } #messagelist tbody tr td.attachment span.attachment { background-position: 0 -998px; } #messagelist thead tr td.attachment span.attachment { background-position: -24px -997px; } /* #messagelist tr td.attachment span.report { background-position: 0 -255px; } #messagelist tr td.priority span.priority { background-position: 0 -309px; } #messagelist tr td.priority span.prio5 { background-position: 0 -358px; } #messagelist tr td.priority span.prio4 { background-position: 0 -340px; } #messagelist tr td.priority span.prio3 { background-position: 0 -324px; } #messagelist tr td.priority span.prio2 { background-position: 0 -309px; } #messagelist tr td.priority span.prio1 { background-position: 0 -290px; } */ #messagelist tbody tr td.flag span.flagged { background-position: 0 -1036px; } #messagelist thead tr td.flag span.flagged { background-position: -24px -1036px; } #messagelist tr td.flag span.unflagged:hover { background-position: 0 -1056px; } #messagelist tr td.subject span.msgicon, #messagelist tr td.subject span.unreadchildren { background-position: 0 -1056px; margin: 0 4px 0 0; } #messagelist tr td.subject span.replied { background-position: 0 -1076px; } #messagelist tr td.subject span.forwarded { background-position: 0 -1096px; } #messagelist tr td.subject span.replied.forwarded { background-position: 0 -1116px; } #messagelist tr td.status span.msgicon, #messagelist tr td.flag span.unflagged, #messagelist tr td.status span.unreadchildren { background-position: 0 1056px; /* no icon */ } /* #messagelist tr td.status span.msgicon:hover { background-position: 0 -272px; } #messagelist tr td.status span.deleted, #messagelist tr td.subject span.deleted { background-position: 0 -187px; } */ #messagelist tr td.status span.status, #messagelist tr td.status span.unread, #messagelist tr td.subject span.unread { background-position: 0 -1016px; } #messagelist tr td div.collapsed { background-position: 0 -1136px; cursor: pointer; } #messagelist tr td div.expanded { background-position: 0 -1156px; cursor: pointer; } #messagelist tr td.threads div.listmenu { background-position: 0 -976px; cursor: pointer; width: 26px; } #messagelist tbody tr td.subject { width: 99%; } #messagelist tbody tr td.subject a { cursor: default; vertical-align: middle; /* #1487091 */ } /* thread parent message with unread children */ #messagelist tbody tr.unroot td.subject a { text-decoration: underline; } /**** tree indicators ****/ #messagelist tbody tr td span.branch div { float: left; height: 18px; } #messagelist tbody tr td span.branch div.tree { height: 18px; width: 15px; /* background: url(images/tree.gif) 0px 0px no-repeat; */ } /**** message view ****/ #messagecontent { position: absolute; top: 140px; left: 0; width: 100%; bottom: 32px; overflow: auto; } #messageheader, #partheader { padding: 3px 0; background: #fff; background: -moz-linear-gradient(top, #fff 0%, #f0f0f0 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#f0f0f0)); background: -o-linear-gradient(top, #fff 0%, #f0f0f0 100%); background: -ms-linear-gradient(top, #fff 0%, #f0f0f0 100%); background: linear-gradient(top, #fff 0%, #f0f0f0 100%); } .headers-table td { color: #666; padding: 2px 8px; font-size: 11px; } .headers-table td.header { font-weight: bold; } .headers-table td.header a { color: #666; text-decoration: none; } .headers-table td.header a:hover { text-decoration: underline; } .headers-table td.subject { color: #333; font-size: 110%; font-weight: bold; } .rcmaddcontact { position: relative; top: 1px; margin-left: 0.5em; } #messagecontent .leftcol { margin-right: 250px; } #messagecontent .rightcol { float: right; /* position: absolute; top: 10px; right: 10px; height: 90%; */ width: 230px; margin: 8px; min-height: 200px; background: #f0f0f0; padding: 8px; } #messagebody { margin: 8px; } #message-objects div, #messagebody span.part-notice { margin: 8px; } #message-objects div.notice { color: #960; border: 1px solid #ffdf0e; background-color: #fef893; background-position: 5px -24px; padding: 6px 12px 4px 30px; } #message-objects div a.button, #messagebody span.part-notice a.button { font-size: 11px; margin-left: 10px; border: 1px solid #ccc; box-shadow: 0 1px 1px 0 #e8e386; -o-box-shadow: 0 1px 1px 0 #e8e386; -webkit-box-shadow: 0 1px 1px 0 #e8e386; -moz-box-shadow: 0 1px 1px 0 #e8e386; } div.message-part, div.message-htmlpart { padding: 10px 8px; border-top: 1px solid #ccc; } #messagebody div:first-child { border-top: 0; } div.message-part a, div.message-htmlpart a { color: #0000CC; } div.message-part pre, div.message-htmlpart pre, div.message-part div.pre { margin: 0px; padding: 0px; font-family: monospace; white-space: -moz-pre-wrap !important; white-space: pre-wrap !important; white-space: pre; } div.message-part span.sig { color: #666666; } div.message-part blockquote { color: blue; border-left: 2px solid blue; border-right: 2px solid blue; background-color: #F6F6F6; margin: 2px 0px 2px 0px; padding: 1px 8px 1px 10px; } div.message-part blockquote blockquote { color: green; border-left: 2px solid green; border-right: 2px solid green; } div.message-part blockquote blockquote blockquote { color: #990000; border-left: 2px solid #bb0000; border-right: 2px solid #bb0000; } #messagebody > hr { color: #fff; background: #fff; border: 0; border-bottom: 2px dotted #ccc; } #messagebody > p > img { max-width: 80%; } #attachment-list { list-style: none; margin: 0; padding: 0; overflow: hidden; text-overflow: ellipsis; } #attachment-list li { display: block; background: url(images/filetypes.png) 0 0 no-repeat; margin-bottom: 1px; } #attachment-list li.pdf { background-position: 0 -26px; } #attachment-list li.doc, #attachment-list li.msword { background-position: 0 -52px; } #attachment-list li.xls, #attachment-list li.msexcel { background-position: 0 -78px; } #attachment-list li.zip, #attachment-list li.gz { background-position: 0 -104px; } #attachment-list li.image { background-position: 0 -130px; } #attachment-list li.audio { background-position: 0 -156px; } #attachment-list li.video { background-position: 0 -182px; } #attachment-list li a { display: block; color: #333; font-size: 11px; font-weight: bold; padding: 8px 4px 3px 30px; text-shadow: 1px 1px 1px #fff; text-decoration: none; white-space: nowrap; } #attachment-list li a:hover { text-decoration: underline; } #messagepartcontainer { position: absolute; top: 60px; left: 0px; right: 0px; bottom: 0px; } #messagepartframe { border: 0; }