diff options
Diffstat (limited to 'skins/larry')
26 files changed, 171 insertions, 54 deletions
diff --git a/skins/larry/addressbook.css b/skins/larry/addressbook.css index a70b1ba69..8681cda70 100644 --- a/skins/larry/addressbook.css +++ b/skins/larry/addressbook.css @@ -200,7 +200,7 @@ top: 0; left: 0; right: 0; - bottom: 28px; + bottom: 0px; border: 0; border-radius: 4px; } @@ -393,7 +393,7 @@ a.deletebutton { #import-box { position: absolute; - bottom: 28px; + bottom: 0px; top: 34px; left: 0; right: 0; diff --git a/skins/larry/ie7hacks.css b/skins/larry/ie7hacks.css index fc4713361..60adff7a1 100644 --- a/skins/larry/ie7hacks.css +++ b/skins/larry/ie7hacks.css @@ -43,7 +43,8 @@ a.deletebutton, .attachmentslist li a.cancelupload, #contacts-table td.action a, .previewheader .iconlink, -.minimal #taskbar .button-inner { +.minimal #taskbar .button-inner, +#preferences-details fieldset.advanced .advanced-toggle { /* workaround for text-indent which also offsets the background image */ text-indent: 0; font-size: 0; diff --git a/skins/larry/iehacks.css b/skins/larry/iehacks.css index 960ce7648..7c1585107 100644 --- a/skins/larry/iehacks.css +++ b/skins/larry/iehacks.css @@ -56,6 +56,10 @@ input.button:active { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#c8c8c8', GradientType=0); } +#messagestack div { + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e0404040', endColorstr='#e0303030', GradientType=0); +} + .ui-dialog.popupmessage .ui-dialog-titlebar { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e3e3e3', endColorstr='#cfcfcf', GradientType=0); } diff --git a/skins/larry/images/ajaxloader_dark.gif b/skins/larry/images/ajaxloader_dark.gif Binary files differnew file mode 100644 index 000000000..f1cce35ac --- /dev/null +++ b/skins/larry/images/ajaxloader_dark.gif diff --git a/skins/larry/images/filetypes.png b/skins/larry/images/filetypes.png Binary files differindex 53b2eee9a..09772660b 100644 --- a/skins/larry/images/filetypes.png +++ b/skins/larry/images/filetypes.png diff --git a/skins/larry/images/listicons.png b/skins/larry/images/listicons.png Binary files differindex 2527fe10d..8a17cc5bd 100644 --- a/skins/larry/images/listicons.png +++ b/skins/larry/images/listicons.png diff --git a/skins/larry/images/messages_dark.png b/skins/larry/images/messages_dark.png Binary files differnew file mode 100644 index 000000000..d7c932502 --- /dev/null +++ b/skins/larry/images/messages_dark.png diff --git a/skins/larry/includes/footer.html b/skins/larry/includes/footer.html index a4fa69296..5cf9d1ec5 100644 --- a/skins/larry/includes/footer.html +++ b/skins/larry/includes/footer.html @@ -1,3 +1,5 @@ +<roundcube:object name="message" id="messagestack" condition="env:task != 'login'" /> + <script type="text/javascript"> // UI startup diff --git a/skins/larry/mail.css b/skins/larry/mail.css index f3b95b850..90b3511d4 100644 --- a/skins/larry/mail.css +++ b/skins/larry/mail.css @@ -37,19 +37,16 @@ top: 42px; left: 0; width: 100%; - bottom: 28px; -} - -#mailview-top.fullheight { - border-radius: 4px 4px 0 0; + bottom: 0px; } #mailview-bottom { + display: none; position: absolute; left: 0; bottom: 0; width: 100%; - height: 27px; + height: 0; border-radius: 4px; border-top: none; } @@ -102,10 +99,6 @@ html>/**/body #messagelist { border-radius: 0 0 4px 4px; } -#mailview-top.fullheight #messagelistfooter { - border-radius: 0; -} - #messagelistfooter.rightalign { text-align: right; } @@ -513,7 +506,7 @@ table.messagelist.fixedcopy { } .messagelist tr td.date { - width: 135px; + width: 155px; } .messagelist tr.message { @@ -752,7 +745,7 @@ table.messagelist.fixedcopy { top: 0; left: 0; width: 100%; - bottom: 28px; + bottom: 0px; } #messagecontframe { @@ -765,7 +758,7 @@ table.messagelist.fixedcopy { top: 110px; left: 0; width: 100%; - bottom: 27px; + bottom: 1px; overflow: auto; -webkit-overflow-scrolling: touch; } @@ -1367,9 +1360,7 @@ div.message-partheaders .headers-table td.header { top: 42px; left: 0; width: 100%; - bottom: 28px; - border-radius: 4px 4px 0 0; - border-bottom: none; + bottom: 0px; overflow: hidden; } @@ -1490,6 +1481,7 @@ div.message-partheaders .headers-table td.header { left: 0; right: 260px; bottom: 0; + border-radius: 0 0 0 4px; } #composebodycontainer.buttons { @@ -1503,7 +1495,7 @@ div.message-partheaders .headers-table td.header { bottom: 0; width: 99%; border: 0; - border-radius: 0; + border-radius: 0 0 0 4px; padding: 8px 0 8px 8px; resize: none; font-family: monospace; diff --git a/skins/larry/settings.css b/skins/larry/settings.css index a769ac412..af667b9e7 100644 --- a/skins/larry/settings.css +++ b/skins/larry/settings.css @@ -2,7 +2,7 @@ * Roundcube webmail styles for the Settings section * * Copyright (c) 2012, The Roundcube Dev Team - * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com + * Screendesign by FLINT / Büro für Gestaltung, bueroflint.com * * The contents are subject to the Creative Commons Attribution-ShareAlike * License. It is allowed to copy, distribute, transmit and to adapt the work @@ -61,11 +61,21 @@ #preferences-details fieldset.advanced .advanced-toggle { position: absolute; - top: 2px; + display: block; + top: 0px; right: 6px; text-decoration: none; color: #666; font-size: 11px; + width: 20px; + height: 18px; + background: url('images/listicons.png') 0 -1157px no-repeat; + text-indent: 1000px; + overflow: hidden; +} + +#preferences-details fieldset.advanced .collapsed .advanced-toggle { + background-position: -24px -1137px; } #sections-table tbody td.section, diff --git a/skins/larry/styles.css b/skins/larry/styles.css index b47edec34..810299735 100644 --- a/skins/larry/styles.css +++ b/skins/larry/styles.css @@ -509,6 +509,7 @@ a.iconlink.upload { } #message.statusbar { + display: none; position: absolute; bottom: 0; left: 0; @@ -528,6 +529,93 @@ a.iconlink.upload { text-overflow: ellipsis; } +#messagestack { + position: absolute; + bottom: 14px; + right: 5px; + z-index: 50000; + width: auto; + height: auto; + max-height: 85%; + overflow-y: auto; + padding: 2px; +} + +#messagestack div { + display: block; + position: relative; + width: 280px; + height: auto; + min-height: 16px; + margin: 3px 2px 5px 2px; + padding: 8px 10px 7px 30px; + cursor: default; + font-size: 12px; + font-weight: bold; + border-radius: 4px; + border: 1px solid #444; + color: #ebebeb; + text-shadow: 0 1px 1px #000; + + background: rgba(64,64,64,0.9); + background: -moz-linear-gradient(top, rgba(64,64,64,0.9) 0%, rgba(48,48,48,0.9) 100%); + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(64,64,64,0.9)), color-stop(100%,rgba(48,48,48,0.9))); + background: -webkit-linear-gradient(top, rgba(64,64,64,0.9) 0%, rgba(48,48,48,0.9) 100%); + background: -o-linear-gradient(top, rgba(64,64,64,0.9) 0%, rgba(48,48,48,0.9) 100%); + background: -ms-linear-gradient(top, rgba(64,64,64,0.9) 0%, rgba(48,48,48,0.9) 100%); + background: linear-gradient(to bottom, rgba(64,64,64,0.9) 0%, rgba(48,48,48,0.9) 100%); + + -moz-box-shadow: 0 1px 4px 0 rgba(50,50,50,0.8), inset 0px 1px 0 0px #888; + -webkit-box-shadow: 0 1px 4px 0 rgba(50,50,50,0.8), inset 0px 1px 0 0px #888; + -o-box-shadow: 0 1px 4px 0 rgba(50,50,50,0.8), inset 0px 1px 0 0px #888; + box-shadow: 0 1px 4px 0 rgba(50,50,50,0.8), inset 0px 1px 0 0px #888; +} + +#messagestack div:after { + content: ""; + position: absolute; + display: block; + top: 0; + left: 4px; + width: 20px; + height: 24px; + background: url(images/messages_dark.png) 0 6px no-repeat; +} + +#messagestack div.error { + color: #ff615d; +} + +#messagestack div.error:after { + background-position: 0 -55px; +} + +#messagestack div.warning { + color: #f4bf0e; +} + +#messagestack div.warning:after { + background-position: 0 -84px; +} + +#messagestack div.confirmation { + color: #00e05a; +} + +#messagestack div.confirmation:after { + background-position: 0 -25px; +} + +#messagestack div.loading { + color: #ddd; +} + +#messagestack div.loading:after { + top: 4px; + left: 6px; + background: url(images/ajaxloader_dark.gif) 0 4px no-repeat; +} + .ui-dialog.error .ui-dialog-title, .ui-dialog.warning .ui-dialog-title, .ui-dialog.confirmation .ui-dialog-title { @@ -1241,7 +1329,6 @@ table.records-table { display: table; width: 100%; table-layout: fixed; - border-collapse: collapse; border-spacing: 0; border: 1px solid #bbd3da; } @@ -1413,7 +1500,7 @@ body.iframe .footerleft.floating:before, top: 34px; left: 0; right: 0; - bottom: 28px; + bottom: 0px; overflow: auto; } @@ -1422,7 +1509,7 @@ body.iframe .footerleft.floating:before, top: 0; left: 0; right: 0; - bottom: 28px; + bottom: 0px; } .footerleft { @@ -1619,11 +1706,13 @@ ul.proplist li { min-height: 40px; padding: 5px 25px; text-align: center; + font-size: 1.1em; } #login-form #message div { display: inline-block; padding-right: 0; + font-size: 12px; } #bottomline { @@ -2331,6 +2420,18 @@ ul.toolbarmenu li span.conversation { background-position: 0 -494px; } +.attachmentslist li.ppt, +.attachmentslist li.pptx, +.attachmentslist li.ppsx, +.attachmentslist li.vnd.mspowerpoint { + background-position: 0 -520px; +} + +.attachmentslist li.odp, +.attachmentslist li.otp { + background-position: 0 -546px; +} + .attachmentslist li a, #compose-attachments ul li { display: block; diff --git a/skins/larry/svggradients.css b/skins/larry/svggradients.css index c40d44f4b..2596f2bd2 100644 --- a/skins/larry/svggradients.css +++ b/skins/larry/svggradients.css @@ -56,6 +56,10 @@ input.button:active { background-image: url(svggradient.php?c=eaeaea;c8c8c8); } +#messagestack div { + background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIgc3RvcC1vcGFjaXR5PSIwLjg4Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMDMwMzAiIHN0b3Atb3BhY2l0eT0iMC44OCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); +} + .ui-dialog.popupmessage .ui-dialog-titlebar { background-image: url(svggradient.php?c=e3e3e3;cfcfcf); } diff --git a/skins/larry/templates/addressbook.html b/skins/larry/templates/addressbook.html index b33ebd999..9f83853b2 100644 --- a/skins/larry/templates/addressbook.html +++ b/skins/larry/templates/addressbook.html @@ -71,7 +71,6 @@ <div class="iframebox"> <roundcube:object name="addressframe" id="contact-frame" style="width:100%; height:100%" frameborder="0" src="/watermark.html" /> </div> - <roundcube:object name="message" id="message" class="statusbar" /> </div> diff --git a/skins/larry/templates/compose.html b/skins/larry/templates/compose.html index 5a6285c68..11662d185 100644 --- a/skins/larry/templates/compose.html +++ b/skins/larry/templates/compose.html @@ -179,10 +179,6 @@ </form> -<div id="mailview-bottom" class="uibox"> - <roundcube:object name="message" id="message" class="statusbar" /> -</div> - </div><!-- end mailview-right --> </div><!-- end mainscreen --> diff --git a/skins/larry/templates/folders.html b/skins/larry/templates/folders.html index 988ff952c..56396bf1d 100644 --- a/skins/larry/templates/folders.html +++ b/skins/larry/templates/folders.html @@ -31,7 +31,6 @@ <div class="iframebox"> <roundcube:object name="folderframe" id="preferences-frame" style="width:100%; height:100%" frameborder="0" src="/watermark.html" /> </div> - <roundcube:object name="message" id="message" class="statusbar" /> </div> </div> diff --git a/skins/larry/templates/identities.html b/skins/larry/templates/identities.html index d9270b68a..e3d2cc842 100644 --- a/skins/larry/templates/identities.html +++ b/skins/larry/templates/identities.html @@ -28,7 +28,6 @@ <div class="iframebox"> <roundcube:object name="identityframe" id="preferences-frame" style="width:100%; height:100%" frameborder="0" src="/watermark.html" /> </div> - <roundcube:object name="message" id="message" class="statusbar" /> </div> </div> diff --git a/skins/larry/templates/importcontacts.html b/skins/larry/templates/importcontacts.html index 69b138b9a..d7c690a6a 100644 --- a/skins/larry/templates/importcontacts.html +++ b/skins/larry/templates/importcontacts.html @@ -24,9 +24,6 @@ <roundcube:object name="importnav" class="button" /> </p> </div> - -<roundcube:object name="message" id="message" class="statusbar" /> - </div> <roundcube:include file="/includes/footer.html" /> diff --git a/skins/larry/templates/login.html b/skins/larry/templates/login.html index 13e919ad3..8da941189 100644 --- a/skins/larry/templates/login.html +++ b/skins/larry/templates/login.html @@ -39,11 +39,13 @@ <roundcube:object name="preloader" images=" /images/ajaxloader.gif + /images/ajaxloader_dark.gif /images/buttons.png /images/addcontact.png /images/filetypes.png /images/listicons.png /images/messages.png + /images/messages_dark.png /images/quota.png /images/selector.png /images/splitter.png diff --git a/skins/larry/templates/mail.html b/skins/larry/templates/mail.html index f2c52c820..2e7c0c105 100644 --- a/skins/larry/templates/mail.html +++ b/skins/larry/templates/mail.html @@ -6,7 +6,7 @@ <style type="text/css"> <roundcube:if condition="config:preview_pane == true" /> #mailview-top { height: <roundcube:exp expression="!empty(cookie:mailviewsplitter) ? cookie:mailviewsplitter-48 : 276" />px; } - #mailview-bottom { top: <roundcube:exp expression="!empty(cookie:mailviewsplitter) ? cookie:mailviewsplitter+6 : 330" />px; height: auto; } + #mailview-bottom { top: <roundcube:exp expression="!empty(cookie:mailviewsplitter) ? cookie:mailviewsplitter+6 : 330" />px; height: auto; display: block; } #mailpreviewframe { display: block; } <roundcube:endif /> </style> @@ -116,8 +116,6 @@ <roundcube:object name="messagecontentframe" id="messagecontframe" style="width:100%; height:100%" frameborder="0" src="/watermark.html" /> </div> -<roundcube:object name="message" id="message" class="statusbar" /> - </div><!-- end mailview-bottom --> </div><!-- end mailview-right --> diff --git a/skins/larry/templates/message.html b/skins/larry/templates/message.html index 6937b00af..e63705f76 100644 --- a/skins/larry/templates/message.html +++ b/skins/larry/templates/message.html @@ -84,8 +84,6 @@ </div> </div> -<roundcube:object name="message" id="message" class="statusbar" /> - </div><!-- end mailview-right --> </div><!-- end mainscreen --> diff --git a/skins/larry/templates/messageerror.html b/skins/larry/templates/messageerror.html index a735d47f2..dbe373a12 100644 --- a/skins/larry/templates/messageerror.html +++ b/skins/larry/templates/messageerror.html @@ -38,8 +38,6 @@ <div id="messagecontent" class="watermark"></div> -<roundcube:object name="message" id="message" class="statusbar" /> - </div><!-- end mailview-right --> </div><!-- end mainscreen --> diff --git a/skins/larry/templates/messagepart.html b/skins/larry/templates/messagepart.html index d0e3a808d..0ec935873 100644 --- a/skins/larry/templates/messagepart.html +++ b/skins/larry/templates/messagepart.html @@ -27,7 +27,6 @@ <div class="iframebox"> <roundcube:object name="messagePartFrame" id="messagepartframe" frameborder="0" /> </div> - <roundcube:object name="message" id="message" class="statusbar" /> </div> </div> diff --git a/skins/larry/templates/plugin.html b/skins/larry/templates/plugin.html index 341f604ac..5b86563ab 100644 --- a/skins/larry/templates/plugin.html +++ b/skins/larry/templates/plugin.html @@ -16,7 +16,6 @@ <div id="pluginbody" class="uibox contentbox"> <roundcube:object name="plugin.body" /> -<roundcube:object name="message" id="message" class="statusbar" /> </div> </div> diff --git a/skins/larry/templates/responses.html b/skins/larry/templates/responses.html index fb40048c8..8e6884539 100644 --- a/skins/larry/templates/responses.html +++ b/skins/larry/templates/responses.html @@ -28,7 +28,6 @@ <div class="iframebox"> <roundcube:object name="responseframe" id="preferences-frame" style="width:100%; height:100%" frameborder="0" src="/watermark.html" /> </div> - <roundcube:object name="message" id="message" class="statusbar" /> </div> </div> diff --git a/skins/larry/templates/settings.html b/skins/larry/templates/settings.html index 427e0a4f5..08df7686e 100644 --- a/skins/larry/templates/settings.html +++ b/skins/larry/templates/settings.html @@ -24,7 +24,6 @@ <div class="iframebox"> <roundcube:object name="prefsframe" id="preferences-frame" style="width:100%; height:100%" frameborder="0" src="/watermark.html" /> </div> - <roundcube:object name="message" id="message" class="statusbar" /> </div> </div> diff --git a/skins/larry/ui.js b/skins/larry/ui.js index 0fd0241f7..75dcba8ec 100644 --- a/skins/larry/ui.js +++ b/skins/larry/ui.js @@ -106,14 +106,17 @@ function rcube_mail_ui() // add menu link for each attachment $('#attachment-list > li').each(function() { - $(this).append($('<a class="drop">').click(function() { attachmentmenu(this); })); + $(this).append($('<a class="drop"></a>').click(function() { attachmentmenu(this); })); }); } else if (rcmail.env.action == 'compose') { - rcmail.addEventListener('aftertoggle-editor', function(){ window.setTimeout(function(){ layout_composeview() }, 200); }); + rcmail.addEventListener('aftertoggle-editor', function(e){ + window.setTimeout(function(){ layout_composeview() }, 200); + if (e && e.mode) + $("select[name='editorSelector']").val(e.mode); + }); rcmail.addEventListener('aftersend-attachment', show_uploadform); rcmail.addEventListener('add-recipient', function(p){ show_header_row(p.field, true); }); - layout_composeview(); // Show input elements with non-empty value var f, v, field, fields = ['cc', 'bcc', 'replyto', 'followupto']; @@ -133,6 +136,10 @@ function rcube_mail_ui() return false; }).css('cursor', 'pointer'); + // adjust hight when textarea starts to scroll + $("textarea[name='_to'], textarea[name='_cc'], textarea[name='_bcc']").change(function(e){ adjust_compose_editfields(this); }).change(); + rcmail.addEventListener('autocomplete_insert', function(p){ adjust_compose_editfields(p.field); }); + // toggle compose options if opened in new window and they were visible before var opener_rc = rcmail.opener(); if (opener_rc && opener_rc.env.action == 'compose' && $('#composeoptionstoggle', opener.document).hasClass('remove')) @@ -366,6 +373,10 @@ function rcube_mail_ui() */ function message_displayed(p) { + var siblings = $(p.object).siblings('div'); + if (siblings.length) + $(p.object).insertBefore(siblings.first()); + // show a popup dialog on errors if (p.type == 'error' && rcmail.env.task != 'login') { if (me.message_timer) { @@ -392,12 +403,12 @@ function rcube_mail_ui() me.messagedialog.dialog('destroy').hide(); }, position: ['center', pos.top], - hide: { effect:'drop', direction:'down' }, + hide: { effect:'drop', direction:'right' }, width: 420, minHeight: 90 }).show(); - me.message_timer = window.setTimeout(function(){ me.messagedialog.dialog('close'); }, Math.max(2000, p.timeout / 2)); + me.message_timer = window.setTimeout(function(){ me.messagedialog.dialog('close'); }, Math.max(3000, p.timeout / 2)); } } @@ -428,6 +439,16 @@ function rcube_mail_ui() // STUB } + function adjust_compose_editfields(elem) + { + if (elem.nodeName == 'TEXTAREA') { + var $elem = $(elem), line_height = 14, // hard-coded because some browsers only provide the outer height in elem.clientHeight + content_height = elem.scrollHeight, + rows = elem.value.length > 80 && content_height > line_height*1.5 ? 2 : 1; + $elem.css('height', (line_height*rows) + 'px'); + layout_composeview(); + } + } function layout_composeview() { @@ -592,7 +613,7 @@ function rcube_mail_ui() if (visible) { $('#mailview-top').removeClass('fullheight').css({ bottom:'auto' }); - $('#mailview-bottom').css({ height:'auto' }); + $('#mailview-bottom').css({ height:'auto' }).show(); rcmail.env.contentframe = 'messagecontframe'; if (uid = rcmail.message_list.get_single_selection()) @@ -610,8 +631,8 @@ function rcube_mail_ui() rcmail.env.contentframe = null; rcmail.show_contentframe(false); - $('#mailview-top').addClass('fullheight').css({ height:'auto', bottom:'28px' }); - $('#mailview-bottom').css({ top:'auto', height:'26px' }); + $('#mailview-top').addClass('fullheight').css({ height:'auto', bottom:'0px' }); + $('#mailview-bottom').css({ top:'auto', height:'0px' }).hide(); if (mailviewsplit.handle) mailviewsplit.handle.hide(); |
