From a3f149eb5729ef1ba6d1c05b29fead1058f4c888 Mon Sep 17 00:00:00 2001 From: thomascube <thomas@roundcube.net> Date: Fri, 19 Sep 2008 13:01:57 -0400 Subject: [PATCH] Fix search box on Safari and make pages validate --- skins/default/mail.css | 274 +++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 226 insertions(+), 48 deletions(-) diff --git a/skins/default/mail.css b/skins/default/mail.css index d268e7f..ec78cd7 100644 --- a/skins/default/mail.css +++ b/skins/default/mail.css @@ -52,6 +52,7 @@ border: 1px solid #CCC; padding: 1px; opacity: 0.9; + filter:alpha(opacity=90); z-index: 240; } @@ -146,6 +147,30 @@ color: #333333; } +#mainscreen +{ + position: absolute; + top: 85px; + right: 20px; + bottom: 40px; + left: 20px; + /* css hack for IE */ + width: expression((parseInt(document.documentElement.clientWidth)-40)+'px'); + height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); +} + +#mailrightcontainer +{ + position: absolute; + top: 0px; + left: 170px; + bottom: 0px; + right: 0px; + /* css hack for IE */ + width: expression((parseInt(this.parentNode.offsetWidth)-170)+'px'); + height: expression(parseInt(this.parentNode.offsetHeight)+'px'); +} + #messagepartcontainer { position: absolute; @@ -161,42 +186,37 @@ #mailcontframe { position: absolute; - top: 85px; - left: 200px; - right: 20px; - bottom: 40px; + width: 100%; + top: 0px; + bottom: 0px; border: 1px solid #999999; background-color: #F9F9F9; overflow: auto; /* css hack for IE */ - width: expression((parseInt(document.documentElement.clientWidth)-220)+'px'); - height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); + height: expression(parseInt(this.parentNode.offsetHeight)+'px'); } #mailpreviewframe { position: absolute; - top: 305px; - left: 200px; - right: 20px; - bottom: 40px; + width: 100%; + top: 205px; + bottom: 0px; border: 1px solid #999999; background-color: #F9F9F9; /* css hack for IE */ - width: expression((parseInt(document.documentElement.clientWidth)-220)+'px'); - height: expression((parseInt(document.documentElement.clientHeight)-135-document.getElementById('mailcontframe').offsetHeight)+'px'); + height: expression((parseInt(this.parentNode.offsetHeight)-205)+'px'); } #messagecontframe { - position: absolute; + position: relative; top: 0px; left: 0px; right: 0px; bottom: 0px; - /* css hack for IE */ - width: expression((parseInt(document.documentElement.clientWidth)-220)+'px'); - height: expression((parseInt(document.documentElement.clientHeight)-135-document.getElementById('mailcontframe').offsetHeight)+'px'); + width: 100%; + height: 100%; } #messagepartframe @@ -213,7 +233,10 @@ position: absolute; top: 10px; left: 220px; + right: 20px; height: 40px; + /* css hack for IE */ + width: expression((parseInt(document.documentElement.clientWidth)-240)+'px'); } #partheader table td @@ -250,19 +273,20 @@ #mailboxlist-container { position: absolute; - top: 85px; - left: 20px; - width: 170px; - bottom: 40px; + top: 0px; + left: 0px; + width: 160px; + bottom: 0px; border: 1px solid #999; background-color: #F9F9F9; overflow: auto; /* css hack for IE */ - height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); + height: expression(parseInt(this.parentNode.offsetHeight)+'px'); } #mailboxlist { + position:relative; width: 100%; height: auto; margin: 0px; @@ -275,10 +299,38 @@ #mailboxlist li { + display: block; + position: relative; font-size: 11px; background: url(images/icons/folder-closed.png) no-repeat; - background-position: 10px 1px; + background-position: 5px 1px; border-bottom: 1px solid #EBEBEB; +} + +#mailboxlist li div +{ + position: absolute; + left: 8px !important; + left: -16px; + top: 2px; + 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 @@ -308,8 +360,10 @@ #mailboxlist li a { + cursor: default; display: block; - padding-left: 32px; + position: relative; + padding-left: 25px; padding-top: 2px; padding-bottom: 2px; text-decoration: none; @@ -318,6 +372,11 @@ #mailboxlist li.unread { font-weight: bold; +} + +#mailboxlist li.virtual > a +{ + color: #666; } #mailboxlist li.selected, @@ -356,7 +415,7 @@ { position: absolute; left: 20px; - width: 170px; + width: 185px; bottom: 20px; height: 16px; overflow: hidden; @@ -382,7 +441,8 @@ } /* safari hack \*/ -html>body*#messagelist[id$="messagelist"]:not([class="none"]) { table-layout: auto; } +html>body*#messagelist[id$="messagelist"]:not([class="none"]) { width: 99%; } +html>body*input[type$="file"]:not([class="none"]) { background-color: transparent; border:0; } /**/ #messagelist thead tr td @@ -436,7 +496,7 @@ white-space: nowrap; text-overflow: ellipsis; border-bottom: 1px solid #EBEBEB; - cursor: pointer; + cursor: default; } #messagelist tbody tr td a @@ -444,6 +504,12 @@ color: #000; text-decoration: none; white-space: nowrap; + cursor: inherit; +} + +#messagelist tbody tr td.subject a +{ + cursor: default; } #messagelist col @@ -453,10 +519,12 @@ vertical-align: middle; } -#messagelist tr td.icon +#messagelist tr td.icon, +#messagelist tr td.flag { width: 16px; vertical-align: middle; + cursor: pointer; } #messagelist tr td.subject @@ -557,21 +625,36 @@ #messageframe { position: absolute; - top: 85px; - left: 200px; - right: 20px; - bottom: 40px; + top: 0px; + left: 170px; + right: 0px; + bottom: 0px; border: 1px solid #999; background-color: #FFF; overflow: auto; /* css hack for IE */ - /* margin-bottom: 10px; */ + width: expression((parseInt(document.documentElement.clientWidth)-220)+'px'); + height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); +} + +#printmessageframe +{ + position: absolute; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; + border: 1px solid #999; + background-color: #FFF; + overflow: auto; + /* css hack for IE */ width: expression((parseInt(document.documentElement.clientWidth)-220)+'px'); height: expression((parseInt(document.documentElement.clientHeight)-125)+'px'); } div.messageheaderbox { + position: relative; margin: 6px 8px 0px 8px; border: 1px solid #ccc; } @@ -589,6 +672,11 @@ margin: 6px 8px; background-color: #F4F4F4; border: 1px solid #ccc; +} + +#messageframe table.headers-table +{ + border-bottom: 1px solid #ccc; } table.headers-table tr td @@ -609,20 +697,30 @@ table.headers-table tr td.subject { - width: 95%; + width: 90%; font-weight: bold; +} + +table.headers-table tr td.all +{ + width: 100%; + color: #666666; + text-align: left; + padding-right: 10px; + vertical-align: center; + text-align: center; } #attachment-list { margin: 0px; - padding: 0px 0px 0px 68px; - min-height: 18px; + padding: 0px 0px 0px 72px; + min-height: 16px; list-style-image: none; list-style-type: none; - background: url(images/icons/attachment.png) 52px 1px no-repeat #DFDFDF; - /* css hack for IE */ - height: expression(Math.min(18, parseInt(document.documentElement.clientHeight))+'px'); + background: url(images/icons/attachment.png) 60px 2px no-repeat #DFDFDF; + /* IE6 hack */ + _height: expression(Math.min(16, parseInt(document.documentElement.clientHeight))+'px'); } #attachment-list:after @@ -640,7 +738,8 @@ float: left; height: 18px; font-size: 11px; - padding: 2px 10px 0px 10px; + padding: 2px 0px 0px 15px; + white-space: nowrap; } #attachment-list li a @@ -656,7 +755,6 @@ #messagebody { position:relative; - min-height: 300px; padding-bottom: 10px; background-color: #FFFFFF; } @@ -673,7 +771,8 @@ border-top: 0; } -div.message-part a +div.message-part a, +div.message-htmlpart a { color: #0000CC; } @@ -682,9 +781,10 @@ { margin: 0px; padding: 0px; + font-family: monospace; white-space: -moz-pre-wrap !important; white-space: pre; - font-family: monospace; + word-wrap: break-word; /* IE (and Safari) */ } div.message-part blockquote @@ -711,13 +811,22 @@ border-right: 2px solid #bb0000; } +body.iframe div.message-htmlpart +{ + margin: 8px; +} + +div.message-htmlpart div.rcmBody +{ + margin: 8px; +} + #remote-objects-message { display: none; - height: 20px; + margin: 8px; min-height: 20px; - margin: 8px 8px 0px 8px; - padding: 10px 10px 6px 46px; + padding: 10px 10px 6px 46px; } #remote-objects-message a @@ -731,13 +840,28 @@ color: #333333; } +#messageviewlink +{ + position: absolute; + top: 1px; + right: 1px; + width: 15px; + height: 15px; + border: 0; +} /** message compose styles */ + +#compose-toolbar +{ + white-space: nowrap; +} #priority-selector, #receipt-selector { padding-left: 30px; + white-space: nowrap; } #compose-container @@ -874,14 +998,68 @@ top: 150px; left: 20px; z-index: 200; - padding: 8px; + padding: 6px; visibility: hidden; border: 1px solid #CCCCCC; background-color: #F9F9F9; } -#attachment-form input.button +#attachment-form div { - margin-top: 8px; + padding: 2px; } +#attachment-form div.buttons +{ + margin-top: 4px; +} + +table.headers-table tr td.more-headers +{ + cursor: pointer; + width: 100%; + height: 8px; + border-bottom: 0; +} + +table.headers-table tr td.all +{ + padding: 2px 6px 4px 6px; + border-bottom: 0; +} + +td.show-headers +{ + background: url(images/icons/down_small.gif) no-repeat center; +} + +td.hide-headers +{ + background: url(images/icons/up_small.gif) no-repeat center; +} + +#all-headers +{ + height: 150px; + display: none; +} + +#headers-source +{ + margin: 0 5px; + padding: 0.5em; + height: 145px; + background: white; + overflow: auto; + font-size: 11px; + white-space: nowrap; + border: 1px solid #999999; + display: none; + text-align: left; + color: #333; +} + +font.bold +{ + font-weight: bold; +} -- Gitblit v1.9.1