More from Larry...

19 files changed, 1040 insertions, 61 deletions

diff --git a/skins/larry/images/addcontact.png b/skins/larry/images/addcontact.png
new file mode 100644
index 000000000..1d9c0a1d4
--- /dev/null
+++ b/skins/larry/images/addcontact.png
diff --git a/skins/larry/images/buttons.png b/skins/larry/images/buttons.png
index c86f211f2..54ebc8378 100644
--- a/skins/larry/images/buttons.png
+++ b/skins/larry/images/buttons.png
diff --git a/skins/larry/images/favicon.ico b/skins/larry/images/favicon.ico
new file mode 100644
index 000000000..b3bd18c12
--- /dev/null
+++ b/skins/larry/images/favicon.ico
diff --git a/skins/larry/images/filetypes.png b/skins/larry/images/filetypes.png
new file mode 100644
index 000000000..1ea4599f0
--- /dev/null
+++ b/skins/larry/images/filetypes.png
diff --git a/skins/larry/images/listicons.png b/skins/larry/images/listicons.png
index 08c098fe0..dcd214fc5 100644
--- a/skins/larry/images/listicons.png
+++ b/skins/larry/images/listicons.png
diff --git a/skins/larry/images/messages.png b/skins/larry/images/messages.png
index 07672a620..a5b1eb1d0 100644
--- a/skins/larry/images/messages.png
+++ b/skins/larry/images/messages.png
diff --git a/skins/larry/includes/footer.html b/skins/larry/includes/footer.html
new file mode 100644
index 000000000..f884bdf82
--- /dev/null
+++ b/skins/larry/includes/footer.html
@@ -0,0 +1,10 @@
+<script type="text/javascript">
+
+// UI startup
+var UI = new rcube_mail_ui();
+$(document).ready(function(){
+	UI.init();
+});
+
+</script>
+
diff --git a/skins/larry/includes/links.html b/skins/larry/includes/links.html
index 1dba9f1cd..d2426aee4 100644
--- a/skins/larry/includes/links.html
+++ b/skins/larry/includes/links.html
@@ -5,3 +5,4 @@
 <roundcube:endif />
 <!--[if lte IE 8]><link rel="stylesheet" type="text/css" href="/iehacks.css" /><![endif]-->
 <!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="/ie6hacks.css" /><![endif]-->
+<script type="text/javascript" src="/ui.js"></script>
\ No newline at end of file
diff --git a/skins/larry/includes/mailtoolbar.html b/skins/larry/includes/mailtoolbar.html
index e97e135f5..09a6f81c1 100644
--- a/skins/larry/includes/mailtoolbar.html
+++ b/skins/larry/includes/mailtoolbar.html
@@ -1,66 +1,57 @@
 <div id="mailtoolbar" class="toolbar">
 <roundcube:if condition="template:name == 'message'" />
-<roundcube:button command="list" type="link" class="button back disabled" classAct="button back" classSel="button back pressed" label="backtolist" />
+<roundcube:button command="list" type="link" class="button back disabled" classAct="button back" classSel="button back pressed" label="back" />
 <roundcube:else />
 <roundcube:button command="checkmail" type="link" class="button checkmail disabled" classAct="button checkmail" classSel="button checkmail pressed" label="checkmail" />
-<roundcube:endif />
 <roundcube:button command="compose" type="link" class="button compose disabled" classAct="button compose" classSel="button compose pressed" label="writenewmessage" />
+<roundcube:endif />
 <roundcube:button command="reply" type="link" class="button reply disabled" classAct="button reply" classSel="button reply pressed" label="replytomessage" />
 <span class="dropbutton">
 <roundcube:button command="reply-all" type="link" class="button reply-all disabled" classAct="button reply-all" classSel="button reply-all pressed" label="replytoallmessage" />
-<span id="replyallmenulink" onclick="rcmail_ui.show_popup('replyallmenu');return false"></span>
+<span class="dropbuttontip" id="replyallmenulink" onclick="UI.show_popup('replyallmenu');return false"></span>
 </span>
 <span class="dropbutton">
 <roundcube:button command="forward" type="link" class="button forward disabled" classAct="button forward" classSel="button forward pressed" label="forwardmessage" />
-<span id="forwardmenulink" onclick="rcmail_ui.show_popup('forwardmenu');return false"></span>
+<span class="dropbuttontip" id="forwardmenulink" onclick="UI.show_popup('forwardmenu');return false"></span>
 </span>
 <roundcube:button command="delete" type="link" class="button delete disabled" classAct="button delete" classSel="button delete pressed" label="deletemessage" />
 <roundcube:container name="toolbar" id="mailtoolbar" />
 <roundcube:if condition="template:name == 'mail'" />
-<roundcube:button name="markmenulink" id="markmenulink" type="link" class="button markmessage" label="markmessages" onclick="rcmail_ui.show_popup('markmenu');return false" />
-<roundcube:endif />
-<roundcube:button name="messagemenulink" id="messagemenulink" type="link" class="button more" label="moreactions" onclick="rcmail_ui.show_popup('messagemenu');return false" />
-<roundcube:if condition="template:name == 'message'" />
-<roundcube:object name="mailboxlist" type="select" noSelection="moveto" maxlength="25" onchange="rcmail.command('moveto', this.options[this.selectedIndex].value)" class="mboxlist" folder_filter="mail" />
+<roundcube:button name="markmenulink" id="markmessagemenulink" type="link" class="button markmessage" label="markmessages" onclick="UI.show_popup('markmessagemenu');return false" />
 <roundcube:endif />
+<roundcube:button name="messagemenulink" id="messagemenulink" type="link" class="button more" label="moreactions" onclick="UI.show_popup('messagemenu');return false" />
 </div>
 
 <div id="forwardmenu" class="popupmenu">
 	<ul class="toolbarmenu">
