X-Git-Url: https://git.donarmstrong.com/?a=blobdiff_plain;f=skins%2Fdefault%2Fmail.css;h=4dfc206741146bdb1508c52cf051e94b841ec22a;hb=76507f7c63a660742e76889ad6e3919f3dde3bb0;hp=72a782bc2a3842411e60f58695fdb7902f6b0241;hpb=0af63e79917234f76cfa7ec74e9d97b24fbf9b55;p=roundcube.git diff --git a/skins/default/mail.css b/skins/default/mail.css index 72a782b..4dfc206 100644 --- a/skins/default/mail.css +++ b/skins/default/mail.css @@ -1,34 +1,147 @@ -/***** RoundCube|Mail mail task styles *****/ +/***** Roundcube|Mail mail task styles *****/ #messagetoolbar { position: absolute; - top: 45px; - left: 200px; - right: 250px; + top: 47px; + left: 205px; + right: 10px; height: 35px; + min-width: 650px; white-space: nowrap; /* border: 1px solid #cccccc; */ } #messagetoolbar a { + display: block; + float: left; padding-right: 10px; } -#messagetoolbar select -{ - font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif; - font-size: 11px; - color: #333333; +#messagetoolbar a.button, +#messagetoolbar a.buttonPas { + display: block; + float: left; + width: 32px; + height: 32px; + padding: 0; + margin: 0 5px; + overflow: hidden; + background: url(images/mail_toolbar.png) 0 0 no-repeat transparent; + opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */ +} + +#messagetoolbar a.buttonPas { + opacity: 0.35; +} + +#messagetoolbar a.checkmailSel { + background-position: 0 -32px; +} + +#messagetoolbar a.back { + background-position: -32px 0; +} + +#messagetoolbar a.backSel { + background-position: -32px -32px; +} + +#messagetoolbar a.compose { + background-position: -64px 0; +} + +#messagetoolbar a.composeSel { + background-position: -64px -32px; +} + +#messagetoolbar a.reply { + background-position: -96px 0; +} + +#messagetoolbar a.replySel { + background-position: -96px -32px; +} + +#messagetoolbar a.replyAll { + background-position: -128px 0; +} + +#messagetoolbar a.replyAllSel { + background-position: -128px -32px; +} + +#messagetoolbar a.forward { + background-position: -160px 0; +} + +#messagetoolbar a.forwardSel { + background-position: -160px -32px; +} + +#messagetoolbar a.delete { + background-position: -192px 0; +} + +#messagetoolbar a.deleteSel { + background-position: -192px -32px; +} + +#messagetoolbar a.markmessage { + background-position: -256px 0; +} + +#messagetoolbar a.messagemenu { + background-position: -288px 0; +} + +#messagetoolbar a.spellcheck { + background-position: -384px 0; +} + +#messagetoolbar a.spellcheckSel { + background-position: -384px -32px; +} + +#messagetoolbar a.attach { + background-position: -352px 0; +} + +#messagetoolbar a.attachSel { + background-position: -352px -32px; +} + +#messagetoolbar a.insertsig { + background-position: -448px 0; +} + +#messagetoolbar a.insertsigSel { + background-position: -448px -32px; +} + +#messagetoolbar a.savedraft { + background-position: -322px 0; +} + +#messagetoolbar a.savedraftSel { + background-position: -322px -32px; +} + +#messagetoolbar a.send { + background-position: -416px 0; +} + +#messagetoolbar a.sendSel { + background-position: -416px -32px; } #messagetoolbar select.mboxlist { - position: absolute; - left: 375px; - top: 10px; + position: relative; + margin: 0 8px; + top: 6px; } #messagetoolbar select.mboxlist option @@ -36,64 +149,113 @@ padding-left: 15px; } -#messagetoolbar select.mboxlist option[value="0"] +#messagetoolbar select.mboxlist option[value=""] { padding-left: 2px; } -#listcontrols +#messagemenu li a.active:hover, +#markmessagemenu li a.active:hover { - position: absolute; - left: 200px; - bottom: 20px; - height: 16px; - width: 500px; - font-size: 11px; + color: #fff; + background-color: #c00; } -#listcontrols a, -#listcontrols a:active, -#listcontrols a:visited, -#mailboxcontrols a, -#mailboxcontrols a:active, -#mailboxcontrols a:visited +#messagemenu li a { - color: #999999; - font-size: 11px; - text-decoration: none; + background: url(images/messageactions.png) no-repeat 7px 0; + background-position: 7px 20px; } -#listcontrols a.active, -#listcontrols a.active:active, -#listcontrols a.active:visited, -#mailboxcontrols a.active, -#mailboxcontrols a.active:active, -#mailboxcontrols a.active:visited +#messagemenu li a.printlink { - color: #CC0000; + background-position: 7px 1px; } -#listcontrols a.active:hover, -#mailboxcontrols a.active:hover +#messagemenu li a.downloadlink { - text-decoration: underline; + background-position: 7px -17px; } -#messagecountbar +#messagemenu li a.sourcelink +{ + background-position: 7px -35px; +} + +#messagemenu li a.openlink +{ + background-position: 7px -53px; +} + +#messagemenu li a.editlink +{ + background-position: 7px -71px; +} + +#markmessagemenu li a +{ + background: url(images/messageicons.png) no-repeat; +} + +#markmessagemenu li a.readlink +{ + background-position: 7px -51px; +} + +#markmessagemenu li a.unreadlink +{ + background-position: 7px -119px; +} + +#markmessagemenu li a.flaggedlink +{ + background-position: 7px -153px; +} + +#markmessagemenu li a.unflaggedlink +{ + background-position: 7px -136px; +} + +#searchfilter { - position: absolute; - bottom: 16px; - right: 40px; - width: 300px; - height: 20px; - text-align: right; white-space: nowrap; + position: absolute; + right: 198px; + vertical-align: middle; } -#messagecountbar span +#searchfilter label { font-size: 11px; - color: #333333; +} + +#mailleftcontainer +{ + position: absolute; + top: 0; + left: 0; + bottom: 0; + width: 195px; +} + +#mailrightcontainer +{ + position: absolute; + top: 0; + left: 170px; + bottom: 0; + right: 0; + min-width: 600px; +} + +#mailrightcontent +{ + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; } #messagepartcontainer @@ -108,23 +270,43 @@ #mailcontframe { position: absolute; - top: 85px; - left: 200px; - right: 40px; - bottom: 40px; + width: 100%; + top: 0; + bottom: 0; + border: 1px solid #999999; + background-color: #F9F9F9; + overflow: hidden; +} + +#mailpreviewframe +{ + position: absolute; + width: 100%; + top: 205px; + bottom: 0px; border: 1px solid #999999; background-color: #F9F9F9; - overflow: auto; - /* css hack for IE */ - width: expression((parseInt(document.documentElement.clientWidth)-240)+'px'); - height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); } +#messagecontframe +{ + position: relative; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; + width: 100%; + height: 100%; + min-height: 100%; /* Chrome 14 bug */ +} #messagepartframe { + width: 100%; + height: 100%; + min-height: 100%; /* Chrome 14 bug */ border: 1px solid #999999; - background-color: #F9F9F9; + background-color: #F9F9F9; } @@ -133,6 +315,7 @@ position: absolute; top: 10px; left: 220px; + right: 20px; height: 40px; } @@ -150,57 +333,24 @@ font-weight: bold; } -#rcmdraglayer -{ - width: 300px; - border: 1px solid #999999; - background-color: #F9F9F9; - padding-left: 8px; - padding-right: 8px; - padding-top: 3px; - padding-bottom: 3px; - font-size: 11px; - opacity: 0.6; - -moz-opacity: 0.6; -} - /** mailbox list styles */ -#mailboxlist-header -{ - position: absolute; - top: 85px; - left: 20px; - width: 140px !important; -/* width: 162px; */ - height: 13px; - padding: 3px 10px 2px 10px; - background-color: #EBEBEB; - background-image: url(images/listheader_aqua.gif); - border: 1px solid #CCCCCC; - color: #333333; - font-size: 11px; - font-weight: bold; -} - #mailboxlist-container { position: absolute; - top: 105px; - left: 20px; - width: 160px; - bottom: 40px; - border: 1px solid #CCCCCC; + top: 0; + left: 0; + width: 100%; + bottom: 0; + border: 1px solid #999; background-color: #F9F9F9; - overflow: auto; - /* css hack for IE */ - height: expression((parseInt(document.documentElement.clientHeight)-145)+'px'); + overflow: hidden; } #mailboxlist { - width: 100%; + position:relative; height: auto; margin: 0px; padding: 0px; @@ -208,55 +358,84 @@ list-style-type: none; overflow: hidden; white-space: nowrap; + background-color: #FFF; } #mailboxlist li { - /* height: 18px; */ + display: block; + position: relative; font-size: 11px; - background: url(images/icons/folder-closed.png) no-repeat; - background-position: 10px 1px; + background: url(images/icons/folders.png) 5px 0 no-repeat; border-bottom: 1px solid #EBEBEB; -/* IE 5.5 margin-left: -16px; */ +} + +#mailboxlist li ul li:last-child +{ + border-bottom: none; +} + +#mailboxlist li div +{ + position: absolute; + left: 8px !important; + left: -16px; + top: 1px; + width: 14px; + height: 16px; +} + +#mailboxlist li div.collapsed, +#mailboxlist li div.expanded +{ + cursor: pointer; +} + +#mailboxlist li div.collapsed +{ + background: url(images/icons/collapsed.png) bottom right no-repeat; +} + +#mailboxlist li div.expanded +{ + background: url(images/icons/expanded.png) bottom right no-repeat; } #mailboxlist li.inbox { - background-image: url(images/icons/folder-inbox.png); + background-position: 5px -18px; } #mailboxlist li.drafts { - background-image: url(images/icons/folder-drafts.png); + background-position: 5px -37px; } #mailboxlist li.sent { - background-image: url(images/icons/folder-sent.png); + background-position: 5px -54px; } #mailboxlist li.junk { - background-image: url(images/icons/folder-junk.png); + background-position: 5px -73px; } #mailboxlist li.trash { - background-image: url(images/icons/folder-trash.png); + background-position: 5px -91px; } #mailboxlist li a { + cursor: default; display: block; - padding-left: 32px; + position: relative; + padding-left: 25px; padding-top: 2px; padding-bottom: 2px; text-decoration: none; -} - -#mailboxlist li, #mailboxlist li.unread -{ - /* background-image: url(images/mailbox_list.gif); */ + height: 15px; } #mailboxlist li.unread @@ -264,13 +443,19 @@ font-weight: bold; } -#mailboxlist li.selected +#mailboxlist li.virtual > a +{ + color: #666; +} + +#mailboxlist li.selected, +#mailboxlist li.droptarget li.selected { background-color: #929292; - border-bottom: 1px solid #898989; } -#mailboxlist li.selected a +#mailboxlist li.selected > a, +#mailboxlist li.droptarget li.selected a { color: #FFF; font-weight: bold; @@ -285,168 +470,446 @@ #mailboxlist ul { list-style: none; padding: 0; - margin:0; - border-top: 1px solid #EBEBEB; -} - -#mailboxlist ul li { + margin: 0; + border-top: 1px solid #EBEBEB; padding-left: 15px; background-position: 25px 1px; + background-color: #FFF; + color: blue; + font-weight: normal; } -#mailboxlist li.selected li { - background-color: #F9F9F9; +#listcontrols +{ + position: relative; + white-space: nowrap; + left: 4px; + line-height: 22px; + width: auto; + min-width: 300px; } -#mailboxlist li.unread li { - font-weight: normal; +#listcontrols a, +#listcontrols span +{ + display: block; + float: left; + font-size: 11px; } -#mailboxlist li.unread li.unread { - font-weight: bold; +#listcontrols input +{ + margin-top: 6px; } -#mailboxlist li.selected li a{ - color: black; - font-weight: normal; +#listcontrols a.button, +#listcontrols a.buttonPas +{ + display: block; + float: left; + width: 15px; + height: 15px; + padding: 0; + margin-top: 4px; + margin-right: 2px; + overflow: hidden; + background: url(images/mail_footer.png) 0 0 no-repeat transparent; + opacity: 0.99; /* this is needed to make buttons appear correctly in Chrome */ +} + +#listcontrols a.buttonPas +{ + opacity: 0.35; +} + +#listcontrols a.all { + background-position: -30px 0; +} + +#listcontrols a.allsel { + background-position: -30px -15px; +} + +#listcontrols a.page { + background-position: -135px 0; +} + +#listcontrols a.pagesel { + background-position: -135px -15px; +} + +#listcontrols a.unread { + background-position: -45px 0; +} + +#listcontrols a.unreadsel { + background-position: -45px -15px; +} + +#listcontrols a.invert { + background-position: -60px 0; +} + +#listcontrols a.invertsel { + background-position: -60px -15px; +} + +#listcontrols a.none { + background-position: -75px 0; +} + +#listcontrols a.nonesel { + background-position: -75px -15px; +} + +#listcontrols a.expand-all { + background-position: -90px 0; +} + +#listcontrols a.expand-allsel { + background-position: -90px -15px; } +#listcontrols a.collapse-all { + background-position: -105px 0; +} + +#listcontrols a.collapse-allsel { + background-position: -105px -15px; +} + +#listcontrols a.expand-unread { + background-position: -120px 0; +} + +#listcontrols a.expand-unreadsel { + background-position: -120px -15px; +} -#mailboxcontrols +#countcontrols { position: absolute; - left: 20px; - width: 160px; - bottom: 20px; - height: 16px; - overflow: hidden; + top: 4px; + right: 4px; + min-width: 25em; + white-space: nowrap; font-size: 11px; } +#countcontrols a.button, +#countcontrols a.buttonPas +{ + float: right; +} + /** message list styles */ body.messagelist { - margin: 0px; - background-color: #F9F9F9; + margin: 0px; + background-color: #F9F9F9; +} + +#messagelist +{ + width: 100%; + display: table; + table-layout: fixed; +} + +#messagelist thead tr td +{ + height: 20px; + padding: 0 4px 0 2px; + vertical-align: middle; + border-bottom: 1px solid #999999; + color: #333333; + background: url(images/listheader.gif) top left repeat-x #CCC; + font-size: 11px; + font-weight: bold; +} + +#messagelist thead tr td.sortedASC, +#messagelist thead tr td.sortedDESC +{ + background-position: 0 -26px; +} + +#messagelist thead tr td.sortedASC a +{ + background: url(images/icons/sort.gif) right 0 no-repeat; +} + +#messagelist thead tr td.sortedDESC a +{ + background: url(images/icons/sort.gif) right -14px no-repeat; +} + +#messagelist thead tr td a +{ + display: block; + width: auto !important; + width: 100%; + color: #333333; + text-decoration: none; +} + +#messagelist thead tr td.size +{ + text-align: left; +} + +#messagelist thead tr td.subject +{ + padding-left: 18px; +} + +#messagelist tbody tr td +{ + height: 20px; + padding: 0; + font-size: 11px; + overflow: hidden; + vertical-align: middle; + white-space: nowrap; + text-overflow: ellipsis; + -o-text-overflow: ellipsis; + border-bottom: 1px solid #EBEBEB; + cursor: default; +} + +#messagelist tbody tr td a +{ + color: #000; + text-decoration: none; + white-space: nowrap; + cursor: inherit; +} + +#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: 15px; +} + +#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: 17px; + width: 15px; + background: url(images/messageicons.png) center no-repeat; +} + +#messagelist tr td.attachment span.attachment +{ + background-position: 0 -170px; +} + +#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 tr td.flag span.flagged +{ + background-position: 0 -153px; +} + +#messagelist tr td.flag span.unflagged:hover +{ + background-position: 0 -136px; +} + +#messagelist tr td.subject span.msgicon, +#messagelist tr td.subject span.unreadchildren +{ + background-position: 0 -51px; + margin: 0 2px; +} + +#messagelist tr td.subject span.replied +{ + background-position: 0 -85px; +} + +#messagelist tr td.subject span.forwarded +{ + background-position: 0 -68px; +} + +#messagelist tr td.subject span.replied.forwarded +{ + background-position: 0 -102px; } -#messagelist +#messagelist tr td.status span.msgicon, +#messagelist tr td.flag span.unflagged, +#messagelist tr td.status span.unreadchildren { - width: 100%; - display: table; - table-layout: fixed; - /* css hack for IE */ - width: expression(document.getElementById('mailcontframe').clientWidth); + background-position: 0 17px; /* no icon */ } -#messagelist thead tr td +#messagelist tr td.status span.msgicon:hover { - height: 20px; - padding-top: 0px; - padding-bottom: 0px; - padding-left: 2px; - padding-right: 4px; - vertical-align: middle; - border-bottom: 1px solid #999999; - color: #333333; - background-color: #EBEBEB; - background-image: url(images/listheader_aqua.gif); - font-size: 11px; - font-weight: bold; + background-position: 0 -272px; } -#messagelist thead tr td.sortedASC, -#messagelist thead tr td.sortedDESC +#messagelist tr td.status span.deleted, +#messagelist tr td.subject span.deleted { - background-image: url(images/listheader_dark.gif); + background-position: 0 -187px; } -#messagelist thead tr td.sortedASC a +#messagelist tr td.status span.status, +#messagelist tr td.status span.unread, +#messagelist tr td.subject span.unread { - background: url(images/sort_asc.gif) top right no-repeat; + background-position: 0 -119px; } -#messagelist thead tr td.sortedDESC a +#messagelist tr td div.collapsed { - background: url(images/sort_desc.gif) top right no-repeat; + background-position: 0 -221px; + cursor: pointer; } -#messagelist thead tr td a, -#messagelist thead tr td a:hover +#messagelist tr td div.expanded { - display: block; - width: auto !important; - width: 100%; - color: #333333; - text-decoration: none; + background-position: 0 -204px; + cursor: pointer; } -#messagelist tbody tr td +#messagelist tr td.threads div.listmenu { - height: 16px !important; - height: 20px; - padding: 2px; - padding-right: 4px; - font-size: 11px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - border-bottom: 1px solid #EBEBEB; + background-position: 0 -238px; cursor: pointer; } -#messagelist col +#messagelist tbody tr td.subject { - display: table-column; - text-align: left; - vertical-align: middle; + width: 99%; } -#messagelist tr td.icon +#messagelist tbody tr td.subject a { - width: 16px; - vertical-align: middle; + cursor: default; + vertical-align: middle; /* #1487091 */ } -#messagelist tr td.subject +/* thread parent message with unread children */ +#messagelist tbody tr.unroot td.subject a { - overflow: hidden; - vertical-align: middle; + text-decoration: underline; +} + +#messagelist tr td.attachment, +#messagelist tr td.threads, +#messagelist tr td.status, +#messagelist tr td.flag, +#messagelist tr td.priority +{ + width: 17px; + padding: 0 0 0 2px; } #messagelist tr td.size { width: 60px; text-align: right; - vertical-align: middle; + padding: 0 2px; } #messagelist tr td.from, -#messagelist tr td.to +#messagelist tr td.to, +#messagelist tr td.cc, +#messagelist tr td.replyto { width: 180px; - vertical-align: middle; + padding: 0 2px; } #messagelist tr td.date { - width: 110px; - vertical-align: middle; + width: 118px; + padding: 0 2px; } #messagelist tr.message { - background-color: #FFFFFF; -} - -/* -#messagelist tr.odd -{ - background-color: #F9F9F9; + background-color: #FFF; } -*/ #messagelist tr.unread { @@ -454,132 +917,128 @@ body.messagelist background-color: #FFFFFF; } -#messagelist tr.selected td +#messagelist tr.flagged td, +#messagelist tr.flagged td a { - font-weight: bold; - color: #FFFFFF; - background-color: #CC3333; + color: #CC0000; } -#messagelist tr.focused td +#messagelist tr.selected td { - border-bottom: thin dotted; - border-top: thin dotted; + color: #FFFFFF; + background-color: #CC3333; } #messagelist tr.unfocused td { - font-weight: bold; color: #FFFFFF; background-color: #929292; } -#messagelist tr.selected td a.rcmContactAddress +#messagelist tr.selected td a { color: #FFFFFF; } -#messagelist tr.unfocused td a.rcmContactAddress +#messagelist tr.unfocused td a { color: #FFFFFF; } -#messagelist tr.deleted td a.rcmContactAddress -{ - color: #CCCCCC; -} - #messagelist tr.deleted td, #messagelist tr.deleted td a { color: #CCCCCC; } -#quicksearchbar +#listmenu { - position: absolute; - top: 60px; - right: 40px; - width: 182px; - height: 20px; - text-align: right; - background: url('images/searchfield.gif') top left no-repeat; + padding: 6px; } -#quicksearchbar a +#listmenu legend { - position: absolute; - top: 3px; - right: 4px; - text-decoration: none; + color: #999999; } -#quicksearchbar img +#listmenu fieldset { - vertical-align: middle; + border: 1px solid #999999; + margin: 0 5px; + float: left; } -#quicksearchbox +#listmenu div { - position: absolute; - top: 2px; - left: 20px; - width: 140px; - font-size: 11px; - padding: 0px; - border: none; + padding: 8px 0 3px 0; + text-align: center; + clear: both; } +/***** tree indicators *****/ -/*\*/ -html>body*#quicksearchbar { background-image: none; } -html>body*#quicksearchbar a { top: 5px; } -html>body*#quicksearchbar #quicksearchbox { width: 180px; top:0px; right: 1px; left: auto; } -/**/ +td span.branch div +{ + float: left; + height: 16px; +} +td span.branch div.tree +{ + height: 17px; + width: 15px; + background: url(images/tree.gif) 0px 0px no-repeat; +} -#rcversion +td span.branch div.l1 { - position: absolute; - top: 67px; - left: 20px; - width: 160px; - text-align: center; + background-position: 0px 0px; /* L */ +} - font-weight: normal; - font-size: x-small; - font-variant: small-caps; - - color: #999999; - /*border: 1px solid #308014; - background-color: #b4eeb4;*/ +td span.branch div.l2 +{ + background-position: -30px 0px; /* | */ +} + +td span.branch div.l3 +{ + background-position: -15px 0px; /* |- */ } -/** message view styles */ +/** message view styles */ #messageframe { position: absolute; - top: 85px; - left: 200px; - right: 40px; - bottom: 40px; - border: 1px solid #cccccc; - background-color: #FFFFFF; + top: 0; + left: 180px; + right: 0; + bottom: 0; + border: 1px solid #999; + background-color: #FFF; overflow: auto; - /* css hack for IE */ - /* margin-bottom: 10px; */ - width: expression((parseInt(document.documentElement.clientWidth)-240)+'px'); - height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); + z-index: 1; +} + +div.messageheaderbox +{ + margin: -14px 8px 0px 8px; + border: 1px solid #ccc; } table.headers-table { width: 100%; background-color: #EBEBEB; - table-layout: fixed; +} +#messagebody #full-headers, +#messagebody table.headers-table +{ + width: auto; + margin: 6px 8px; + background-color: #F4F4F4; } table.headers-table tr td @@ -588,40 +1047,68 @@ table.headers-table tr td border-bottom:1px solid #FFFFFF; } -table.headers-table td.header-title +table.headers-table tr td.header-title { - width: 80px; + width: 1%; color: #666666; font-weight: bold; text-align: right; white-space: nowrap; - padding-right: 4px; + padding: 0 4px 0 8px; +} + +table.headers-table tr td.header +{ + width: 99%; } table.headers-table tr td.subject { - width: 95%; font-weight: bold; } +table.headers-table tr td.header span +{ + white-space: nowrap; +} + #attachment-list { - margin: 0px; - padding: 0px 0px 0px 68px; - height: 18px; + margin: 0; + padding: 0 4px 0 8px; + min-height: 16px; list-style-image: none; list-style-type: none; - background: url(images/icons/attachment.png) 52px 1px no-repeat #DFDFDF;  - border-bottom: 1px solid #FFFFFF; + background: url(images/icons/attachment.png) 4px 2px no-repeat #DFDFDF; +} + +#messageframe #attachment-list +{ + border-bottom: 1px solid #ccc; +} + +.messageheaderbox #attachment-list +{ + border-top: 1px solid #ccc; +} + +#attachment-list:after +{ + content: "."; + display: block; + height: 0; + font-size: 0; + clear: both; + visibility: hidden; } #attachment-list li { -/* display: block; */ float: left; height: 18px; font-size: 11px; - padding: 2px 10px 0px 10px; + padding: 2px 0px 0px 15px; + white-space: nowrap; } #attachment-list li a @@ -636,113 +1123,212 @@ table.headers-table tr td.subject #messagebody { - min-height: 300px; - padding-top: 10px; + position:relative; padding-bottom: 10px; background-color: #FFFFFF; } -div.message-part +div.message-part, +div.message-htmlpart { - padding: 8px; - padding-top: 10px; - overflow: hidden; + padding: 10px 8px; + border-top: 1px solid #ccc; +/* overflow: hidden; */ +} + +#messagebody div:first-child +{ + border-top: 0; } -div.message-part a +div.message-part a, +div.message-htmlpart a { color: #0000CC; } -div.message-part pre +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; +} -#remote-objects-message +div.message-part blockquote { - display: none; - height: 20px; + 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; +} + +body.iframe div.message-htmlpart +{ + margin: 8px; +} + +div.message-htmlpart div.rcmBody +{ + margin: 8px; +} + +#message-objects div +{ + margin: 8px; min-height: 20px; - margin: 8px 8px 0px 8px; - padding: 10px 10px 6px 46px; + padding: 10px 10px 6px 46px; } -#remote-objects-message a +#message-objects div a { color: #666666; padding-left: 10px; } -#remote-objects-message a:hover +#message-objects div a:hover { color: #333333; } +#messageviewlink +{ + position: absolute; + top: 8px; + right: 10px; + width: 15px; + height: 15px; + border: 0; +} + +#full-headers +{ + color: #666666; + text-align: center; + padding: 2px 6px; + border-bottom: 1px solid #ccc; + background-color: #EBEBEB; +} -/** message compose styles */ +.messageheaderbox #full-headers +{ + border-bottom: 0; +} -#priority-selector +div.more-headers { - position: absolute; - left: 280px; - top: 10px; + cursor: pointer; + height: 8px; + border-bottom: 0; } -#receipt-selector +div.show-headers { - position: absolute; - left: 450px; - top: 10px; + background: url(images/icons/down_small.gif) no-repeat center; +} + +div.hide-headers +{ + background: url(images/icons/up_small.gif) no-repeat center; +} + +#headers-source +{ + margin: 0 0 2px 0; + padding: 0.5em; + height: 145px; + background: white; + overflow: auto; + font-size: 11px; + border: 1px solid #999999; + display: none; + text-align: left; + color: #333; } + +/** message compose styles */ + #compose-container { position: absolute; - top: 90px; - left: 200px; - right: 40px; - bottom: 40px; - padding: 0px; - margin: 0px; - /* css hack for IE */ - width: expression(document.documentElement.clientWidth-240); - height: expression((parseInt(document.documentElement.clientHeight)-130)+'px'); + top: 0; + left: 185px; + right: 0; + bottom: 0; + margin: 0; } -/* -#compose-headers +#compose-div { position: absolute; - top: 70px; - left: 200px; - height: 84px; - border-top: 1px solid #cccccc; - overflow: auto; + top: 85px; + bottom: 0; + margin: 0; + width: 100%; +} + +#compose-div .boxfooter +{ + height: 22px; + background: none; + border-top: 0; +} + +#compose-div .boxlistcontent +{ + bottom: 23px; } -#compose-headers td +#compose-body { - padding-top: 1px; - padding-bottom: 1px; - border-right: 1px solid #cccccc; - border-bottom: 1px solid #cccccc; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + margin: 0; + font-size: 9pt; + font-family: monospace; + border: 1px solid #999; + resize: none; } -*/ #compose-headers { width: 100%; } -/* -#compose-headers td +#compose-headers td.editfield { - width: 100%; + padding-right: 8px; + width: 95%; } -*/ #compose-headers td.top { @@ -753,70 +1339,78 @@ div.message-part pre #compose-subject td.title { width: 80px !important; - color: #666666; font-size: 11px; font-weight: bold; padding-right: 10px; white-space: nowrap; + color: #666; } -#compose-headers td.add-button -{ - width: 40px !important; - text-align: right; - vertical-align: bottom; -} - -#compose-headers td.add-button a +#compose-headers td textarea, +#compose-headers td input { - color: #666666; - font-size: 11px; - text-decoration: none; + resize: none; + width: 100%; + border: 1px solid #999; } #compose-headers td textarea { - width: 100%; - height: 40px; + height: 32px; } -#compose-headers td input +input.from_address { - width: 100%; + width: 80% !important; } #compose-cc, #compose-bcc, -#compose-replyto +#compose-replyto, +#compose-followupto { display: none; } -#compose-body +#compose-editorfooter { - margin-top: 5px; - margin-bottom: 10px; - width: 99%; - height: 90%; - min-height: 280px; - font-size: 9pt; - font-family: "Courier New", Courier, monospace; + position: absolute; + right: 0; + bottom: 0; + text-align: right; +} + +#compose-editorfooter label +{ + font-size: 11px; + font-weight: bold; + color: #666; +} + +#compose-buttons +{ + position: absolute; + left: 0; + bottom: 0; + width: auto; } #compose-attachments { position: absolute; - top: 100px; - left: 20px; - width: 160px; + top: 0; + left: 0; + bottom: 0; + width: 175px; + border: 1px solid #999; + background-color: #F9F9F9; } #compose-attachments ul { margin: 0px; padding: 0px; - border: 1px solid #CCCCCC; - background-color: #F9F9F9; + background-color: #FFF; list-style-image: none; list-style-type: none; } @@ -831,33 +1425,43 @@ div.message-part pre border-bottom: 1px solid #EBEBEB; white-space: nowrap; overflow: hidden; + text-overflow: ellipsis; + -o-text-overflow: ellipsis; } -#attachment-title +#compose-attachments ul li img { - background: url(images/icons/attachment.png) top left no-repeat; - padding: 0px 0px 3px 22px; + padding-right: 2px; + vertical-align: middle; } #attachment-form { - position: absolute; - top: 150px; - left: 20px; - z-index: 200; - padding: 8px; - visibility: hidden; - border: 1px solid #CCCCCC; - background-color: #F9F9F9; + padding: 6px; } -#attachment-form input.button +#attachment-form div { - margin-top: 8px; + padding: 2px; } -#rcmquotadisplay +#attachment-form div.buttons { - color: #999999; - font-size: 11px; + margin-top: 4px; +} + +#quota +{ + position: absolute; + top: 3px; + right: 8px; + width: 100px; +} + +#quotaimg +{ + position: absolute; + top: 3px; + right: 6px; + z-index: 101; }