Replacement for commit af276f21e536: - add a more discrete toggle for all h...

Thomas Bruederli

2012-10-01 dd525814ca2725e9b11692551d01a5bdf7931b04

Replacement for commit af276f21e536:
- add a more discrete toggle for all headers to message preview
- fix message display page issues (#1488590, #1488642)

 skins/larry/ie7hacks.css

@@ -72,6 +72,11 @@
    height: 14px;
}

#mailview-right #messageheader h2.subject {
    position: relative;
    left: -56px;
}

#uploadform a.iconlink {
    text-indent: 0px;
}

 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 @@

#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 @@
    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;
@@ -703,6 +713,10 @@
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#mailview-right #messageheader h2.subject {
    margin-left: -56px;
}

h3.subject {
@@ -721,6 +735,10 @@

.headers-table td.header {
    font-weight: bold;
}

.headers-table td.header-title {
    white-space: nowrap;
}

.headers-table td.header a {
@@ -782,6 +800,7 @@
    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 @@
    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 @@

#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,10 +858,14 @@
    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 {
@@ -838,7 +873,7 @@
    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 @@
#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 @@
    overflow-x: auto;
}

#messagecontent .rightcol,
#messagepreview .rightcol {
    float: right;
/*

 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 -->


 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="messagecontent" class="watermark"></div>

<div id="mailview-top" class="uibox watermark"></div>

<div id="mailview-bottom" class="uibox">
    <roundcube:object name="message" id="message" class="statusbar" />
</div>

</div><!-- end mailview-right -->


 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">

 skins/larry/ui.js

@@ -73,7 +73,6 @@
      }

      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 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) {