Place folder namespace selector above search box. Adjust height after box is visible and real heights can be computed

4 files changed, 6 insertions, 4 deletions

diff --git a/skins/classic/templates/folders.html b/skins/classic/templates/folders.html
index ac824306f..4d709f8d2 100644
--- a/skins/classic/templates/folders.html
+++ b/skins/classic/templates/folders.html
@@ -24,12 +24,12 @@
     <a href="#folders" class="iconbutton search" title="<roundcube:label name='findfolders' />" tabindex="0"><roundcube:label name='findfolders' /></a>
 </div>
 <div class="listsearchbox">
+    <roundcube:object name="folderfilter" id="folderlist-filter" />
     <div class="searchbox" role="search">
         <input type="text" name="q" id="foldersearch" placeholder="<roundcube:label name='findfolders' />" />
         <a class="iconbutton searchicon"></a>
         <roundcube:button command="reset-foldersearch" id="folderlistsearch-reset" class="iconbutton reset" title="resetsearch" width="13" height="13" />
     </div>
-    <roundcube:object name="folderfilter" id="folderlist-filter" />
 </div>
 <div id="folderlist-content" class="boxlistcontent">
     <roundcube:object name="foldersubscription" form="subscriptionform" id="subscription-table"
diff --git a/skins/larry/settings.css b/skins/larry/settings.css
index b2779982c..51bf12f88 100644
--- a/skins/larry/settings.css
+++ b/skins/larry/settings.css
@@ -226,7 +226,7 @@
 
 .listsearchbox select {
 	width: 100%;
-	margin: 3px 0;
+	margin: 0 0 4px 0;
 }
 
 #folderslist,
diff --git a/skins/larry/templates/folders.html b/skins/larry/templates/folders.html
index 977dff451..c707d3396 100644
--- a/skins/larry/templates/folders.html
+++ b/skins/larry/templates/folders.html
@@ -22,6 +22,7 @@
 	<a href="#folders" class="iconbutton search" title="<roundcube:label name='findfolders' />" tabindex="0"><roundcube:label name='findfolders' /></a>
 </h2>
 <div class="listsearchbox">
+	<roundcube:object name="folderfilter" id="folderlist-filter" />
 	<div class="searchbox" role="search" aria-labelledby="aria-label-foldersearchform">
 		<h3 id="aria-label-foldersearchform" class="voice"><roundcube:label name="arialabelfoldersearchform" /></h3>
 		<label for="foldersearch" class="voice"><roundcube:label name="arialabelsearchterms" /></label>
@@ -29,7 +30,6 @@
 		<a class="iconbutton searchicon"></a>
 		<roundcube:button command="reset-foldersearch" id="folderlistsearch-reset" class="iconbutton reset" title="resetsearch" label="resetsearch" />
 	</div>
-	<roundcube:object name="folderfilter" id="folderlist-filter" />
 </div>
 <div id="folderslist-content" class="scroller withfooter">
 	<roundcube:object name="foldersubscription" form="subscriptionform" id="subscription-table" class="treelist listing folderlist" />
diff --git a/skins/larry/ui.js b/skins/larry/ui.js
index 7b08aeadd..153abdc21 100644
--- a/skins/larry/ui.js
+++ b/skins/larry/ui.js
@@ -541,7 +541,7 @@ function rcube_mail_ui()
       var title = $('.boxtitle', container),
         box = $('.listsearchbox', container),
         dir = box.is(':visible') ? -1 : 1,
-        height = 34 + ($('select', box).length ? 24 : 0);
+        height = 34 + ($('select', box).length ? 22 : 0);
 
       box.slideToggle({
         duration: 160,
@@ -553,6 +553,8 @@ function rcube_mail_ui()
           box.toggleClass('expanded');
           if (box.is(':visible')) {
             box.find('input[type=text]').focus();
+            height = 34 + ($('select', box).length ? $('select', box).outerHeight() + 4 : 0);
+            $('.scroller', container).css('top', (title.outerHeight() + height) + 'px');
           }
           else {
             $('a.reset', box).click();