-		<li class="block">
-			<input type="radio" name="forwardtype" value="0" onchange="rcmail.command('save-pref', {name: 'forward_attachment', value: 0, env: 'forward_attachment'});" />
-			<roundcube:button command="forward" label="forwardinline" prop="sub" classAct="forwardlink active" class="forwardlink" />
-		</li>
-		<li class="block">
-			<input type="radio" name="forwardtype" value="1" onchange="rcmail.command('save-pref', {name: 'forward_attachment', value: 1, env: 'forward_attachment'})" />
-			<roundcube:button command="forward-attachment" label="forwardattachment" prop="sub" classAct="forwardattachmentlink active" class="forwardattachmentlink" />
-		</li>
+		<li><roundcube:button command="forward" label="forwardinline" prop="sub" classAct="forwardlink active" class="forwardlink" /></li>
+		<li><roundcube:button command="forward-attachment" label="forwardattachment" prop="sub" classAct="forwardattachmentlink active" class="forwardattachmentlink" /></li>
 		<roundcube:container name="forwardmenu" id="forwardmenu" />
 	</ul>
 </div>
 
 <div id="replyallmenu" class="popupmenu">
-	<ul>
-		<li><roundcube:button command="reply-all" label="replyall" prop="sub" classAct="replyalllink active" class="replyalllink" /></li>
-		<li><roundcube:button command="reply-list" label="replylist" prop="sub" classAct="replylistlink active" class="replylistlink" /></li>
+	<ul class="toolbarmenu">
+		<li><roundcube:button command="reply-all" label="replyall" prop="sub" class="replyalllink" classAct="replyalllink active" /></li>
+		<li><roundcube:button command="reply-list" label="replylist" prop="sub" class="replylistlink" classAct="replylistlink active" /></li>
 		<roundcube:container name="replyallmenu" id="replyallmenu" />
 	</ul>
 </div>
 
 <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>
-	<li><roundcube:button class="editlink" command="edit" label="editasnew" classAct="editlink active" /></li>
-	<li class="separator_below"><roundcube:button class="sourcelink" command="viewsource" label="viewsource" classAct="sourcelink active" /></li>
-	<li><roundcube:button class="openlink" command="open" label="openinextwin" target="_blank" classAct="openlink active" /></li>
+  <ul class="toolbarmenu iconized">
+	<li><roundcube:button command="print" label="printmessage" class="printlink" classAct="printlink active" /></li>
+	<li><roundcube:button command="download" label="emlsave" class="downloadlink" classAct="downloadlink active" /></li>
+	<li><roundcube:button command="edit" label="editasnew" class="editlink" classAct="editlink active" /></li>
+	<li><roundcube:button command="viewsource" label="viewsource" class="sourcelink" classAct="sourcelink active" /></li>
+	<li><roundcube:button command="open" label="openinextwin" target="_blank" class="openlink" classAct="openlink active" /></li>
 	<roundcube:container name="messagemenu" id="messagemenu" />
   </ul>
 </div>
 
 <roundcube:if condition="template:name == 'mail'" />
 <div id="markmessagemenu" class="popupmenu">
-  <ul class="toolbarmenu">
+  <ul class="toolbarmenu iconized">
 	<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>
 	<li><roundcube:button command="mark" prop="flagged" label="markflagged" classAct="flaggedlink active" class="flaggedlink" /></li>
diff --git a/skins/larry/mail.css b/skins/larry/mail.css
index 8097a95ef..247873539 100644
--- a/skins/larry/mail.css
+++ b/skins/larry/mail.css
@@ -68,6 +68,10 @@
 	padding: 2px;
 }
 
+#messagelistfooter.rightalign {
+	text-align: right;
+}
+
 #messagelistfooter #countcontrols {
 	display: inline-block;
 }
@@ -160,22 +164,22 @@
 #mailboxlist li.mailbox div.collapsed,
 #mailboxlist li.mailbox div.expanded {
 	position: absolute;
-	top: 15px;
-	left: 21px;
-	width: 10px;
-	height: 10px;
-	background: url(images/listicons.png) -5px -146px no-repeat;
+	top: 14px;
+	left: 20px;
+	width: 14px;
+	height: 14px;
+	background: url(images/listicons.png) -3px -144px no-repeat;
 	cursor: pointer;
 }
 
 #mailboxlist li.mailbox div.expanded {
-	background-position: -5px -170px;
+	background-position: -3px -168px;
 }
 
 #mailboxlist li.mailbox ul li div.collapsed,
 #mailboxlist li.mailbox ul li div.expanded {
-	left: 46px;
-	top: 16px;
+	left: 45px;
+	top: 15px;
 }
 
 #mailboxlist li.mailbox .unreadcount {
@@ -185,11 +189,11 @@
 	width: 2.8em;
 	padding: 2px;
 	background: #82acb5;
