Elastic: icons cleanup

- Distinct icons for settings and options
- Distinct icons for expand actions (threads)
- Consistent icon to enable select checkboxes

skins/elastic/styles/widgets/buttons.less

@@ -114,15 +114,18 @@ button.btn {
     &.folders:before {
         content: @fa-var-folder-open;
     }
+    &.options:before {
+        content: @fa-var-sliders-h;
+    }
     &.tools:before,
     &.settings:before {
-        content: @fa-var-wrench;
+        content: @fa-var-cog;
     }
     &.properties:before {
         content: @fa-var-info-circle;
     }
     &.select:before {
-        .font-icon-regular(@fa-var-check-circle);
+        .font-icon-regular(@fa-var-check-square);
     }
     &.insert.recipient:before {
         content: @fa-var-user-plus;

skins/elastic/styles/widgets/menu.less

@@ -370,9 +370,12 @@ a.toolbar-button {
     &.contacts:before {
         content: @fa-var-users;
     }
-    &.settings:before {
+    &.options:before {
         content: @fa-var-sliders-h;
     }
+    &.settings:before {
+        content: @fa-var-cog;
+    }
     &.help:before {
         content: @fa-var-life-ring;
     }
@@ -469,10 +472,14 @@ a.toolbar-button {
     &.expand:before {
         content: @fa-var-angle-right;
     }
-    &.expand.all:before,
-    &.expand.none:before,
+    &.expand.all:before {
+        content: @fa-var-angle-double-down;
+    }
+    &.expand.none:before {
+        content: @fa-var-angle-double-right;
+    }
     &.expand.unread:before {
-        content: @fa-var-comments;
+        .font-icon-regular(@fa-var-envelope);
     }
     &.export:before,
     &.export.all:before,
@@ -596,10 +603,10 @@ a.toolbar-button {
         content: @fa-var-trash-alt;
     }
     &.select:before {
-        .font-icon-regular(@fa-var-check-circle);
+        content: @fa-var-mouse-pointer;
     }
     &.select.all:before {
-        content: @fa-var-check-square;
+        content: @fa-var-asterisk;
     }
     &.select.invert:before {
         content: @fa-var-square;
@@ -611,14 +618,11 @@ a.toolbar-button {
         .font-icon-solid(@fa-var-bars);
     }
     &.selection:before {
-        content: @fa-var-mouse-pointer;
+        .font-icon-regular(@fa-var-check-square);
     }
     &.send:before {
         content: @fa-var-paper-plane;
     }
-    &.settings:before {
-        content: @fa-var-sliders-h;
-    }
     &.showurl:before {
         content: @fa-var-link;
     }

skins/elastic/templates/compose.html

@@ -79,7 +79,7 @@
 		<span class="header-title"><roundcube:label name="compose" /></span>
 		<!-- toolbar -->
 		<div id="messagetoolbar" class="toolbar menu" role="toolbar" aria-labelledby="aria-label-toolbar">
-			<a class="settings" href="#options" onclick="UI.show_sidebar()" data-hidden="big">
+			<a class="options" href="#options" onclick="UI.show_sidebar()" data-hidden="big">
 				<span class="inner"><roundcube:label name="optionsandattachments"></span>
 			</a>
 			<roundcube:button command="savedraft" type="link" class="save draft disabled" classAct="save draft"

skins/elastic/templates/mail.html

@@ -36,7 +36,7 @@
 			<roundcube:if condition="env:threads" />
 				<a href="#threads" class="threads disabled" data-popup="threadselect-menu" title="<roundcube:label name="threads" />"><span class="inner"><roundcube:label name="threads" /></span></a>
 			<roundcube:endif />
-			<roundcube:object name="listmenulink" class="settings active" label="options" innerclass="inner" />
+			<roundcube:object name="listmenulink" class="options active" label="options" innerclass="inner" />
 			<roundcube:container name="listcontrols" id="listcontrols" />
 		</div>
 		<roundcube:button command="checkmail" type="link" class="button icon toolbar-button refresh"
@@ -153,8 +153,8 @@
 <div id="threadselect-menu" class="popupmenu">
 	<h3 id="aria-label-threadselectmenu" class="voice"><roundcube:label name="arialabelthreadselectmenu" /></h3>
 	<ul class="menu listing" role="menu" aria-labelledby="aria-label-threadselectmenu">
-		<roundcube:button command="expand-all" type="link-menuitem" label="expand-all" class="expand all disabled" classAct="expand all active" />
 		<roundcube:button command="expand-unread" type="link-menuitem" label="expand-unread" class="expand unread disabled" classAct="expand unread active" />
+		<roundcube:button command="expand-all" type="link-menuitem" label="expand-all" class="expand all disabled" classAct="expand all active" />
 		<roundcube:button command="collapse-all" type="link-menuitem" label="collapse-all" class="expand none disabled" classAct="expand none active" />
 	</ul>
 </div>

skins/elastic/ui.js

@@ -522,7 +522,7 @@ function rcube_elastic_ui()
 
                 // Add Select button to the list navigation bar
                 if (!button) {
-                    button = $('<a>').attr({'class': 'button select disabled', role: 'button', title: rcmail.gettext('select')})
+                    button = $('<a>').attr({'class': 'button selection disabled', role: 'button', title: rcmail.gettext('select')})
                         .on('click', function() { if ($(this).is('.active')) table.toggleClass('withselection'); })
                         .append($('<span class="inner">').text(rcmail.gettext('select')));