diff options
Diffstat (limited to 'skins')
-rw-r--r-- | skins/default/images/buttons/markread_act.png | bin | 0 -> 1772 bytes | |||
-rw-r--r-- | skins/default/mail.css | 47 | ||||
-rw-r--r-- | skins/default/templates/mail.html | 97 |
3 files changed, 121 insertions, 23 deletions
diff --git a/skins/default/images/buttons/markread_act.png b/skins/default/images/buttons/markread_act.png Binary files differnew file mode 100644 index 000000000..32c051140 --- /dev/null +++ b/skins/default/images/buttons/markread_act.png diff --git a/skins/default/mail.css b/skins/default/mail.css index 9cb50f555..ac05f0124 100644 --- a/skins/default/mail.css +++ b/skins/default/mail.css @@ -41,6 +41,49 @@ padding-left: 2px; } +#markmessagemenu +{ + position: absolute; + top: 32px; + left: 90px; + width: auto; + visibility: hidden; + background-color: #F9F9F9; + border: 1px solid #CCC; + padding: 1px; + opacity: 0.9; + z-index: 240; +} + +ul.toolbarmenu +{ + margin: 0; + padding: 0; + list-style: none; +} + +ul.toolbarmenu li +{ + font-size: 11px; + white-space: nowrap; + min-width: 130px; + width: auto !important; + width: 130px; +} + +ul.toolbarmenu li a +{ + display: block; + color: #a0a0a0; + padding: 2px 8px 3px 12px; + text-decoration: none; +} + +ul.toolbarmenu li a.active:hover +{ + background-color: #ddd; +} + #listcontrols { position: absolute; @@ -71,6 +114,9 @@ td.formlinks a:visited #mailboxcontrols a.active, #mailboxcontrols a.active:active, #mailboxcontrols a.active:visited, +ul.toolbarmenu li a.active, +ul.toolbarmenu li a.active:active, +ul.toolbarmenu li a.active:visited, td.formlinks a, td.formlinks a:visited { @@ -190,6 +236,7 @@ td.formlinks a:visited { display: block; height: 12px; + margin: 0; padding: 3px 10px 4px 10px; background-color: #EBEBEB; background-image: url(images/listheader_aqua.gif); diff --git a/skins/default/templates/mail.html b/skins/default/templates/mail.html index a38c06aee..2c3846b2b 100644 --- a/skins/default/templates/mail.html +++ b/skins/default/templates/mail.html @@ -5,36 +5,50 @@ <roundcube:include file="/includes/links.html" /> <link rel="stylesheet" type="text/css" href="/mail.css" /> <script type="text/javascript" src="/splitter.js"></script> +<script type="text/javascript"> + +function rcube_mail_ui() +{ + this.markmenu = new rcube_layer('markmessagemenu'); +} + +rcube_mail_ui.prototype = { + +show_markmenu: function(show) +{ + if (typeof show == 'undefined') + show = this.markmenu.visible ? false : true; + + var ref = rcube_find_object('markreadbutton'); + if (show && ref) + this.markmenu.move(ref.offsetLeft, ref.offsetTop + ref.offsetHeight); + + this.markmenu.show(show); +}, + +body_mouseup: function(evt, p) +{ + if (this.markmenu && this.markmenu.visible) + this.show_markmenu(false); +}, + +body_keypress: function(evt, p) +{ + if (rcube_event.get_keycode(evt) == 27 && this.markmenu && this.markmenu.visible) + this.show_markmenu(false); +} + +}; + +</script> </head> <body> <roundcube:include file="/includes/taskbar.html" /> <roundcube:include file="/includes/header.html" /> -<div id="messagetoolbar"> -<roundcube:button command="checkmail" imageSel="/images/buttons/inbox_sel.png" imageAct="/images/buttons/inbox_act.png" imagePas="/images/buttons/inbox_pas.png" width="32" height="32" title="checkmail" /> -<roundcube:button command="compose" imageSel="/images/buttons/compose_sel.png" imageAct="/images/buttons/compose_act.png" imagePas="/images/buttons/compose_pas.png" width="32" height="32" title="writenewmessage" /> -<roundcube:button command="reply" imageSel="/images/buttons/reply_sel.png" imageAct="/images/buttons/reply_act.png" imagePas="/images/buttons/reply_pas.png" width="32" height="32" title="replytomessage" /> -<roundcube:button command="reply-all" imageSel="/images/buttons/replyall_sel.png" imageAct="/images/buttons/replyall_act.png" imagePas="/images/buttons/replyall_pas.png" width="32" height="32" title="replytoallmessage" /> -<roundcube:button command="forward" imageSel="/images/buttons/forward_sel.png" imageAct="/images/buttons/forward_act.png" imagePas="/images/buttons/forward_pas.png" width="32" height="32" title="forwardmessage" /> -<roundcube:button command="delete" imageSel="/images/buttons/delete_sel.png" imageAct="/images/buttons/delete_act.png" imagePas="/images/buttons/delete_pas.png" width="32" height="32" title="deletemessage" /> -<roundcube:button command="print" imageSel="/images/buttons/print_sel.png" imageAct="/images/buttons/print_act.png" imagePas="/images/buttons/print_pas.png" width="32" height="32" title="printmessage" /> -</div> - -<div id="quicksearchbar"> -<roundcube:object name="searchform" type="search" results="5" id="quicksearchbox" /><roundcube:button command="reset-search" id="searchreset" image="/images/icons/reset.gif" title="resetsearch" /> -</div> - -<div id="messagecountbar"> -<roundcube:button command="firstpage" imageSel="/images/buttons/first_sel.png" imageAct="/images/buttons/first_act.png" imagePas="/images/buttons/first_pas.png" width="11" height="11" title="firstmessages" /> -<roundcube:button command="previouspage" imageSel="/images/buttons/previous_sel.png" imageAct="/images/buttons/previous_act.png" imagePas="/images/buttons/previous_pas.png" width="11" height="11" title="previousmessages" /> - <roundcube:object name="messageCountDisplay" /> -<roundcube:button command="nextpage" imageSel="/images/buttons/next_sel.png" imageAct="/images/buttons/next_act.png" imagePas="/images/buttons/next_pas.png" width="11" height="11" title="nextmessages" /> -<roundcube:button command="lastpage" imageSel="/images/buttons/last_sel.png" imageAct="/images/buttons/last_act.png" imagePas="/images/buttons/last_pas.png" width="11" height="11" title="lastmessages" /> -</div> - <div id="mailboxlist-container"> -<div id="mailboxlist-header"><roundcube:label name="mailboxlist" /></div> +<h3 id="mailboxlist-header"><roundcube:label name="mailboxlist" /></h3> <roundcube:object name="mailboxlist" id="mailboxlist" maxlength="16" /> </div> @@ -84,5 +98,42 @@ <roundcube:endif /> </div> +<div id="messagetoolbar"> +<roundcube:button command="checkmail" imageSel="/images/buttons/inbox_sel.png" imageAct="/images/buttons/inbox_act.png" imagePas="/images/buttons/inbox_pas.png" width="32" height="32" title="checkmail" /> +<roundcube:button command="compose" imageSel="/images/buttons/compose_sel.png" imageAct="/images/buttons/compose_act.png" imagePas="/images/buttons/compose_pas.png" width="32" height="32" title="writenewmessage" /> +<roundcube:button id="markreadbutton" image="/images/buttons/markread_act.png" width="32" height="32" title="markmessages" onclick="rcmailUI.show_markmenu();return false" /> +<roundcube:button command="reply" imageSel="/images/buttons/reply_sel.png" imageAct="/images/buttons/reply_act.png" imagePas="/images/buttons/reply_pas.png" width="32" height="32" title="replytomessage" /> +<roundcube:button command="reply-all" imageSel="/images/buttons/replyall_sel.png" imageAct="/images/buttons/replyall_act.png" imagePas="/images/buttons/replyall_pas.png" width="32" height="32" title="replytoallmessage" /> +<roundcube:button command="forward" imageSel="/images/buttons/forward_sel.png" imageAct="/images/buttons/forward_act.png" imagePas="/images/buttons/forward_pas.png" width="32" height="32" title="forwardmessage" /> +<roundcube:button command="delete" imageSel="/images/buttons/delete_sel.png" imageAct="/images/buttons/delete_act.png" imagePas="/images/buttons/delete_pas.png" width="32" height="32" title="deletemessage" /> +<roundcube:button command="print" imageSel="/images/buttons/print_sel.png" imageAct="/images/buttons/print_act.png" imagePas="/images/buttons/print_pas.png" width="32" height="32" title="printmessage" /> + +<div id="markmessagemenu"> + <ul class="toolbarmenu"> + <li><roundcube:button command="mark" prop="read" label="markread" classAct="active" /></li> + <li><roundcube:button command="mark" prop="unread" label="markunread" classAct="active" /></li> + </ul> +</div> +</div> + +<div id="quicksearchbar"> +<roundcube:object name="searchform" type="search" results="5" id="quicksearchbox" /><roundcube:button command="reset-search" id="searchreset" image="/images/icons/reset.gif" title="resetsearch" /> +</div> + +<div id="messagecountbar"> +<roundcube:button command="firstpage" imageSel="/images/buttons/first_sel.png" imageAct="/images/buttons/first_act.png" imagePas="/images/buttons/first_pas.png" width="11" height="11" title="firstmessages" /> +<roundcube:button command="previouspage" imageSel="/images/buttons/previous_sel.png" imageAct="/images/buttons/previous_act.png" imagePas="/images/buttons/previous_pas.png" width="11" height="11" title="previousmessages" /> + <roundcube:object name="messageCountDisplay" /> +<roundcube:button command="nextpage" imageSel="/images/buttons/next_sel.png" imageAct="/images/buttons/next_act.png" imagePas="/images/buttons/next_pas.png" width="11" height="11" title="nextmessages" /> +<roundcube:button command="lastpage" imageSel="/images/buttons/last_sel.png" imageAct="/images/buttons/last_act.png" imagePas="/images/buttons/last_pas.png" width="11" height="11" title="lastmessages" /> +</div> + +<script type="text/javascript"> + +var rcmailUI = new rcube_mail_ui(); +rcube_event.add_listener({ object:rcmailUI, method:'body_mouseup', event:'mouseup' }); +rcube_event.add_listener({ object:rcmailUI, method:'body_keypress', event:'keypress' }); + +</script> </body> </html> |