Support moving sidebar entries to toolbar menu on mobile

skins/elastic/styles/layout.less

@@ -262,6 +262,9 @@ html.iframe body {
     body > #layout > div > .header > a.toolbar-menu-button {
         display: none;
     }
+    .hidden-big {
+        display: none !important;
+    }
 }
 
 @media screen and (min-width: (@screen-width-xs + 1px)) {

skins/elastic/styles/widgets/lists.less

@@ -121,6 +121,7 @@ ul.listing {
 .listing.iconized li {
     a:before {
         &:extend(.font-icon-class);
+        height: 2em; /* TODO: ? */
     }
     &.preferences > a:before {
         content: @fa-var-sliders;

skins/elastic/templates/about.html

@@ -1,8 +1,10 @@
 <roundcube:include file="includes/layout.html" />
 
+<h1 class="voice"><roundcube:label name="about" /></h1>
+
 <roundcube:object name="aboutcontent" />
 
-<div class="frame-content">
+<div class="content frame-content">
 	<h2 class="sysname">Roundcube Webmail <roundcube:object name="version" /></h2>
 	<p class="copyright">Copyright &copy; 2005-2016, The Roundcube Dev Team</p>
 	<p class="license">This program is free software;

skins/elastic/ui.js

@@ -404,7 +404,7 @@ function rcube_elastic_ui()
      */
     function dropdowns_init()
     {
-        $('*[data-popup]').each(function() { popup_init(this); });
+        $('[data-popup]').each(function() { popup_init(this); });
 
         // close popups on click in an iframe on the page
         var close_all_popups = function(e) {
@@ -890,10 +890,21 @@ function rcube_elastic_ui()
             toolbar.remove();
         });
 
+        // special elements to clone and add to the toolbar (mobile only)
+        $('ul[data-menu="toolbar-small"] > li > a').each(function() {
+            var button = $(this).clone();
+
+            button.attr('id', this.id + '_clone');
+
+            // TODO: rcmail.register_button()
+
+            items.push($('<li role="menuitem">').addClass('hidden-big').append(button));
+        });
+
         // append the new toolbar and menu button
         if (items.length) {
             var container = layout.content.children('.header'),
-                menu_attrs = {'class': 'toolbar popupmenu listing', id: 'toolbar-menu'},
+                menu_attrs = {'class': 'toolbar popupmenu listing iconized', id: 'toolbar-menu'},
                 menu_button = $('<a class="button icon toolbar-menu-button" href="#menu">')
                     .attr({'data-popup': 'toolbar-menu'});