Unify taskmenu buttons

skins/elastic/includes/menu.html

@@ -1,21 +1,26 @@
 <div id="menu" class="menu">
 	<h2 id="aria-label-tasknav" class="voice"><roundcube:label name="arialabeltasknav" /></h2>
 	<div id="taskmenu" role="navigation" aria-labelledby="aria-label-tasknav">
-		<roundcube:button command="mail" label="mail" type="link" class="button-mail" classSel="button-mail button-selected" innerClass="inner" />
+		<roundcube:button command="mail" label="mail" type="link" class="button mail"
-		<roundcube:button command="addressbook" label="contacts" type="link" class="button-addressbook" classSel="button-addressbook button-selected" innerClass="inner" />
+			classSel="button mail selected" innerClass="inner" />
+		<roundcube:button command="addressbook" label="contacts" type="link"
+			class="button addressbook" classSel="button addressbook selected" innerClass="inner" />
 		<roundcube:container name="taskbar" id="taskmenu" />
-		<roundcube:button command="settings" label="settings" type="link" class="button-settings" classSel="button-settings button-selected" innerClass="inner" />
+		<roundcube:button command="settings" label="settings" type="link"
+			class="button settings" classSel="button settings selected" innerClass="inner" />
 		<span class="action-buttons">
 			<roundcube:if condition="env:task == 'mail' && !env:action" />
-				<roundcube:button command="checkmail" type="link" class="button-refresh" label="refresh" title="checkmail" innerclass="inner" />
+				<roundcube:button command="checkmail" type="link" class="button refresh" label="refresh" title="checkmail" innerclass="inner" />
 			<roundcube:endif />
 			<roundcube:if condition="env.task != 'mail' || env:action != 'compose'" />
-				<roundcube:button command="compose" type="link" class="button-compose" label="compose" title="writenewmessage" innerclass="inner" />
+				<roundcube:button command="compose" type="link" class="button compose" label="compose" title="writenewmessage" innerclass="inner" />
 			<roundcube:endif />
 		</span>
 		<span class="special-buttons">
-			<roundcube:button name="about" label="about" type="link" class="button-about" classSel="button-about" innerClass="inner" onclick="UI.about_dialog(this)" />
+			<roundcube:button name="about" label="about" type="link"
-			<roundcube:button command="logout" label="logout" type="link" class="button-logout" classSel="button-logout" innerClass="inner" />
+				class="button about" innerClass="inner" onclick="UI.about_dialog(this)" />
-		<span>
+			<roundcube:button command="logout" label="logout" type="link"
+				class="button logout" innerClass="inner" />
+		</span>
 	</div>
 </div>

skins/elastic/styles/icons.less

@@ -17,7 +17,7 @@ ul.treelist li div.treetoggle:before,
 .messagelist tr:hover span.unflagged:before,
 a.rcmaddcontact:before,
 .attachmentslist li:before,
-#taskmenu a:before {
+#taskmenu a.button:before {
     font-size: 1.25em;
     /*display: inline-block;*/
     /* FIXME: with inline-block we have a problem with icon alignment,
@@ -64,31 +64,31 @@ a.rcmaddcontact:before,
 }
 
 
-#taskmenu a.button-mail:before {
+#taskmenu a.button.mail:before {
     content: @fa-var-envelope;
 }
-#taskmenu a.button-addressbook:before {
+#taskmenu a.button.addressbook:before {
     content: @fa-var-user;
 }
-#taskmenu a.button-settings:before {
+#taskmenu a.button.settings:before {
     content: @fa-var-cog;
 }
-#taskmenu a.button-help:before {
+#taskmenu a.button.help:before {
     content: @fa-var-life-bouy;
 }
-#taskmenu a.button-logout:before {
+#taskmenu a.button.logout:before {
     content: @fa-var-power-off;
 }
-#taskmenu a.button-about:before {
+#taskmenu a.button.about:before {
     content: @fa-var-question;
 }
-#taskmenu a.button-logout:hover {
+#taskmenu a.button.logout:hover {
     color: @taskmenu-logout-button-hover-color;
 }
-#taskmenu a.button-refresh:before {
+#taskmenu a.button.refresh:before {
     content: @fa-var-refresh;
 }
-#taskmenu a.button-compose:before {
+#taskmenu a.button.compose:before {
     content: @fa-var-edit;
 }
 

skins/elastic/styles/widgets.less

@@ -99,14 +99,14 @@ a.button {
     padding: 0.4em 0;
 }
 
-#taskmenu a,
+#taskmenu a.button,
-#taskmenu a:before {
+#taskmenu a.button:before {
     display: block;
     width: 60px;
     text-align: center;
 }
 
-#taskmenu a:before {
+#taskmenu a.button:before {
     font-size: 1.5em;
     margin-bottom: 0.1em;
 }