diff options
-rw-r--r-- | skins/larry/ie7hacks.css | 5 | ||||
-rw-r--r-- | skins/larry/mail.css | 59 | ||||
-rw-r--r-- | skins/larry/templates/message.html | 11 | ||||
-rw-r--r-- | skins/larry/templates/messageerror.html | 22 | ||||
-rw-r--r-- | skins/larry/templates/messagepreview.html | 6 | ||||
-rw-r--r-- | skins/larry/ui.js | 3 |
6 files changed, 71 insertions, 35 deletions
diff --git a/skins/larry/ie7hacks.css b/skins/larry/ie7hacks.css index 024c35bb2..f15a615ef 100644 --- a/skins/larry/ie7hacks.css +++ b/skins/larry/ie7hacks.css @@ -72,6 +72,11 @@ a.deletebutton, height: 14px; } +#mailview-right #messageheader h2.subject { + position: relative; + left: -56px; +} + #uploadform a.iconlink { text-indent: 0px; } diff --git a/skins/larry/mail.css b/skins/larry/mail.css index 0ee43aef1..3fd2fcc65 100644 --- a/skins/larry/mail.css +++ b/skins/larry/mail.css @@ -30,6 +30,11 @@ z-index: 3; } +#mailview-right.offset { + top: 42px; + margin-top: 0; +} + #mailview-top { position: absolute; top: 42px; @@ -675,12 +680,11 @@ a.iconbutton.threadmode.selected { #messagecontent { position: absolute; - top: 140px; + top: 110px; left: 0; width: 100%; - bottom: 0; + bottom: 27px; overflow: auto; - border-radius: 4px 4px 0 0; } #messageheader, @@ -696,6 +700,12 @@ a.iconbutton.threadmode.selected { background: linear-gradient(top, #fff 0%, #e9e9e9 100%); } +#mailview-right #messageheader { + border-radius: 4px 4px 0 0; + padding-left: 58px; + border-bottom: 2px solid #e6e6e6; +} + h2.subject { font-size: 15px; margin: 0 15em 0 0; @@ -705,6 +715,10 @@ h2.subject { text-overflow: ellipsis; } +#mailview-right #messageheader h2.subject { + margin-left: -56px; +} + h3.subject { font-size: 14px; margin: 0 8em 0 0; @@ -723,6 +737,10 @@ h3.subject { font-weight: bold; } +.headers-table td.header-title { + white-space: nowrap; +} + .headers-table td.header a { color: #666; text-decoration: none; @@ -782,6 +800,7 @@ h3.subject { background: -ms-linear-gradient(left, #fbfbfb 0, #e9e9e9 100%); background: linear-gradient(left, #fbfbfb 0, #e9e9e9 100%); border-right: 1px solid #dfdfdf; + border-radius: 3px 0 0 0; /* for Opera */ } #previewheaderstoggle .iconlink { @@ -800,9 +819,17 @@ h3.subject { background-position: -5px -242px; } +#full-headers { + position: relative; +} + div.more-headers { - cursor: pointer; + position: absolute; + top: -12px; + right: 10px; + width: 12px; height: 10px; + cursor: pointer; background: url(images/buttons.png) center -1619px no-repeat; } @@ -812,12 +839,16 @@ div.hide-headers { #all-headers { position: relative; - margin: 0 10px; + margin: 4px 10px; padding: 0; height: 180px; - border: 1px solid #bbb; + border: 1px solid #ccc; border-radius: 4px; - background: #fff; + background: #fdfdfd; + -moz-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1); + -webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1); + -o-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1); + box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1); } #headers-source { @@ -827,18 +858,22 @@ div.hide-headers { left: 0; right: 0; bottom: 0; - padding: 2px 5px; + padding: 3px 6px; overflow: auto; text-align: left; color: #333; } +#messagepreviewheader #all-headers { + margin-left: 0; +} + #messagepreviewheader { position: relative; height: auto; min-height: 52px; margin: 0 8px 0 0; - padding: 0 0 6px 72px; + padding: 0 0 0px 72px; border-bottom: 2px solid #f0f0f0; } @@ -867,12 +902,13 @@ div.hide-headers { #messageheader #contactphoto { display: block; position: absolute; - top: 40px; - right: 10px; + top: 34px; + left: 10px; width: 48px; height: 48px; overflow: hidden; border-radius: 4px; + background: url(images/contactpic_48px.png) center center no-repeat #fff; } #messageheader #contactphoto img { @@ -903,6 +939,7 @@ div.hide-headers { overflow-x: auto; } +#messagecontent .rightcol, #messagepreview .rightcol { float: right; /* diff --git a/skins/larry/templates/message.html b/skins/larry/templates/message.html index 1becd711a..50ac84473 100644 --- a/skins/larry/templates/message.html +++ b/skins/larry/templates/message.html @@ -31,10 +31,9 @@ </div> -<div id="mailview-right"> +<div id="mailview-right" class="offset uibox"> -<div id="mailview-top"> -<div id="messageheader" class="uibox"> +<div id="messageheader"> <h2 class="subject"><roundcube:object name="messageHeaders" valueOf="subject" /></h2> <roundcube:object name="messageHeaders" class="headers-table" addicon="/images/addcontact.png" exclude="subject" /> <roundcube:object name="messageFullHeaders" id="full-headers" /> @@ -49,7 +48,7 @@ <div id="contactphoto"><roundcube:object name="contactphoto" /></div> </div> -<div id="messagecontent" class="uibox"> +<div id="messagecontent"> <div class="rightcol"> <roundcube:object name="messageAttachments" id="attachment-list" class="attachmentslist" /> </div> @@ -59,11 +58,7 @@ </div> </div> -</div><!-- end mailview-top --> - -<div id="mailview-bottom" class="uibox"> <roundcube:object name="message" id="message" class="statusbar" /> -</div> </div><!-- end mailview-right --> diff --git a/skins/larry/templates/messageerror.html b/skins/larry/templates/messageerror.html index 70181f174..3c3c9acdb 100644 --- a/skins/larry/templates/messageerror.html +++ b/skins/larry/templates/messageerror.html @@ -16,6 +16,13 @@ <div id="mainscreen"> +<!-- toolbar --> +<div id="messagetoolbar" class="fullwidth"> + <div id="mailtoolbar" class="toolbar"> + <roundcube:button command="list" type="link" class="button back disabled" classAct="button back" classSel="button back pressed" label="back" /> + </div> +</div> + <div id="mailview-left"> <!-- folders list --> @@ -27,20 +34,11 @@ </div> -<div id="mailview-right"> +<div id="mailview-right" class="offset uibox"> -<!-- toolbar --> -<div id="messagetoolbar" class="fullwidth"> - <div id="mailtoolbar" class="toolbar"> - <roundcube:button command="list" type="link" class="button back disabled" classAct="button back" classSel="button back pressed" label="back" /> - </div> -</div> - -<div id="mailview-top" class="uibox watermark"></div> +<div id="messagecontent" class="watermark"></div> -<div id="mailview-bottom" class="uibox"> - <roundcube:object name="message" id="message" class="statusbar" /> -</div> +<roundcube:object name="message" id="message" class="statusbar" /> </div><!-- end mailview-right --> diff --git a/skins/larry/templates/messagepreview.html b/skins/larry/templates/messagepreview.html index b53683ec1..792c1bd63 100644 --- a/skins/larry/templates/messagepreview.html +++ b/skins/larry/templates/messagepreview.html @@ -15,17 +15,19 @@ <table class="headers-table" id="preview-shortheaders"><tbody><tr> <roundcube:if condition="env:mailbox == config:drafts_mbox || env:mailbox == config:sent_mbox"> <td class="header-title"><roundcube:label name="to" /></td> - <td class="header from"><roundcube:object name="messageHeaders" valueOf="to" addicon="/images/addcontact.png" /></td> + <td class="header from"><roundcube:object name="messageHeaders" valueOf="to" max="3" addicon="/images/addcontact.png" /></td> <roundcube:else /> <td class="header-title"><roundcube:label name="from" /></td> <td class="header from"><roundcube:object name="messageHeaders" valueOf="from" addicon="/images/addcontact.png" /></td> <roundcube:endif /> <td class="header-title"><roundcube:label name="date" /></td> - <td class="header from"><roundcube:object name="messageHeaders" valueOf="date" /></td> + <td class="header date"><span><roundcube:object name="messageHeaders" valueOf="date" /></span></td> </tr></tbody></table> <roundcube:object name="messageHeaders" id="preview-allheaders" class="headers-table" addicon="/images/addcontact.png" exclude="subject,replyto" /> +<roundcube:object name="messageFullHeaders" id="full-headers" /> + <!-- record navigation --> <div id="countcontrols" class="pagenav"> <roundcube:if condition="env:mailbox != config:drafts_mbox"> diff --git a/skins/larry/ui.js b/skins/larry/ui.js index c01a17cd2..9b5d8309c 100644 --- a/skins/larry/ui.js +++ b/skins/larry/ui.js @@ -73,7 +73,6 @@ function rcube_mail_ui() } if (rcmail.env.action == 'show' || rcmail.env.action == 'preview') { - layout_messageview(); rcmail.addEventListener('aftershow-headers', function() { layout_messageview(); }); rcmail.addEventListener('afterhide-headers', function() { layout_messageview(); }); $('#previewheaderstoggle').click(function(e){ toggle_preview_headers(this); return false }); @@ -321,7 +320,7 @@ function rcube_mail_ui() */ function layout_messageview() { - $('#messagecontent').css('top', ($('#messageheader').outerHeight() + 10) + 'px'); + $('#messagecontent').css('top', ($('#messageheader').outerHeight() + 1) + 'px'); $('#message-objects div a').addClass('button'); if (!$('#attachment-list li').length) { |