summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authoralecpl <alec@alec.pl>2012-02-27 10:00:00 +0000
committeralecpl <alec@alec.pl>2012-02-27 10:00:00 +0000
commit9bd97cc7073dc381569d5a2563b1b93497ba36e1 (patch)
tree9d96d53d9c220980ac4d8a72ba81f4604fdfc6bf
parent2c1937220e6e0eab0e527e6ebeec716a846afd70 (diff)
- Improve headers toggle button
-rw-r--r--skins/larry/mail.css20
-rw-r--r--skins/larry/templates/messagepreview.html3
-rw-r--r--skins/larry/ui.js17
3 files changed, 21 insertions, 19 deletions
diff --git a/skins/larry/mail.css b/skins/larry/mail.css
index a396d89b8..4e3cb9c3e 100644
--- a/skins/larry/mail.css
+++ b/skins/larry/mail.css
@@ -699,17 +699,21 @@ h3.subject {
padding-right: 12px;
}
-#messagepreviewheader .iconlink {
- text-indent: -1000px;
- padding: 1px 1px 1px 20px;
+#previewheaderstoggle {
+ width: 16px;
+ height: 16px;
+ padding: 0;
+ margin-top: 5px;
+ position: absolute;
+ outline: none;
}
-#messagepreviewheader .iconlink.add {
- background-position: -5px -359px;
+#previewheaderstoggle.iconlink.add {
+ background-position: -30px -241px;
}
-#messagepreviewheader .iconlink.delete {
- background-position: -5px -339px;
+#previewheaderstoggle.iconlink.remove {
+ background-position: -8px -241px;
}
#full-headers {
@@ -779,7 +783,7 @@ div.hide-headers {
}
#messagepreviewheader .headers-table {
- margin: 0 -8px;
+ margin-left: 10px;
}
#messagepreviewheader h3.subject {
diff --git a/skins/larry/templates/messagepreview.html b/skins/larry/templates/messagepreview.html
index 1a23a951b..a8040841f 100644
--- a/skins/larry/templates/messagepreview.html
+++ b/skins/larry/templates/messagepreview.html
@@ -9,6 +9,8 @@
<div id="messagepreviewheader">
<h3 class="subject"><roundcube:object name="messageHeaders" valueOf="subject" /></h3>
+<a href="#details" id="previewheaderstoggle" class="iconlink add"></a>
+
<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>
@@ -19,7 +21,6 @@
<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"><a href="#details" id="previewheaderstoggle" class="iconlink add">Details</a>
</tr></tbody></table>
<roundcube:object name="messageHeaders" id="preview-allheaders" class="headers-table" addicon="/images/addcontact.png" exclude="subject,replyto" />
diff --git a/skins/larry/ui.js b/skins/larry/ui.js
index 979ed05c7..aed41bb21 100644
--- a/skins/larry/ui.js
+++ b/skins/larry/ui.js
@@ -462,17 +462,14 @@ function rcube_mail_ui()
function toggle_preview_headers(button)
{
$('#preview-shortheaders').toggle();
- var full = $('#preview-allheaders').toggle();
-
+ var full = $('#preview-allheaders').toggle(),
+ button = $('a#previewheaderstoggle');
+
// add toggle button to full headers table
- if (!full.data('mod')) {
- $('<a>').attr('href', '#hide')
- .addClass('iconlink remove')
- .html('Hide')
- .appendTo($('<td>').appendTo($('tr:first', full)))
- .click(function(){ toggle_preview_headers(this);return false });
- full.data('mod', true);
- }
+ if (full.is(':visible'))
+ button.attr('href', '#hide').removeClass('add').addClass('remove')
+ else
+ button.attr('href', '#details').removeClass('remove').addClass('add')
}