-	background: -moz-linear-gradient(left, #82acb5 0%, #6a939f 100%);
-	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#82acb5), color-stop(100%,#6a939f));
-	background: -o-linear-gradient(left, #82acb5 0%, #6a939f 100%);
-	background: -ms-linear-gradient(left, #82acb5 0%, #6a939f 100%);
-	background: linear-gradient(left, #82acb5 0%, #6a939f 100%);
+	background: -moz-linear-gradient(top, #82acb5 0%, #6a939f 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#82acb5), color-stop(100%,#6a939f));
+	background: -o-linear-gradient(top, #82acb5 0%, #6a939f 100%);
+	background: -ms-linear-gradient(top, #82acb5 0%, #6a939f 100%);
+	background: linear-gradient(top, #82acb5 0%, #6a939f 100%);
 	box-shadow: inset 0 1px 1px 0 #536d72;
 	-o-box-shadow: inset 0 1px 1px 0 #536d72;
 	-webkit-box-shadow: inset 0 1px 1px 0 #536d72;
@@ -203,11 +207,11 @@
 
 #mailboxlist li.mailbox.selected .unreadcount {
 	background: #005d76;
-	background: -moz-linear-gradient(left, #005d76 0%, #004558 100%);
-	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#005d76), color-stop(100%,#004558));
-	background: -o-linear-gradient(left, #005d76 0%, #004558 100%);
-	background: -ms-linear-gradient(left, #005d76 0%, #004558 100%);
-	background: linear-gradient(left, #005d76 0%, #004558 100%);
+	background: -moz-linear-gradient(top, #005d76 0%, #004558 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#005d76), color-stop(100%,#004558));
+	background: -o-linear-gradient(top, #005d76 0%, #004558 100%);
+	background: -ms-linear-gradient(top, #005d76 0%, #004558 100%);
+	background: linear-gradient(top, #005d76 0%, #004558 100%);
 	box-shadow: inset 0 1px 1px 0 #003645;
 	-o-box-shadow: inset 0 1px 1px 0 #003645;
 	-webkit-box-shadow: inset 0 1px 1px 0 #003645;
@@ -218,15 +222,42 @@
 	width: 16em;
 }
 
+#mailview-left select.mailboxlist {
+	position: relative;
+	top: 10px;
+	width: 100%;
+}
+
 #messagetoolbar {
 	position: absolute;
 	top: -6px;
 	right: 0;
 	left: 15em;
 	height: 40px;
+}
+
+#messagetoolbar.fullwidth {
+	left: 0;
+}
+
+#mailtoolbar {
 	text-align: right;
 }
 
+#mailpreviewtoggle {
+	display: block;
+	position: absolute;
+	top: 4px;
+	right: 2px;
+	width: 20px;
+	height: 18px;
+	background: url(images/buttons.png) -5px -318px no-repeat;
+}
+
+#mailpreviewtoggle.enabled {
+	background-position: -28px -318px;
+}
+
 
 /*** message list ***/
 
@@ -563,3 +594,241 @@ html.chrome #messagelist tr td.threads {
 	width: 15px;
 /*	background: url(images/tree.gif) 0px 0px no-repeat; */
 }
+
+
+/**** message view ****/
+
+#messagecontent {
+	position: absolute;
+	top: 140px;
+	left: 0;
+	width: 100%;
+	bottom: 32px;
+	overflow: auto;
+}
+
+#messageheader,
+#partheader {
+	padding: 3px 0;
+	background: #fff;
+	background: -moz-linear-gradient(top, #fff 0%, #f0f0f0 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(100%,#f0f0f0));
+	background: -o-linear-gradient(top, #fff 0%, #f0f0f0 100%);
+	background: -ms-linear-gradient(top, #fff 0%, #f0f0f0 100%);
+	background: linear-gradient(top, #fff 0%, #f0f0f0 100%);
+}
+
+.headers-table td {
+	color: #666;
+	padding: 2px 8px;
+	font-size: 11px;
+}
+
+.headers-table td.header {
+	font-weight: bold;
+}
+
+.headers-table td.header a {
+	color: #666;
+	text-decoration: none;
+}
+
+.headers-table td.header a:hover {
+	text-decoration: underline;
+}
+
+.headers-table td.subject {
+	color: #333;
+	font-size: 110%;
+	font-weight: bold;
+}
+
+.rcmaddcontact {
+	position: relative;
+	top: 1px;
+	margin-left: 0.5em;
+}
+
+#messagecontent .leftcol {
+	margin-right: 250px;
+}
+
+#messagecontent .rightcol {
+	float: right;
+/*
+	position: absolute;
+	top: 10px;
+	right: 10px;
+	height: 90%;
+*/
+	width: 230px;
+	margin: 8px;
+	min-height: 200px;
+	background: #f0f0f0;
+	padding: 8px;
+}
+
+
+#messagebody {
+	margin: 8px;
+}
+
+#message-objects div,
+#messagebody span.part-notice {
+	margin: 8px;
+}
+
+#message-objects div.notice {
+	color: #960;
+	border: 1px solid #ffdf0e;
+	background-color: #fef893;
+	background-position: 5px -24px;
+	padding: 6px 12px 4px 30px;
+}
+
+#message-objects div a.button,
+#messagebody span.part-notice a.button {
+	font-size: 11px;
+	margin-left: 10px;
+	border: 1px solid #ccc;
+	box-shadow: 0 1px 1px 0 #e8e386;
+	-o-box-shadow: 0 1px 1px 0 #e8e386;
+	-webkit-box-shadow: 0 1px 1px 0 #e8e386;
+	-moz-box-shadow: 0 1px 1px 0 #e8e386;
+}
+
+div.message-part,
+div.message-htmlpart {
+	padding: 10px 8px;
+	border-top: 1px solid #ccc;
+}
+
+#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 {
+	margin: 0px;
+	padding: 0px;
+	font-family: monospace;
+	white-space: -moz-pre-wrap !important;
+	white-space: pre-wrap !important;
+	white-space: pre;
+}
+
+div.message-part span.sig {
+	color: #666666;
+}
+
+div.message-part blockquote {
+	color: blue;
+	border-left: 2px solid blue;
+	border-right: 2px solid blue;
+	background-color: #F6F6F6;
+	margin: 2px 0px 2px 0px;
+	padding: 1px 8px 1px 10px;
+}
+
+div.message-part blockquote blockquote {
+	color: green;
+	border-left: 2px solid green;
+	border-right: 2px solid green;
+}
+
+div.message-part blockquote blockquote blockquote {
+	color: #990000;
+	border-left: 2px solid #bb0000;
+	border-right: 2px solid #bb0000;
+}
+
+#messagebody > hr {
+	color: #fff;
+	background: #fff;
+	border: 0;
+	border-bottom: 2px dotted #ccc;
+}
+
+#messagebody > p > img {
+	max-width: 80%;
+}
+
+#attachment-list {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
+
+#attachment-list li {
+	display: block;
+	background: url(images/filetypes.png) 0 0 no-repeat;
+	margin-bottom: 1px;
+}
+
+#attachment-list li.pdf {
+	background-position: 0 -26px;
+}
+
+#attachment-list li.doc,
+#attachment-list li.msword {
+	background-position: 0 -52px;
+}
+
+#attachment-list li.xls,
+#attachment-list li.msexcel {
+	background-position: 0 -78px;
+}
+
+#attachment-list li.zip,
+#attachment-list li.gz {
+	background-position: 0 -104px;
+}
+
+#attachment-list li.image {
+	background-position: 0 -130px;
+}
+
+#attachment-list li.audio {
+	background-position: 0 -156px;
+}
+
+#attachment-list li.video {
+	background-position: 0 -182px;
+}
+
+
+#attachment-list li a {
+	display: block;
+	color: #333;
+	font-size: 11px;
+	font-weight: bold;
+	padding: 8px 4px 3px 30px;
+	text-shadow: 1px 1px 1px #fff;
+	text-decoration: none;
+	white-space: nowrap;
+}
+
+#attachment-list li a:hover {
+	text-decoration: underline;
+}
+
+#messagepartcontainer {
+	position: absolute;
+	top: 60px;
+	left: 0px;
+	right: 0px;
+	bottom: 0px;
+}
+
+
+#messagepartframe {
+	border: 0;
+}
\ No newline at end of file
diff --git a/skins/larry/print.css b/skins/larry/print.css
new file mode 100644
index 000000000..97545a557
--- /dev/null
+++ b/skins/larry/print.css
@@ -0,0 +1,126 @@
+/**
+ * Roundcube webmail styles for message printing
+ *
+ * Copyright (c) 2011, The Roundcube Dev Team
+ *
+ * The contents are subject to the Creative Commons Attribution-ShareAlike
+ * License. It is allowed to copy, distribute, transmit and to adapt the work
+ * by keeping credits to the original autors in the README file.
+ * See http://creativecommons.org/licenses/by-sa/3.0/ for details.
+ *
+ * $Id$
+ */
+body {
+	font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
+	background-color: #fff;
+	color: #000;
+	margin: 2mm;
+}
+
+body, td, th, span, div, p {
+	font-size: 9pt;
+	color: #000;
+}
+
+h3 {
+	font-size: 18px;
+	color: #000;
+}
+
+a, a:active, a:visited {
+	color: #000;
+}
+
+#header {
+	float: right;
+	margin: 0 5mm 3mm 5mm;
+}
+
+table.headers-table {
+	table-layout: fixed;
+	margin-top: 14px;
+}
+
+table.headers-table tr td {
+	font-size: 9pt;
+}
+
+table.headers-table td.header-title {
+	color: #666;
+	font-size: 85%;
+	padding-right: 4mm;
+	white-space: nowrap;
+}
+
+table.headers-table tr td.subject {
+	width: 90%;
+	font-weight: bold;
+	font-size: 120%;
+}
+	
+#attachment-list {
+	margin-top: 3mm;
+	padding-top: 3mm;
+	border-top: 1pt solid #ccc;
+}
+
+#attachment-list li {
+	font-size: 9pt;
+}
+
+#attachment-list li a {
+	text-decoration: none;
+}
+
+#attachment-list li a:hover {
+	text-decoration: underline;
+}
+
+#messagebody {
+	margin-top: 5mm;
+	border-top: none;
+}
+
+div.message-part {
+	padding: 2mm;
+	margin-top: 5mm;
+	margin-bottom: 5mm;
+	border-top: 1pt solid #ccc;
+}
+
+div.message-part a {
+	color: #00c;
+}
+
+div.message-part pre,
+div.message-htmlpart pre,
+div.message-part div.pre {
+	margin: 0;
+	padding: 0;
+	font-family: monospace;
+	white-space: -moz-pre-wrap !important;
+	white-space: pre-wrap !important;
+	white-space: pre;
+	word-wrap: break-word; /* IE (and Safari) */
+}
+
+div.message-part blockquote {
+	color: blue;
+	border-left: 2px solid blue;
+	border-right: 2px solid blue;
+	background-color: #F6F6F6;
+	margin: 0.5em 0em 0.5em 0em;
+	padding: 0.25em 1em 0.25em 1em;
+}
+
+div.message-part blockquote blockquote {
+	color: green;
+	border-left: 2px solid green;
+	border-right: 2px solid green;
+}
+
+div.message-part blockquote blockquote blockquote {
+	color: #900;
+	border-left: 2px solid #b00;
+	border-right: 2px solid #b00;
+}
diff --git a/skins/larry/styles.css b/skins/larry/styles.css
index d251adb8e..ebfe63e04 100644
--- a/skins/larry/styles.css
+++ b/skins/larry/styles.css
@@ -157,7 +157,8 @@ a.button.disabled span.inner {
 	opacity: 0.4;
 }
 
