- UI unification

- Added button to hide/unhide the preview pane (#1484215)

1 files changed, 40 insertions, 32 deletions

diff --git a/skins/default/templates/mail.html b/skins/default/templates/mail.html
index 7a0cee129..5fcd45c70 100644
--- a/skins/default/templates/mail.html
+++ b/skins/default/templates/mail.html
@@ -46,6 +46,7 @@
 <div id="mailrightcontainer">
 <div id="mailrightcontent">
 <div id="mailcontframe">
+<div id="messagelistcontainer" class="boxlistcontent" style="top:0">
 <roundcube:object name="messages"
   id="messagelist"
   cellspacing="0"
@@ -63,48 +64,46 @@
   unreadchildrenIcon="" 
   optionsmenuIcon="/images/icons/columnpicker.gif" />
 </div>
-
-<roundcube:if condition="config:preview_pane == true" />
+<div class="boxfooter">
+    <div id="listcontrols" class="pagenav">
+        <span><roundcube:label name="select" />:&nbsp;</span>
+        <roundcube:button command="select-all" type="link" title="all" class="buttonPas all" classAct="button all" classSel="button allsel" content=" " />
+        <roundcube:button command="select-all" type="link" prop="page" title="currpage" class="buttonPas page" classAct="button page" classSel="button pagesel" content=" " />
+        <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=" " />
+        <roundcube:container name="listcontrols" id="listcontrols" />
+    <roundcube:if condition="env:threads" />
+        <span style="margin-left: 10px"><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:endif />
+        <span style="margin-left: 10px"><roundcube:label name="preview" />:&nbsp;</span>
+        <input type="checkbox" onclick="rcmail_ui.switch_preview_pane(this)"<roundcube:if condition="config:preview_pane == true" /> checked="checked"<roundcube:endif /> />
+    </div>
+    <div id="countcontrols" class="pagenav">
+        <roundcube:button command="lastpage" type="link" class="buttonPas lastpage" classAct="button lastpage" classSel="button lastpageSel" title="lastmessages" content=" " />
+        <roundcube:button command="nextpage" type="link" class="buttonPas nextpage" classAct="button nextpage" classSel="button nextpageSel" title="nextmessages" content=" " />
+        <roundcube:object name="messageCountDisplay" style="padding:0 .5em; float:right" />
+        <roundcube:button command="previouspage" type="link" class="buttonPas prevpage" classAct="button prevpage" classSel="button prevpageSel" title="previousmessages" content=" " />
+        <roundcube:button command="firstpage" type="link" class="buttonPas firstpage" classAct="button firstpage" classSel="button firstpageSel" title="firstmessages" content=" " />
+    </div>
+</div>
+</div>
 
 <script type="text/javascript">
   var mailviewsplit = new rcube_splitter({id:'mailviewsplitter', p1: 'mailcontframe', p2: 'mailpreviewframe', orientation: 'h', relative: true, start: 205});
+<roundcube:if condition="config:preview_pane == true" />
   rcmail.add_onload('mailviewsplit.init()');
+<roundcube:endif />
 </script>
 
-<div id="mailpreviewframe">
+<div id="mailpreviewframe"<roundcube:if condition="config:preview_pane != true" /> style="display:none"<roundcube:endif />>
 <roundcube:object name="messagecontentframe" id="messagecontframe" width="100%" height="100%" frameborder="0" src="/watermark.html" />
 </div>
-
-<roundcube:endif />
-</div>
-
-<div id="listcontrols">
-      <span><roundcube:label name="select" />:&nbsp;</span>
-      <roundcube:button command="select-all" type="link" title="all" class="buttonPas all" classAct="button all" classSel="button allsel" content=" " />
-      <roundcube:button command="select-all" type="link" prop="page" title="currpage" class="buttonPas page" classAct="button page" classSel="button pagesel" content=" " />
-      <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=" " />
-      <roundcube:container name="listcontrols" id="listcontrols" />
-<roundcube:if condition="env:threads" />
-      <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:endif />
-  <roundcube:if condition="env:quota" />
-  <span style="margin-left: 20px; margin-right: 5px"><roundcube:label name="quota" />:</span>
-  <roundcube:object name="quotaDisplay" display="image" width="100" height="14" id="quotadisplay" />
-  <roundcube:endif />
 </div>
 
-<div id="countcontrols" class="pagenav">
-    <roundcube:button command="lastpage" type="link" class="buttonPas lastpage" classAct="button lastpage" classSel="button lastpageSel" title="lastmessages" content=" " />
-    <roundcube:button command="nextpage" type="link" class="buttonPas nextpage" classAct="button nextpage" classSel="button nextpageSel" title="nextmessages" content=" " />
-    <roundcube:object name="messageCountDisplay" style="padding:0 .5em; float:right" />
-    <roundcube:button command="previouspage" type="link" class="buttonPas prevpage" classAct="button prevpage" classSel="button prevpageSel" title="previousmessages" content=" " />
-    <roundcube:button command="firstpage" type="link" class="buttonPas firstpage" classAct="button firstpage" classSel="button firstpageSel" title="firstmessages" content=" " />
-</div>
 
 </div>
 </div>
@@ -216,5 +215,14 @@
 </div>
 </div>
 
+<roundcube:if condition="env:quota" />
+<div id="quota">
+  <span style="margin-right: 5px"><roundcube:label name="quota" />:</span>
+  <roundcube:object name="quotaDisplay" display="image" width="100" height="14" id="quotadisplay" />
+</div>
+<roundcube:endif />
+
+<div id="rcmversion"><roundcube:object name="productname" /> <roundcube:object name="version" /></div>
+
 </body>
 </html>