From b540ed15a30cd9379df7feb62b0ae81a8a111e9c Mon Sep 17 00:00:00 2001 From: thomascube Date: Wed, 14 Dec 2011 23:13:38 +0000 Subject: [PATCH] Larry is growing up --- program/steps/settings/edit_identity.inc | 2 +- skins/larry/images/splitter.png | Bin 0 -> 1050 bytes skins/larry/mail.css | 59 +++++++++++++++---- skins/larry/settings.css | 13 +++++ skins/larry/styles.css | 66 +++++++++++++++++----- skins/larry/templates/folderedit.html | 27 +++++++++ skins/larry/templates/folders.html | 43 ++++++++++++++ skins/larry/templates/identityedit.html | 2 +- skins/larry/templates/mail.html | 13 ++++- skins/larry/templates/messagepreview.html | 40 +++++++++++++ skins/larry/ui.js | 38 ++++++++++--- 11 files changed, 267 insertions(+), 36 deletions(-) create mode 100644 skins/larry/images/splitter.png create mode 100644 skins/larry/templates/folderedit.html create mode 100644 skins/larry/templates/folders.html create mode 100644 skins/larry/templates/messagepreview.html diff --git a/program/steps/settings/edit_identity.inc b/program/steps/settings/edit_identity.inc index bf64d4265..f0c477673 100644 --- a/program/steps/settings/edit_identity.inc +++ b/program/steps/settings/edit_identity.inc @@ -111,7 +111,7 @@ function rcube_identity_form($attrib) array('name' => '_iid', 'value' => $IDENTITY_RECORD['identity_id'])); unset($plugin); - unset($attrib['form']); + unset($attrib['form'], $attrib['id']); // return the complete edit form as table $out = "$form_start\n"; diff --git a/skins/larry/images/splitter.png b/skins/larry/images/splitter.png new file mode 100644 index 0000000000000000000000000000000000000000..40ab4875dc94176d2dcab1a2a2a725b074cd96ac GIT binary patch literal 1050 zcmaJ=OK1~87+xt>srKMSd=OZ+;EQHoX|mn5u_U`m8+1#XM9iUwZg!{5+V0MFcVf0h zgep`7+oO0WB9@B1coxJ5v{1!^6!aoJ2=xIKe4M<9b+%1X55|Srng8eezW*`*-01J? zX>B>uLJ&l2rdP@0{dlnUHsk-z`GF|j4x>~7<=`-?Xf7ZU1}p+HV`(EG3p8V5{3Ylj zh$hO+7f?YxC+X0lwE#o=mV?;@(bercnm!5;Sp*}d9jCrMenyd|5vMLhRaSLmP%?Wb zU67mX%j=V)x@b_{XUHyJ!U7gR8tGeOwkP>t#;NV33Ti(oLl=-y znhoo0j3r|n%|$u{L1-s=mSY)~XE;902~vcYSeC4Q6prQ^!%|jBS7Tu-PL&XHB!;O} zDs&}6LwAJXL{SVhcs`5~VQ<1lnjf~kwwi(hJl!=NWI~$^6tyBOqd0{#-7dj$>aw<1 zZ4+)7<7*DX(QHss4XCRBhgw!0?V&8#$@ibaUVg#>Ocr>s?CSX9hTDQrjwHK4L(t7b zI9BUoe+eS!m7qh)xhSb>x@iaY7G71QjO`)K)0!G?}7P(cjWH!!4Y^Yb| z8jW*FG~_Zk878>czb?Aw!qXER>tlS!S3e~++dx%}l1b_YH+0ySpE_kh(RG;!NIdt_8wOd;r literal 0 HcmV?d00001 diff --git a/skins/larry/mail.css b/skins/larry/mail.css index 34fe36b38..04266bc49 100644 --- a/skins/larry/mail.css +++ b/skins/larry/mail.css @@ -624,6 +624,20 @@ html.chrome #messagelist tr td.threads { /**** message view ****/ +#mailpreviewframe { + display: none; + position: absolute; + top: 0; + left: 0; + width: 100%; + bottom: 28px; +} + +#messagecontframe { + border: 0; + border-radius: 4px 4px 0 0; +} + #messagecontent { position: absolute; top: 140px; @@ -636,6 +650,7 @@ html.chrome #messagelist tr td.threads { #messageheader, #partheader { + position: relative; padding: 3px 0; background: #fff; background: -moz-linear-gradient(top, #fff 0%, #e9e9e9 100%); @@ -654,6 +669,15 @@ h2.subject { text-overflow: ellipsis; } +h3.subject { + font-size: 14px; + margin: 0 8em 0 0; + padding: 8px 8px 4px 8px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + .headers-table td { color: #666; padding: 2px 8px; @@ -694,6 +718,21 @@ h2.subject { height: 13px; } +#messagepreviewheader { + margin: 0 8px; + padding-bottom: 8px; + border-bottom: 2px solid #f0f0f0; +} + +#messagepreviewheader .headers-table { + margin: 0 -8px; +} + +#messagepreviewheader h3.subject { + padding-left: 0; +} + +#messagepreviewheader #countcontrols, #messageheader #countcontrols { position: absolute; top: 8px; @@ -709,11 +748,13 @@ h2.subject { white-space: nowrap; } -#messagecontent .leftcol { +#messagecontent .leftcol, +#messagepreview .leftcol { margin-right: 250px; } -#messagecontent .rightcol { +#messagecontent .rightcol, +#messagepreview .rightcol { float: right; /* position: absolute; @@ -728,7 +769,6 @@ h2.subject { padding: 8px; } - #messagebody { margin: 8px; } @@ -738,7 +778,9 @@ h2.subject { margin: 8px; } -#message-objects div.notice { +#message-objects div.notice, +#message-buttons div.notice { + display: block; color: #960; border: 1px solid #ffdf0e; background-color: #fef893; @@ -760,18 +802,13 @@ h2.subject { div.message-part, div.message-htmlpart { padding: 10px 2px; - border-top: 1px solid #ccc; + border-top: 2px solid #f0f0f0; } #messagebody div:first-child { border-top: 0; } -div.message-part a, -div.message-htmlpart a { - color: #0000CC; -} - div.message-part pre, div.message-htmlpart pre, div.message-part div.pre { @@ -812,7 +849,7 @@ div.message-part blockquote blockquote blockquote { color: #fff; background: #fff; border: 0; - border-bottom: 2px dotted #ccc; + border-bottom: 2px solid #f0f0f0; } #messagebody > p > img { diff --git a/skins/larry/settings.css b/skins/larry/settings.css index ccb96c0ca..5f27ae7ac 100644 --- a/skins/larry/settings.css +++ b/skins/larry/settings.css @@ -145,6 +145,7 @@ background-position: 6px -550px; } +#folderslist, #identitieslist { position: absolute; top: 0; @@ -153,6 +154,7 @@ bottom: 0; } +#folder-details, #identity-details { position: absolute; top: 0; @@ -161,3 +163,14 @@ bottom: 0; } +#subscription-table tr.root td { + font-size: 5%; + height: 5px; + padding: 2px; +} + +#subscription-table td.subscribed { + padding: 3px 12px 3px 3px; + text-align: right; +} + diff --git a/skins/larry/styles.css b/skins/larry/styles.css index 0b9e1b49c..3746ee3c2 100644 --- a/skins/larry/styles.css +++ b/skins/larry/styles.css @@ -213,25 +213,45 @@ input.button:active { background: linear-gradient(top, #bababa 0%, #d8d8d8 100%); } +.pagenav a.button { + padding: 1px 3px; +} + .pagenav a.button span.inner { display: inline-block; - width: 12px; - height: 12px; + width: 16px; + height: 13px; text-indent: 1000px; overflow: hidden; - background: url(images/buttons.png) -8px -211px no-repeat; + background: url(images/buttons.png) -6px -211px no-repeat; } .pagenav a.prevpage span.inner { - background-position: -8px -226px; + background-position: -7px -226px; } .pagenav a.nextpage span.inner { - background-position: -30px -226px; + background-position: -28px -226px; } .pagenav a.lastpage span.inner { - background-position: -30px -211px; + background-position: -28px -211px; +} + +.pagenav a.pageup span.inner { + background-position: -7px -256px; +} + +.pagenav a.pagedown span.inner { + background-position: -29px -256px; +} + +.pagenav a.viewsource span.inner { + background-position: -7px -271px; +} + +.pagenav a.extwin span.inner { + background-position: -29px -271px; } .pagenav .countdisplay { @@ -270,7 +290,7 @@ a.iconbutton.reset { #message-objects div.notice { color: #555; font-weight: bold; - padding: 6px 40px 6px 25px; + padding: 6px 30px 6px 25px; display: inline-block; white-space: nowrap; background: url(images/messages.png) 0 5px no-repeat; @@ -311,6 +331,9 @@ a.iconbutton.reset { background: -o-linear-gradient(top, #eaeaea 0%, #c8c8c8 100%); background: -ms-linear-gradient(top, #eaeaea 0%, #c8c8c8 100%); background: linear-gradient(top, #eaeaea 0%, #c8c8c8 100%); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } @@ -530,8 +553,8 @@ a.iconbutton.reset { .listbox .tablink, .listing tbody td, .listing li { - font-size: 11px; display: block; + font-size: 11px; border-top: 1px solid #fff; border-bottom: 1px solid #bbd3da; cursor: default; @@ -551,6 +574,10 @@ a.iconbutton.reset { white-space: nowrap; } +.listing tbody td { + display: table-cell; +} + .listbox .listitem.selected, .listbox .tablink.selected, .listing tbody tr.selected td, @@ -570,7 +597,8 @@ ul.listing li { background-color: #d9ecf4; } -ul.listing li.droptarget { +ul.listing li.droptarget, +table.listing tr.droptarget td { background-color: #c7e3ef; } @@ -611,11 +639,11 @@ table.listing { } .boxfooter .listbutton.add .inner { - background-position: 8px -1210px; + background-position: 10px -1210px; } .boxfooter .listbutton.groupactions .inner { - background-position: 4px -1292px; + background-position: 5px -1292px; } .centerbox { @@ -641,6 +669,10 @@ body.iframe { margin: 38px 0 20px 0; } +body.iframe.fullheight { + margin: 0; +} + .contentbox .boxtitle, body.iframe .boxtitle { color: #777; @@ -687,7 +719,13 @@ body.iframe .boxtitle { display: block; font-size: 14px; font-weight: bold; - margin-bottom: 10px; + padding-bottom: 10px; + margin-bottom: 0; +} + +.propform fieldset fieldset legend { + color: #666; + font-size: 12px; } table.propform { @@ -1004,9 +1042,9 @@ ul.toolbarmenu li label { #rcmdraglayer { - min-width: 300px; + min-width: 260px; width: auto !important; - width: 300px; + width: 260px; padding: 6px 8px; background: #444; border: 1px solid #555; diff --git a/skins/larry/templates/folderedit.html b/skins/larry/templates/folderedit.html new file mode 100644 index 000000000..cfc8bc3d4 --- /dev/null +++ b/skins/larry/templates/folderedit.html @@ -0,0 +1,27 @@ + + + +<roundcube:object name="pagetitle" /> + + + + +

