summaryrefslogtreecommitdiff
path: root/skins
diff options
context:
space:
mode:
Diffstat (limited to 'skins')
-rw-r--r--skins/default/common.css10
-rw-r--r--skins/default/functions.js87
-rw-r--r--skins/default/ie6hacks.css13
-rw-r--r--skins/default/iehacks.css24
-rw-r--r--skins/default/images/icons/columnpicker.gifbin0 -> 133 bytes
-rw-r--r--skins/default/images/icons/unread_children.pngbin0 -> 441 bytes
-rw-r--r--skins/default/images/mail_footer.pngbin1143 -> 1186 bytes
-rw-r--r--skins/default/images/messageactions.gifbin1112 -> 1268 bytes
-rw-r--r--skins/default/images/messageactions.pngbin1637 -> 2079 bytes
-rw-r--r--skins/default/includes/messagemenu.html2
-rw-r--r--skins/default/mail.css158
-rw-r--r--skins/default/templates/mail.html59
12 files changed, 310 insertions, 43 deletions
diff --git a/skins/default/common.css b/skins/default/common.css
index 8ec5b59ef..44bb4f5b9 100644
--- a/skins/default/common.css
+++ b/skins/default/common.css
@@ -537,7 +537,7 @@ a.rcmContactAddress:hover
ul.toolbarmenu
{
- margin: 0;
+ margin: -4px 0 -4px 0;
padding: 0;
list-style: none;
}
@@ -547,13 +547,14 @@ ul.toolbarmenu li
font-size: 11px;
white-space: nowrap;
min-width: 130px;
+ margin: 3px -4px;
}
ul.toolbarmenu li a
{
display: block;
color: #a0a0a0;
- padding: 2px 8px 3px 22px;
+ padding: 2px 12px 3px 28px;
text-decoration: none;
min-height: 14px;
}
@@ -597,3 +598,8 @@ ul.toolbarmenu li.separator_above
margin-top: 2px;
padding-top: 2px;
}
+
+.disabled
+{
+ color: #999;
+}
diff --git a/skins/default/functions.js b/skins/default/functions.js
index 47a121db1..4ee2a9d3e 100644
--- a/skins/default/functions.js
+++ b/skins/default/functions.js
@@ -124,6 +124,7 @@ function rcube_mail_ui()
this.markmenu = $('#markmessagemenu');
this.searchmenu = $('#searchmenu');
this.messagemenu = $('#messagemenu');
+ this.listmenu = $('#listmenu');
}
rcube_mail_ui.prototype = {
@@ -186,15 +187,89 @@ set_searchmod: function(elem)
rcmail.env.search_mods[rcmail.env.mailbox][elem.value] = elem.value;
},
+show_listmenu: function(show)
+{
+ if (typeof show == 'undefined')
+ show = this.listmenu.is(':visible') ? false : true;
+
+ var ref = rcube_find_object('listmenulink');
+ if (show && ref) {
+ var pos = $(ref).offset();
+ this.listmenu.css({ left:pos.left, top:(pos.top + ref.offsetHeight + 2)});
+ // set form values
+ $('input[name="sort_col"][value="'+rcmail.env.sort_col+'"]').attr('checked', 1);
+ $('input[name="sort_ord"][value="DESC"]').attr('checked', rcmail.env.sort_order=='DESC' ? 1 : 0);
+ $('input[name="sort_ord"][value="ASC"]').attr('checked', rcmail.env.sort_order=='DESC' ? 0 : 1);
+ $('input[name="view"][value="thread"]').attr('checked', rcmail.env.threading ? 1 : 0);
+ $('input[name="view"][value="list"]').attr('checked', rcmail.env.threading ? 0 : 1);
+ // list columns
+ var cols = $('input[name="list_col[]"]');
+ for (var i=0; i<cols.length; i++) {
+ var found = 0;
+ if (cols[i].value != 'from')
+ found = jQuery.inArray(cols[i].value, rcmail.env.coltypes) != -1;
+ else
+ found = (jQuery.inArray('from', rcmail.env.coltypes) != -1
+ || jQuery.inArray('to', rcmail.env.coltypes) != -1);
+ $(cols[i]).attr('checked',found ? 1 : 0);
+ }
+ }
+
+ this.listmenu[show?'show':'hide']();
+
+ if (show) {
+ var maxheight=0;
+ $('#listmenu fieldset').each(function() {
+ var height = $(this).height();
+ if (height > maxheight) {
+ maxheight = height;
+ }
+ });
+ $('#listmenu fieldset').css("min-height", maxheight+"px")
+ // IE6 complains if you set this attribute using either method:
+ //$('#listmenu fieldset').css({'height':'auto !important'});
+ //$('#listmenu fieldset').css("height","auto !important");
+ .height(maxheight);
+ };
+},
+
+open_listmenu: function(e)
+{
+ this.show_listmenu();
+},
+
+save_listmenu: function()
+{
+ this.show_listmenu();
+
+ var sort = $('input[name="sort_col"]:checked').val();
+ var ord = $('input[name="sort_ord"]:checked').val();
+ var thread = $('input[name="view"]:checked').val();
+ var cols = $('input[name="list_col[]"]:checked')
+ .map(function(){ return this.value; }).get();
+
+ rcmail.set_list_options(cols, sort, ord, thread == 'thread' ? 1 : 0);
+},
+
body_mouseup: function(evt, p)
{
- if (this.markmenu && this.markmenu.is(':visible') && rcube_event.get_target(evt) != rcube_find_object('markreadbutton'))
+ var target = rcube_event.get_target(evt);
+
+ if (this.markmenu && this.markmenu.is(':visible') && target != rcube_find_object('markreadbutton'))
this.show_markmenu(false);
- else if (this.messagemenu && this.messagemenu.is(':visible') && rcube_event.get_target(evt) != rcube_find_object('messagemenulink'))
+ else if (this.messagemenu && this.messagemenu.is(':visible') && target != rcube_find_object('messagemenulink'))
this.show_messagemenu(false);
- else if (this.searchmenu && this.searchmenu.is(':visible') && rcube_event.get_target(evt) != rcube_find_object('searchmod')) {
+ else if (this.listmenu && this.listmenu.is(':visible') && target != rcube_find_object('listmenulink')) {
+ var menu = rcube_find_object('listmenu');
+ while (target.parentNode) {
+ if (target.parentNode == menu)
+ return;
+ target = target.parentNode;
+ }
+ this.show_listmenu(false);
+ }
+ else if (this.searchmenu && this.searchmenu.is(':visible') && target != rcube_find_object('searchmod')) {
var menu = rcube_find_object('searchmenu');
- var target = rcube_event.get_target(evt);
while (target.parentNode) {
if (target.parentNode == menu)
return;
@@ -213,6 +288,8 @@ body_keypress: function(evt, p)
this.show_searchmenu(false);
if (this.messagemenu && this.messagemenu.is(':visible'))
this.show_messagemenu(false);
+ if (this.listmenu && this.listmenu.is(':visible'))
+ this.show_listmenu(false);
}
}
@@ -225,4 +302,6 @@ function rcube_init_mail_ui()
rcmail_ui = new rcube_mail_ui();
rcube_event.add_listener({ object:rcmail_ui, method:'body_mouseup', event:'mouseup' });
rcube_event.add_listener({ object:rcmail_ui, method:'body_keypress', event:'keypress' });
+ rcmail.addEventListener('menu-open', 'open_listmenu', rcmail_ui);
+ rcmail.addEventListener('menu-save', 'save_listmenu', rcmail_ui);
}
diff --git a/skins/default/ie6hacks.css b/skins/default/ie6hacks.css
index e256ea1c5..11a5b1d3c 100644
--- a/skins/default/ie6hacks.css
+++ b/skins/default/ie6hacks.css
@@ -14,7 +14,9 @@ img
background-image: url('images/display/icons.gif');
}
-#messagemenu li a
+#messagemenu li a,
+#messagelist tr td div.expanded,
+#messagelist tr td div.collapsed
{
background-image: url('images/messageactions.gif');
}
@@ -47,13 +49,12 @@ img
background-image: url('images/abook_toolbar.gif');
}
-ul.toolbarmenu li
+ul.toolbarmenu li a
{
- width: auto;
- border: 1px solid #f6f6f6;
+ clear: left;
}
-ul.toolbarmenu li a
+ul.toolbarmenu li.separator_below
{
- clear: left;
+ padding-bottom: 8px;
}
diff --git a/skins/default/iehacks.css b/skins/default/iehacks.css
index dd40b32e1..e9bbe6725 100644
--- a/skins/default/iehacks.css
+++ b/skins/default/iehacks.css
@@ -24,13 +24,9 @@ input, textarea
filter: alpha(opacity=85);
}
-#markmessagemenu,
-#searchmenu,
-#messagemenu
+.popupmenu
{
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
- filter: alpha(opacity=90);
-
+ background-color: #ffffff;
}
#tabsbar
@@ -160,6 +156,11 @@ input, textarea
border-collapse: collapse;
}
+#messagelist tbody tr.unroot td.subject
+{
+ text-decoration: underline;
+}
+
#messageframe
{
width: expression((parseInt(this.parentNode.offsetWidth)-180)+'px');
@@ -243,6 +244,11 @@ div.message-part div.pre
filter: alpha(opacity=70);
}
+ul.toolbarmenu
+{
+ margin: 0 0 -4px 0;
+}
+
ul.toolbarmenu li
{
min-width: auto;
@@ -263,3 +269,9 @@ table.records-table thead tr td
{
height: 19px;
}
+
+#listmenu fieldset
+{
+ margin: 0 4px;
+ padding: 0.8em;
+}
diff --git a/skins/default/images/icons/columnpicker.gif b/skins/default/images/icons/columnpicker.gif
new file mode 100644
index 000000000..e776519b3
--- /dev/null
+++ b/skins/default/images/icons/columnpicker.gif
Binary files differ
diff --git a/skins/default/images/icons/unread_children.png b/skins/default/images/icons/unread_children.png
new file mode 100644
index 000000000..45e671dcc
--- /dev/null
+++ b/skins/default/images/icons/unread_children.png
Binary files differ
diff --git a/skins/default/images/mail_footer.png b/skins/default/images/mail_footer.png
index b1b63617e..ab56b835f 100644
--- a/skins/default/images/mail_footer.png
+++ b/skins/default/images/mail_footer.png
Binary files differ
diff --git a/skins/default/images/messageactions.gif b/skins/default/images/messageactions.gif
index 5f0a533fe..94fcba43e 100644
--- a/skins/default/images/messageactions.gif
+++ b/skins/default/images/messageactions.gif
Binary files differ
diff --git a/skins/default/images/messageactions.png b/skins/default/images/messageactions.png
index 8dfb3896d..b3e648eea 100644
--- a/skins/default/images/messageactions.png
+++ b/skins/default/images/messageactions.png
Binary files differ
diff --git a/skins/default/includes/messagemenu.html b/skins/default/includes/messagemenu.html
index ad2a6c61e..e89155ae8 100644
--- a/skins/default/includes/messagemenu.html
+++ b/skins/default/includes/messagemenu.html
@@ -1,4 +1,4 @@
-<div id="messagemenu">
+<div id="messagemenu" class="popupmenu">
<ul class="toolbarmenu">
<li><roundcube:button class="printlink" command="print" label="printmessage" classAct="printlink active" /></li>
<li><roundcube:button class="downloadlink" command="download" label="emlsave" classAct="downloadlink active" /></li>
diff --git a/skins/default/mail.css b/skins/default/mail.css
index eb7e190ab..7d1cb33d4 100644
--- a/skins/default/mail.css
+++ b/skins/default/mail.css
@@ -164,25 +164,38 @@
padding-left: 2px;
}
-#markmessagemenu,
-#searchmenu,
-#messagemenu
+.popupmenu
{
position: absolute;
top: 32px;
left: 90px;
width: auto;
display: none;
- background-color: #F9F9F9;
- border: 1px solid #CCC;
- padding: 1px;
- opacity: 0.9;
+ background-color: #fff;
+ background-color: rgba(255, 255, 255, 0.95);
+ border: 1px solid #999;
+ padding: 4px;
z-index: 240;
+ border-radius: 3px;
+ -moz-border-radius: 3px;
+ -webkit-border-radius: 3px;
+ -moz-box-shadow: 1px 1px 12px #999;
+ -webkit-box-shadow: #999 1px 1px 12px;
}
#searchmenu
{
- width: 172px;
+ width: 160px;
+}
+
+#searchmenu ul.toolbarmenu
+{
+ margin: 0;
+}
+
+#searchmenu ul.toolbarmenu li
+{
+ margin: 1px 4px 1px;
}
#messagemenu li a.active:hover,
@@ -194,53 +207,53 @@
#messagemenu li a
{
- background: url('images/messageactions.png') no-repeat 1px 0;
- background-position: 0px 20px;
+ background: url('images/messageactions.png') no-repeat 7px 0;
+ background-position: 7px 20px;
}
#messagemenu li a.printlink
{
- background-position: 1px 1px;
+ background-position: 7px 1px;
}
#messagemenu li a.downloadlink
{
- background-position: 1px -17px;
+ background-position: 7px -17px;
}
#messagemenu li a.sourcelink
{
- background-position: 1px -35px;
+ background-position: 7px -35px;
}
#messagemenu li a.openlink
{
- background-position: 1px -53px;
+ background-position: 7px -53px;
}
#messagemenu li a.editlink
{
- background-position: 1px -71px;
+ background-position: 7px -71px;
}
#markmessagemenu a.readlink
{
- background: url('images/icons/dot.png') no-repeat 2px;
+ background: url('images/icons/dot.png') no-repeat 7px 2px;
}
#markmessagemenu a.unreadlink
{
- background: url('images/icons/unread.png') no-repeat 2px;
+ background: url('images/icons/unread.png') no-repeat 7px 2px;
}
#markmessagemenu a.flaggedlink
{
- background: url('images/icons/flagged.png') no-repeat 2px;
+ background: url('images/icons/flagged.png') no-repeat 7px 2px;
}
#markmessagemenu a.unflaggedlink
{
- background: url('images/icons/unflagged.png') no-repeat 2px;
+ background: url('images/icons/unflagged.png') no-repeat 7px 2px;
}
#searchfilter
@@ -613,6 +626,30 @@ td.formlinks a:visited
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;
+}
+
#countcontrols
{
height: 15px;
@@ -720,15 +757,25 @@ body.messagelist
vertical-align: middle;
}
+#messagelist thead tr td.subject
+{
+ padding-left: 22px;
+}
+
#messagelist thead tr td.icon,
-#messagelist thead tr td.flag
+#messagelist thead tr td.flag,
+#messagelist thead tr td.threads
{
width: 22px;
padding: 0;
text-align: center;
}
-#messagelist tbody tr td.icon,
+#messagelist thead tr td.threads
+{
+ width: 18px;
+}
+
#messagelist tbody tr td.flag
{
padding: 2px 3px 2px 3px;
@@ -736,6 +783,45 @@ body.messagelist
cursor: pointer;
}
+#messagelist tr td span.branch
+{
+ display: inline-block;
+ width: 15px;
+ height: 15px;
+}
+
+#messagelist tr td.subject img.msgicon
+{
+ vertical-align: middle;
+}
+
+#messagelist tbody td img.msgicon
+{
+ position: relative;
+ top: 0px;
+ margin-right: 5px;
+}
+
+#messagelist tr td div.collapsed,
+#messagelist tr td div.expanded,
+#messagelist tr td img.flagicon,
+#messagelist tr td img.msgicon
+{
+ cursor: pointer;
+}
+
+#messagelist tr td div.collapsed
+{
+ display: block;
+ background: url('images/messageactions.png') center -91px no-repeat;
+}
+
+#messagelist tr td div.expanded
+{
+ display: block;
+ background: url('images/messageactions.png') center -109px no-repeat;
+}
+
#messagelist tbody tr td.flag img:hover,
#messagelist thead tr td.flag img
{
@@ -749,6 +835,12 @@ body.messagelist
width: 99%;
}
+/* thread parent message with unread children */
+#messagelist tbody tr.unroot td.subject a
+{
+ text-decoration: underline;
+}
+
#messagelist tr td.size
{
width: 70px;
@@ -1267,3 +1359,27 @@ font.bold
{
font-weight: bold;
}
+
+#listmenu
+{
+ padding: 6px;
+}
+
+#listmenu legend
+{
+ color: #999999;
+}
+
+#listmenu fieldset
+{
+ border: 1px solid #999999;
+ margin: 0 5px;
+ float: left;
+}
+
+#listmenu div
+{
+ padding: 8px 0 3px 0;
+ text-align: center;
+ clear: both;
+}
diff --git a/skins/default/templates/mail.html b/skins/default/templates/mail.html
index 9e07cf7d8..c66bc5802 100644
--- a/skins/default/templates/mail.html
+++ b/skins/default/templates/mail.html
@@ -59,7 +59,9 @@
forwardedrepliedIcon="/images/icons/forwarded_replied.png"
attachmentIcon="/images/icons/attachment.png"
flaggedIcon="/images/icons/flagged.png"
- unflaggedIcon="/images/icons/blank.gif" />
+ unflaggedIcon="/images/icons/blank.gif"
+ unreadchildrenIcon=""
+ optionsmenuIcon="/images/icons/columnpicker.gif" />
</div>
<roundcube:if condition="config:preview_pane == true" />
@@ -82,6 +84,10 @@
<roundcube:button command="select-all" type="link" prop="unread" title="unread" class="buttonPas unread" classAct="button unread" classSel="button unreadsel" content=" " />
<roundcube:button command="select-all" type="link" prop="invert" title="invert" class="buttonPas invert" classAct="button invert" classSel="button invertsel" content=" " />
<roundcube:button command="select-none" type="link" title="none" class="buttonPas none" classAct="button none" classSel="button nonesel" content=" " />
+ <span style="margin-left: 20px"><roundcube:label name="threads" />:&nbsp;</span>
+ <roundcube:button command="expand-all" type="link" title="expand-all" class="buttonPas expand-all" classAct="button expand-all" classSel="button expand-allsel" content=" " />
+ <roundcube:button command="expand-unread" type="link" title="expand-unread" class="buttonPas expand-unread" classAct="button expand-unread" classSel="button expand-unreadsel" content=" " />
+ <roundcube:button command="collapse-all" type="link" title="collapse-all" class="buttonPas collapse-all" classAct="button collapse-all" classSel="button collapse-allsel" content=" " />
<roundcube:container name="listcontrols" id="listcontrols" />
<roundcube:if condition="env:quota" />
<span style="margin-left: 20px; margin-right: 5px"><roundcube:label name="quota" />:</span>
@@ -111,7 +117,7 @@
<roundcube:button name="markreadbutton" id="markreadbutton" type="link" class="button markmessage" title="markmessages" onclick="rcmail_ui.show_markmenu();return false" content=" " />
<roundcube:button name="messagemenulink" id="messagemenulink" type="link" class="button messagemenu" title="messageactions" onclick="rcmail_ui.show_messagemenu();return false" content=" " />
-<div id="markmessagemenu">
+<div id="markmessagemenu" class="popupmenu">
<ul class="toolbarmenu">
<li><roundcube:button command="mark" prop="read" label="markread" classAct="readlink active" class="readlink" /></li>
<li><roundcube:button command="mark" prop="unread" label="markunread" classAct="unreadlink active" class="unreadlink" /></li>
@@ -125,7 +131,7 @@
</div>
-<div id="searchmenu">
+<div id="searchmenu" class="popupmenu">
<ul class="toolbarmenu">
<li><input type="checkbox" name="s_mods[]" value="subject" id="s_mod_subject" onclick="rcmail_ui.set_searchmod(this)" /><label for="s_mod_subject"><roundcube:label name="subject" /></label></li>
<li><input type="checkbox" name="s_mods[]" value="from" id="s_mod_from" onclick="rcmail_ui.set_searchmod(this)" /><label for="s_mod_from"><roundcube:label name="from" /></label></li>
@@ -146,5 +152,52 @@
<roundcube:button command="reset-search" id="searchreset" image="/images/icons/reset.gif" title="resetsearch" />
</div>
+<div id="listmenu" class="popupmenu">
+<fieldset class="thinbordered"><legend><roundcube:label name="listmode" /></legend>
+ <ul class="toolbarmenu">
+ <li><input type="radio" name="view" value="list" id="view_default" /><label for="view_default"><roundcube:label name="list" /></label></li>
+ <roundcube:if condition="env:threads" />
+ <li><input type="radio" name="view" value="thread" id="view_thread" /><label for="view_thread"><roundcube:label name="threads" /></label></li>
+ <roundcube:else />
+ <li><input type="radio" name="view" value="thread" id="view_thread" disabled="disabled" /><label for="view_thread" class="disabled"><roundcube:label name="threads" /></label></li>
+ <roundcube:endif />
+ </ul>
+</fieldset>
+<fieldset class="thinbordered"><legend><roundcube:label name="listcolumns" /></legend>
+ <ul class="toolbarmenu">
+ <li><input type="checkbox" name="list_col[]" value="flag" id="cols_flag" /><label for="cols_flag"><roundcube:label name="flag" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="subject" id="cols_subject" checked="checked" disabled="disabled" /><label for="cols_subject" class="disabled"><roundcube:label name="subject" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="from" id="cols_fromto" /><label for="cols_fromto"><roundcube:label name="fromto" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="replyto" id="cols_replyto" /><label for="cols_replyto"><roundcube:label name="replyto" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="cc" id="cols_cc" /><label for="cols_cc"><roundcube:label name="cc" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="date" id="cols_date" /><label for="cols_date"><roundcube:label name="date" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="size" id="cols_size" /><label for="cols_size"><roundcube:label name="size" /></label></li>
+ <li><input type="checkbox" name="list_col[]" value="attachment" id="cols_attachment" /><label for="cols_attachment"><roundcube:label name="attachment" /></label></li>
+ </ul>
+</fieldset>
+<fieldset class="thinbordered"><legend><roundcube:label name="listsorting" /></legend>
+ <ul class="toolbarmenu">
+ <li><input type="radio" name="sort_col" value="" id="sort_default" /><label for="sort_default"><roundcube:label name="nonesort" /></label></li>
+ <li><input type="radio" name="sort_col" value="arrival" id="sort_arrival" /><label for="sort_arrival"><roundcube:label name="arrival" /></label></li>
+ <li><input type="radio" name="sort_col" value="date" id="sort_date" /><label for="sort_date"><roundcube:label name="sentdate" /></label></li>
+ <li><input type="radio" name="sort_col" value="subject" id="sort_subject" /><label for="sort_subject"><roundcube:label name="subject" /></label></li>
+ <li><input type="radio" name="sort_col" value="from" id="sort_fromto" /><label for="sort_fromto"><roundcube:label name="fromto" /></label></li>
+ <li><input type="radio" name="sort_col" value="to" id="sort_replyto" /><label for="sort_replyto"><roundcube:label name="replyto" /></label></li>
+ <li><input type="radio" name="sort_col" value="cc" id="sort_cc" /><label for="sort_cc"><roundcube:label name="cc" /></label></li>
+ <li><input type="radio" name="sort_col" value="size" id="sort_size" /><label for="sort_size"><roundcube:label name="size" /></label></li>
+ </ul>
+</fieldset>
+<fieldset><legend><roundcube:label name="listorder" /></legend>
+ <ul class="toolbarmenu">
+ <li><input type="radio" name="sort_ord" value="ASC" id="sort_asc" /><label for="sort_asc"><roundcube:label name="asc" /></label></li>
+ <li><input type="radio" name="sort_ord" value="DESC" id="sort_desc" /><label for="sort_desc"><roundcube:label name="desc" /></label></li>
+ </ul>
+</fieldset>
+<div>
+ <roundcube:button command="menu-open" id="listmenucancel" type="input" class="button" label="cancel" />
+ <roundcube:button command="menu-save" id="listmenusave" type="input" class="button mainaction" label="save" />
+</div>
+</div>
+
</body>
</html>