-a.button.pressed {
+a.button.pressed,
+a.button:active {
 	background: #e6e6e6;
 	background: -moz-linear-gradient(top, #e6e6e6 0%, #f9f9f9 100%);
 	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e6e6e6), color-stop(100%,#f9f9f9));
@@ -190,7 +191,8 @@ a.button.pressed {
 	display: inline-block;
 	width: 12px;
 	height: 12px;
-	text-indent: -1000px;
+	text-indent: 1000px;
+	overflow: hidden;
 	background: url(images/buttons.png) -8px -211px no-repeat;
 }
 
@@ -209,6 +211,7 @@ a.button.pressed {
 .pagenav .countdisplay {
 	display: inline-block;
 	padding:0 0.5em;
+	font-size: 11px;
 	text-shadow: 1px 1px 1px #fff;
 	min-width: 20em;
 }
@@ -222,11 +225,11 @@ a.iconbutton {
 }
 
 a.iconbutton.searchoptions {
-	background-position: -2px -304px;
+	background-position: -2px -337px;
 }
 
 a.iconbutton.reset {
-	background-position: -25px -303px;
+	background-position: -25px -337px;
 }
 
 
@@ -236,7 +239,8 @@ a.iconbutton.reset {
 #message div.warning,
 #message div.error,
 #message div.notice,
-#message div.confirmation {
+#message div.confirmation,
+#message-objects div.notice {
 	color: #555;
 	font-weight: bold;
 	padding: 6px 40px 6px 25px;
@@ -312,6 +316,11 @@ a.iconbutton.reset {
 	text-decoration: none;
 }
 
+#topline a:hover,
+#topnav a:hover {
+	text-decoration: underline;
+}
+
 #toplogo {
 	padding-top: 2px;
 }
@@ -324,6 +333,11 @@ a.iconbutton.reset {
 	float: right;
 }
 
+.closelink {
+	display: inline-block;
+	padding: 2px 10px 2px 20px;
+}
+
 #topline span.username {
 	padding-right: 1em;
 }
@@ -340,6 +354,7 @@ a.iconbutton.reset {
 	color: #fff;
 }
 
+
 /*** taskbar ***/
 
 #taskbar a {
@@ -437,6 +452,10 @@ a.iconbutton.reset {
 	overflow: auto;
 }
 
+.listbox .scroller.wfooter {
+	bottom: 42px;
+}
+
 .listbox .boxtitle + .scroller {
 	top: 34px;
 }
@@ -499,6 +518,41 @@ table.listing {
 	border-spacing: 0;
 }
 
+.listbox .boxfooter {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	width: 100%;
+	height: 42px;
+	border-top: 1px solid #ccdde4;
+	background: #d9ecf4;
+	-webkit-box-shadow: inset 0 1px 0 0 #fff;
+	-moz-box-shadow: inset 0 1px 0 0 #fff;
+	box-shadow: inset 0 1px 0 0 #fff;
+}
+
+.boxfooter .listbutton {
+	display: inline-block;
+	text-decoration: none;
+	width: 48px;
+	border-right: 1px solid #fff;
+	background: #c7e3ef;
+	padding: 3px 0;
+	margin-top: 1px;
+}
+
+.boxfooter .listbutton .inner {
+	display: inline-block;
+	width: 48px;
+	height: 35px;
+	text-indent: -1000px;
+	background: url(images/buttons.png) -1000px 0 no-repeat;
+}
+
+.boxfooter .listbutton.groupactions .inner {
+	background-position: 4px -1212px;
+}
+
 .errobox h3 {
 	font-size: 16px;
 	margin-top: 0;
@@ -714,40 +768,130 @@ table.propform td.title {
 	opacity: 0.5;
 }
 
+.dropbutton {
+	display: inline-block;
+	position: relative;
+}
+
+.dropbutton .dropbuttontip {
+	display: block;
+	position: absolute;
+	right: 2px;
+	top: 0;
+	height: 42px;
+	width: 18px;
+	background: url(images/buttons.png) -24px -1049px no-repeat;
+	cursor: pointer;
+}
+
+.dropbutton .dropbuttontip:hover {
+	background-position: 0 -1049px;
+}
+
+.toolbar a.button.back {
+	background-position: 0 -370px;
+}
+
 .toolbar a.button.checkmail {
-	background-position: center -370px;
+	background-position: center -410px;
 }
 
 .toolbar a.button.compose {
-	background-position: center -410px;
+	background-position: center -450px;
 }
 
 .toolbar a.button.reply {
-	background-position: center -450px;
+	background-position: center -490px;
 }
 
 .toolbar a.button.reply-all {
-	background-position: center -490px;
+	background-position: center -530px;
 }
 
 .toolbar a.button.forward {
-	background-position: center -530px;
+	background-position: center -570px;
 }
 
 .toolbar a.button.delete {
-	background-position: center -570px;
+	background-position: center -610px;
 }
 
 .toolbar a.button.markmessage,
 .toolbar a.button.more {
-	background-position: center -730px;
+	background-position: center -770px;
 }
 
 /*** popup menus ***/
 
 .popupmenu {
 	display: none;
+	position: absolute;
+	top: 32px;
+	left: 90px;
+	width: auto;
+	background: #444;
+	border: 1px solid #999;
+	z-index: 240;
+	border-radius: 4px;
+	box-shadow: 0 2px 6px 0 #333;
+	-moz-box-shadow: 0 2px 6px 0 #333;
+	-webkit-box-shadow: 0 2px 6px 0 #333;
+	-o-box-shadow: 0 2px 6px 0 #333;
+}
+
+ul.toolbarmenu {
+	margin: 0;
+	padding: 0;
+	list-style: none;
+}
+
+ul.toolbarmenu li {
+	color: #fff;
+	font-size: 11px;
+	white-space: nowrap;
+	min-width: 130px;
+	margin: 0;
+	border-top: 1px solid #5a5a5a;
+	border-bottom: 1px solid #333;
 }
 
+ul.toolbarmenu li:first-child {
+	border-top: 0;
+}
 
+ul.toolbarmenu li:last-child {
+	border-bottom: 0;
+}
 
+ul.toolbarmenu li a {
+	display: block;
+	color: #666;
+	text-shadow: 1px 1px 1px #333;
+	text-decoration: none;
+	min-height: 14px;
+	padding: 6px 10px 6px 10px;
+}
+
+ul.toolbarmenu li a.active {
+	color: #fff;
+}
+
+ul.toolbarmenu li a.active:hover {
+	background-color: #00aad6;
+	background: -moz-linear-gradient(top, #00aad6 0%, #008fc9 100%);
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00aad6), color-stop(100%,#008fc9));
+	background: -o-linear-gradient(top, #00aad6 0%, #008fc9 100%);
+	background: -ms-linear-gradient(top, #00aad6 0%, #008fc9 100%);
+	background: linear-gradient(top, #00aad6 0%, #008fc9 100%);
+}
+
+ul.toolbarmenu.iconized li a {
+	padding-left: 28px;
+}
+
+ul.toolbarmenu li label {
+	display: block;
+	color: #fff;
+	padding: 4px 8px;
+	text-shadow: 1px 1px 1px #333;
+}
diff --git a/skins/larry/templates/mail.html b/skins/larry/templates/mail.html
index 6a1164002..b6f333983 100644
--- a/skins/larry/templates/mail.html
+++ b/skins/larry/templates/mail.html
@@ -15,17 +15,17 @@
 <!-- search box -->
 <div id="quicksearchbar">
 <roundcube:object name="searchform" id="quicksearchbox" />
-<roundcube:button name="searchmenulink" id="searchmenulink" class="iconbutton searchoptions" _onclick="rcmail_ui.show_popup('searchmenu');return false" title="searchmod" content=" " />
+<roundcube:button name="searchmenulink" id="searchmenulink" class="iconbutton searchoptions" onclick="UI.show_popup('searchmenu');return false" title="searchmod" content=" " />
 <roundcube:button command="reset-search" id="searchreset" class="iconbutton reset" title="resetsearch" content=" " />
 </div>
 
 <!-- folders list -->
 <div id="mailboxcontainer" class="uibox listbox">
-<div class="scroller">
-<roundcube:object name="mailboxlist" id="mailboxlist"class="listing" folder_filter="mail" />
+<div class="scroller wfooter">
+<roundcube:object name="mailboxlist" id="mailboxlist"class="listing" folder_filter="mail" unreadwrap="%s" />
 </div>
 <div class="boxfooter">
-	<roundcube:button name="mailboxmenulink" id="mailboxmenulink" type="link" title="folderactions" class="listbutton groupactions" _onclick="rcmail_ui.show_popup('mailboxmenu');return false" content=" " />
+	<roundcube:button name="mailboxmenulink" id="mailboxmenulink" type="link" title="folderactions" class="listbutton groupactions" onclick="UI.show_popup('mailboxmenu');return false" innerClass="inner" content="&#9881;" />
 </div>
 </div>
 
@@ -66,12 +66,15 @@
 		<roundcube:button command="nextpage" type="link" class="button nextpage disabled" classAct="button nextpage" classSel="button nextpage pressed" innerClass="inner" title="nextpage" content="&amp;gt;" />
 		<roundcube:button command="lastpage" type="link" class="button lastpage disabled" classAct="button lastpage" classSel="button lastpage pressed" innerClass="inner" title="lastpage" content="&amp;gt;|" />
 	</div>
+
+	<a href="#preview" id="mailpreviewtoggle" title="<roundcube:label name='previewpane' />"></a>
 </div>
 
 </div><!-- end mailview-top -->
 
 <div id="mailview-bottom" class="uibox">
 <div id="mailpreviewframe">
+
 </div>
 
 <roundcube:object name="message" id="message" class="statusbar" />
@@ -82,6 +85,39 @@
 
 </div><!-- end mainscreen -->
 
+<div id="searchmenu" class="popupmenu">
+	<ul class="toolbarmenu">
+		<li><label><input type="checkbox" name="s_mods[]" value="subject" id="s_mod_subject" onclick="UI.set_searchmod(this)" /> <roundcube:label name="subject" /></label></li>
+		<li><label><input type="checkbox" name="s_mods[]" value="from" id="s_mod_from" onclick="UI.set_searchmod(this)" /> <roundcube:label name="from" /></label></li>
+		<li><label><input type="checkbox" name="s_mods[]" value="to" id="s_mod_to" onclick="UI.set_searchmod(this)" /> <roundcube:label name="to" /></label></li>
+		<li><label><input type="checkbox" name="s_mods[]" value="cc" id="s_mod_cc" onclick="UI.set_searchmod(this)" /> <roundcube:label name="cc" /></label></li>
+		<li><label><input type="checkbox" name="s_mods[]" value="bcc" id="s_mod_bcc" onclick="UI.set_searchmod(this)" /> <roundcube:label name="bcc" /></label></li>
+		<li><label><input type="checkbox" name="s_mods[]" value="text" id="s_mod_text" onclick="UI.set_searchmod(this)" /> <roundcube:label name="msgtext" /></label></li>
+	</ul>
+</div>
+
+<div id="dragmessagemenu" class="popupmenu">
+	<ul class="toolbarmenu">
+		<li><roundcube:button command="moveto" onclick="return rcmail.drag_menu_action('moveto')" label="move" classAct="active" /></li>
+		<li><roundcube:button command="copy" onclick="return rcmail.drag_menu_action('copy')" label="copy" classAct="active" /></li>
+	</ul>
+</div>
+
+<div id="mailboxmenu" class="popupmenu">
+	<ul class="toolbarmenu">
+		<li><roundcube:button command="expunge" type="link" label="compact" classAct="active" /></li>
+		<li class="separator_below"><roundcube:button command="purge" type="link" label="empty" classAct="active" /></li>
+		<li><roundcube:button command="folders" task="settings" type="link" label="managefolders" classAct="active" /></li>
+		<roundcube:container name="mailboxoptions" id="mailboxoptionsmenu" />
+	</ul>
+</div>
+
+
+<div id="listoptions" class="popupdialog">
+	
+</div>
+
+<roundcube:include file="/includes/footer.html" />
 
 </body>
 </html>
diff --git a/skins/larry/templates/message.html b/skins/larry/templates/message.html
new file mode 100644
index 000000000..9cb5928c2
--- /dev/null
+++ b/skins/larry/templates/message.html
@@ -0,0 +1,72 @@
+<roundcube:object name="doctype" value="html5" />
+<html>
+<head>
+<title><roundcube:object name="pagetitle" /></title>
+<roundcube:include file="/includes/links.html" />
+</head>
+<body>
+
+<roundcube:include file="/includes/header.html" />
+
+<div id="mainscreen">
+
+<div id="mailview-left">
+<roundcube:object name="mailboxlist" type="select" noSelection="moveto" maxlength="25" onchange="rcmail.command('moveto', this.options[this.selectedIndex].value)" class="mailboxlist" folder_filter="mail" />
+
+<!-- folders list -->
+<div id="mailboxcontainer" class="uibox listbox">
+<div class="scroller">
+<roundcube:object name="mailboxlist" id="mailboxlist"class="listing" folder_filter="mail" />
+</div>
+</div>
+
+</div>
+
+<div id="mailview-right">
+
+<!-- toolbar -->
+<div id="messagetoolbar" class="fullwidth">
+<roundcube:include file="/includes/mailtoolbar.html" />
+</div>
+
+<div id="mailview-top">
+<div id="messageheader" class="uibox">
+<roundcube:object name="messageHeaders" class="headers-table" addicon="/images/addcontact.png" />
+<roundcube:object name="messageFullHeaders" id="full-headers" />
+</div>
+
+<div id="messagecontent" class="uibox">
+<div class="rightcol">
+<roundcube:object name="messageAttachments" id="attachment-list" />
+</div>
+<div class="leftcol">
+<roundcube:object name="messageObjects" id="message-objects" />
+<roundcube:object name="messageBody" id="messagebody" />
+</div>
+</div>
+
+<!-- list footer -->
+<div id="messagelistfooter" class="rightalign">
+	<div id="countcontrols" class="pagenav">
+		<roundcube:object name="messageCountDisplay" class="countdisplay" />
+		<roundcube:button command="firstmessage" type="link" class="button firstpage disabled" classAct="button firstpage" classSel="button firstpage pressed" innerClass="inner" title="firstmessage" content="|&amp;lt;" />
+		<roundcube:button command="previousmessage" type="link" class="button prevpage disabled" classAct="button prevpage" classSel="button prevpage pressed" innerClass="inner" title="previousmessage" content="&amp;lt;" />
+		<roundcube:button command="nextmessage" type="link" class="button nextpage disabled" classAct="button nextpage" classSel="button nextpage pressed" innerClass="inner" title="nextmessage" content="&amp;gt;" />
+		<roundcube:button command="lastmessage" type="link" class="button lastpage disabled" classAct="button lastpage" classSel="button lastpage pressed" innerClass="inner" title="lastmessage" content="&amp;gt;|" />
+	</div>
+</div>
+
+</div><!-- end mailview-top -->
+
+<div id="mailview-bottom" class="uibox">
+<roundcube:object name="message" id="message" class="statusbar" />
+</div>
+
+</div><!-- end mailview-right -->
+
+</div><!-- end mainscreen -->
+
+<roundcube:include file="/includes/footer.html" />
+
+</body>
+</html>
diff --git a/skins/larry/templates/messagepart.html b/skins/larry/templates/messagepart.html
new file mode 100644
index 000000000..db078296f
--- /dev/null
+++ b/skins/larry/templates/messagepart.html
@@ -0,0 +1,36 @@
+<roundcube:object name="doctype" value="html5" />
+<html>
+<head>
+<title><roundcube:object name="pagetitle" /></title>
+<roundcube:include file="/includes/links.html" />
+</head>
+<body class="extwin">
+
+<div id="header">
+<div id="topline">
+	<div class="topright">
+		<a href="#close" class="closelink" onclick="self.close()"><roundcube:label name="close" /></a>
+	</div>
+</div>
+
+<div id="topnav">
+	<roundcube:object name="logo" src="/images/roundcube_logo.png" id="toplogo" border="0" alt="Logo" />
+</div>
+
+<br style="clear:both" />
+</div>
+
+<div id="mainscreen">
+
+<div id="partheader" class="uibox">
+<roundcube:object name="messagePartControls" class="headers-table" />
+</div>
+
+<div id="messagepartcontainer" class="uibox">
+<roundcube:object name="messagePartFrame" id="messagepartframe" style="width:100%; height:100%" />
+</div>
+
+</div>
+
+</body>
+</html>
diff --git a/skins/larry/templates/messageprint.html b/skins/larry/templates/messageprint.html
new file mode 100644
index 000000000..d01c70bcd
--- /dev/null
+++ b/skins/larry/templates/messageprint.html
@@ -0,0 +1,19 @@
+<roundcube:object name="doctype" value="html5" />
+<html>
+<head>
+<title><roundcube:object name="pagetitle" /></title>
+<link rel="shortcut icon" href="/images/favicon.ico"/>
+<link rel="stylesheet" type="text/css" href="/print.css" />
+</head>
+<body>
+
+<div id="header"><roundcube:object name="logo" src="/images/roundcube_logo.png" id="toplogo" border="0" alt="Logo" /></div>
+
+<div id="printmessageframe">
+<roundcube:object name="messageHeaders" class="headers-table" />
+<roundcube:object name="messageAttachments" id="attachment-list" />
+<roundcube:object name="messageBody" id="messagebody" showImages="false" />
+</div>
+
+</body>
+</html>
diff --git a/skins/larry/templates/settings.html b/skins/larry/templates/settings.html
index 83cfe1341..bd90ae38e 100644
--- a/skins/larry/templates/settings.html
+++ b/skins/larry/templates/settings.html
@@ -25,5 +25,7 @@
 
 </div>
 
+<roundcube:include file="/includes/footer.html" />
+
 </body>
 </html>
diff --git a/skins/larry/templates/settingsedit.html b/skins/larry/templates/settingsedit.html
index e058ec6be..9311af788 100644
--- a/skins/larry/templates/settingsedit.html
+++ b/skins/larry/templates/settingsedit.html
@@ -18,5 +18,7 @@
 </div>
 </div>
 
+<roundcube:include file="/includes/footer.html" />
+
 </body>
 </html>
diff --git a/skins/larry/ui.js b/skins/larry/ui.js
new file mode 100644
index 000000000..274b71b78
--- /dev/null
+++ b/skins/larry/ui.js
@@ -0,0 +1,271 @@
+/**
+ * Roundcube functions for default skin interface
+ */
+
+
+function rcube_mail_ui()
+{
+  var popups = {};
+  var popupconfig = {
+    forwardmenu:        { editable:1 },
+    searchmenu:         { editable:1, callback:searchmenu },
+    listoptions:        { editable:1 },
+    dragmessagemenu:    { sticky:1 },
+    groupmenu:          { above:1 },
+    mailboxmenu:        { above:1 },
+    composeoptionsmenu: { editable:1, overlap:1 },
+    // toggle: #1486823, #1486930
+    'attachment-form':  { editable:1, above:1, toggle:!bw.ie&&!bw.linux },
+    'upload-form':      { editable:1, toggle:!bw.ie&&!bw.linux }
+  };
+
+  var me = this;
+
+  // export public methods
+  this.init = init;
+  this.show_popup = show_popup;
+  this.set_searchmod = set_searchmod;
+
+  /**
+   *
+   */
+  function init()
+  {
+    if (rcmail.env.task == 'mail') {
+      rcmail.addEventListener('menu-open', function(){ show_popup('listoptions'); });
+      rcmail.addEventListener('menu-save', save_listoptions);
+//      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 });
+      
+      if (rcmail.env.action == 'show' || rcmail.env.action == 'preview') {
+        init_messageview();
+      }
+    }
+
+    $(document.body).bind('mouseup', function(e){
+      var config, obj, target = e.target;
+      for (var id in popups) {
+        obj = popups[id];
+        config = popupconfig[id];
+        if (obj.is(':visible')
+          && target.id != id+'link'
+          && !config.toggle
+          && (!config.editable || !target_overlaps(target, obj.get(0)))
+          && (!config.sticky || !rcube_mouse_is_over(e, obj.get(0)))
+        ) {
+          var myid = id+'';
+          window.setTimeout(function(){ show_popupmenu(myid, false) }, 10);
+        }
+      }
+    })
+    .bind('keyup', function(e){
+      if (e.keyCode == 27) {
+        for (var id in popups) {
+          if (popups[id].is(':visible'))
+            show_popup(id, false);
+        }
+      }
+    });
+  }
+
+  /**
+   * Adjust UI objects of the mail view screen
+   */
+  function init_messageview()
+  {
+    $('#messagecontent').css('top', ($('#messageheader').outerHeight() + 10) + 'px');
+    $('#message-objects div a').addClass('button');
+    
+    if (!$('#attachment-list li').length) {
+      $('#messagecontent div.rightcol').hide();
+      $('#messagecontent .leftcol').css('margin-right', '0');
+    }
+  }
+
+  /**
+   * Trigger for popup menus
+   */
+  function show_popup(popup, show, config)
+  {
+    // auto-register menu object
+    if (config || !popupconfig[popup])
+      popupconfig[popup] = $.extend(popupconfig[popup] || {}, config);
+
+    var visible = show_popupmenu(popup, show),
+      config = popupconfig[popup];
+    if (typeof config.callback == 'function')
+      config.callback(visible);
+  }
+
+  /**
+   * Show/hide a specific popup menu
+   */
+  function show_popupmenu(popup, show)
+  {
+    var obj = popups[popup],
+      config = popupconfig[popup],
+      ref = $('#'+popup+'link'),
+      above = config.above;
+
+    if (!obj) {
+      obj = popups[popup] = $('#'+popup);
+      obj.appendTo(document.body);  // move them to top for proper absolute positioning
+    }
+
+    if (!obj || !obj.length)
+      return false;
+
+    if (typeof show == 'undefined')
+      show = obj.is(':visible') ? false : true;
+    else if (config.toggle && show && obj.is(':visible'))
+      show = false;
+
+    if (show && ref) {
+      var parent = ref.parent(),
+        win = $(window),
+        pos;
+
+      if (parent.hasClass('dropbutton'))
+        ref = parent;
+
+      pos = ref.offset();
+      ref.offsetHeight = ref.outerHeight();
+      if (!above && pos.top + ref.offsetHeight + obj.height() > win.height())
+        above = true;
+      if (pos.left + obj.width() > win.width())
+        pos.left = win.width() - obj.width() - 12;
+
+      obj.css({ left:pos.left, top:(pos.top + (above ? -obj.height() : ref.offsetHeight)) });
+    }
+
+    obj[show?'show':'hide']();
+
+    // hide drop-down elements on buggy browsers
+    if (bw.ie6 && config.overlap) {
+      $('select').css('visibility', show?'hidden':'inherit');
+      $('select', obj).css('visibility', 'inherit');
+    }
+    
+    return show;
+  }
+
+  /**
+   *
+   */
+  function target_overlaps(target, elem)
+  {
+    while (target.parentNode) {
+      if (target.parentNode == elem)
+        return true;
+      target = target.parentNode;
+    }
+    return false;
+  }
+
+
+  function toggle_preview_pane(e)
+  {
+    var button = $(e.target);
+    var visible = !button.hasClass('enabled');
+    
+    button.removeClass().addClass(visible ? 'enabled' : 'closed');
+
+//    rcmail.command('save-pref', { name:'preview_pane', value:(visible?1:0) });
+  }
+
+
+  /**** popup callbacks ****/
+
+  function searchmenu(show)
+  {
+    if (show && rcmail.env.search_mods) {
+      var n, all,
+        obj = popups['searchmenu'],
+        list = $('input:checkbox[name="s_mods[]"]', obj),
+        mbox = rcmail.env.mailbox,
+        mods = rcmail.env.search_mods;
+
+      if (rcmail.env.task == 'mail') {
+        mods = mods[mbox] ? mods[mbox] : mods['*'];
+        all = 'text';
+      }
+      else {
+        all = '*';
+      }
+
+      if (mods[all])
+        list.map(function() {
+          this.checked = true;
+          this.disabled = this.value != all;
+        });
+      else {
+        list.prop('disabled', false).prop('checked', false);
+        for (n in mods)
+          $('#s_mod_' + n).prop('checked', true);
+      }
+    }
+  }
+
+
+  function save_listoptions()
+  {
+    show_popupmenu('listoptions', false);
+
+    var sort = $('input[name="sort_col"]:checked').val(),
+      ord = $('input[name="sort_ord"]:checked').val(),
+      thread = $('input[name="view"]:checked').val(),
+      cols = $('input[name="list_col[]"]:checked')
+        .map(function(){ return this.value; }).get();
+
+    rcmail.set_list_options(cols, sort, ord, thread == 'thread' ? 1 : 0);
+  }
+
+
+  function set_searchmod(elem)
+  {
+    var all, m, task = rcmail.env.task,
+      mods = rcmail.env.search_mods,
+      mbox = rcmail.env.mailbox;
+
+    if (!mods)
+      mods = {};
+
+    if (task == 'mail') {
+      if (!mods[mbox])
+        mods[mbox] = rcube_clone_object(mods['*']);
+      m = mods[mbox];
+      all = 'text';
+    }
+    else { //addressbook
+      m = mods;
+      all = '*';
+    }
+
+    if (!elem.checked)
+      delete(m[elem.value]);
+    else
+      m[elem.value] = 1;
+
+    // mark all fields
+    if (elem.value != all)
+      return;
+
+    $('input:checkbox[name="s_mods[]"]').map(function() {
+      if (this == elem)
+        return;
+
+      this.checked = true;
+      if (elem.checked) {
+        this.disabled = true;
+        delete m[this.value];
+      }
+      else {
+        this.disabled = false;
+        m[this.value] = 1;
+      }
+    });
+  }
+}
+