+ +
+ +
+ +
+
+ + + " class="button" onclick="history.back()" />  + +
+
+ + + + + diff --git a/skins/larry/templates/folders.html b/skins/larry/templates/folders.html new file mode 100644 index 000000000..385d2686f --- /dev/null +++ b/skins/larry/templates/folders.html @@ -0,0 +1,43 @@ + + + +<roundcube:object name="pagetitle" /> + + + + + + +
+ + + +
+

+
+ +
+
+ +
+
+ +
+ + +
+ +
+ +
+
    +
    • +
    • + +
+
+ + + + + diff --git a/skins/larry/templates/identityedit.html b/skins/larry/templates/identityedit.html index bfdf61d81..147098286 100644 --- a/skins/larry/templates/identityedit.html +++ b/skins/larry/templates/identityedit.html @@ -30,7 +30,7 @@

- +

diff --git a/skins/larry/templates/mail.html b/skins/larry/templates/mail.html index cbaf740f8..88b7c5840 100644 --- a/skins/larry/templates/mail.html +++ b/skins/larry/templates/mail.html @@ -3,6 +3,14 @@ <roundcube:object name="pagetitle" /> + + @@ -74,8 +82,9 @@
-
+
+
@@ -105,7 +114,7 @@
-
    +
      • diff --git a/skins/larry/templates/messagepreview.html b/skins/larry/templates/messagepreview.html new file mode 100644 index 000000000..2ea007f2c --- /dev/null +++ b/skins/larry/templates/messagepreview.html @@ -0,0 +1,40 @@ + + + +<roundcube:object name="pagetitle" /> + + + + +
      +

      + + + + + + +
      + +
      +
      + +
      +
      + + +
      +
      + + + + + diff --git a/skins/larry/ui.js b/skins/larry/ui.js index 36a68938e..f2e230fc3 100644 --- a/skins/larry/ui.js +++ b/skins/larry/ui.js @@ -37,7 +37,7 @@ function rcube_mail_ui() // rcmail.addEventListener('aftersend-attachment', 'uploadmenu', rcmail_ui); // rcmail.addEventListener('aftertoggle-editor', 'resize_compose_body_ev', rcmail_ui); rcmail.gui_object('message_dragmenu', 'dragmessagemenu'); - $('#mailpreviewtoggle').click(function(e){ toggle_preview_pane(e); return false }); + $('#mailpreviewtoggle').addClass($('#mailpreviewframe').is(':visible') ? 'enabled' : 'closed').click(function(e){ toggle_preview_pane(e); return false }); $('#maillistmode').addClass(rcmail.env.threading ? '' : 'selected').click(function(e){ switch_view_mode('list'); return false }); $('#mailthreadmode').addClass(rcmail.env.threading ? 'selected' : '').click(function(e){ switch_view_mode('thread'); return false }); @@ -101,8 +101,8 @@ function rcube_mail_ui() $('#message-objects div a').addClass('button'); if (!$('#attachment-list li').length) { - $('#messagecontent div.rightcol').hide(); - $('#messagecontent .leftcol').css('margin-right', '0'); + $('div.rightcol').hide(); + $('div.leftcol').css('margin-right', '0'); } } @@ -189,12 +189,36 @@ function rcube_mail_ui() function toggle_preview_pane(e) { - var button = $(e.target); - var visible = !button.hasClass('enabled'); - + var button = $(e.target), + frame = $('#mailpreviewframe'), + visible = !frame.is(':visible'), + splitter = parseInt(bw.get_cookie('mailviewsplitter') || 320), + topstyles, bottomstyles, uid; + + frame.toggle(); button.removeClass().addClass(visible ? 'enabled' : 'closed'); -// rcmail.command('save-pref', { name:'preview_pane', value:(visible?1:0) }); + if (visible) { + topstyles = { height:(splitter-38)+'px', bottom:'auto' }; + bottomstyles = { top:(splitter+5)+'px', height:'auto' }; + rcmail.env.contentframe = 'messagecontframe'; + if (uid = rcmail.message_list.get_single_selection()) + rcmail.show_message(uid, false, true); + } + else { + topstyles = { height:'auto', bottom:'28px' }; + bottomstyles = { top:'auto', height:'26px' }; + rcmail.env.contentframe = null; + rcmail.show_contentframe(false); + } + + $('#mailview-top').css(topstyles); + $('#mailview-bottom').css(bottomstyles); + + if (visible && uid && rcmail.message_list) + rcmail.message_list.scrollto(uid); + + rcmail.command('save-pref', { name:'preview_pane', value:(visible?1:0) }); }