Some more styling for toolbar widget and toolbar in calendar

calendar/templates/default/app.css

@@ -455,7 +455,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 	-o-transition: none !important;
 	-ms-transition: none !important;
 	transition: none !important;
-	
+
 /* set via inline style on runtime:
  *  top: depending on startime
  *  height: depending on length
@@ -586,7 +586,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 	height: 99%;
 
 	white-space: normal;
-	
+
 	/* Gradient */
 	background-image: -webkit-linear-gradient(0deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.85) 60%);
 	background-image: -moz-linear-gradient(90deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.85) 60%);
@@ -764,7 +764,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 	z-index: 30;
 	cursor: pointer;
 }
-	
+
 /* calendar_eventRows contain multiple eventRowWidgets
  */
 .calendar_eventRows, .calendar_plannerHeaderRows {
@@ -1009,18 +1009,11 @@ img.calendar_print_button, img.calendar_print_appicon {
 }
 
 /*weekend slideSwitch in toolbar*/
-#calendar-toolbar_toolbar .et2_checkbox_slideSwitch .slideSwitch_container{
-	width: 44px;
-    
-}
 
-div.egw_fw_content_browser_div, #calendar-toolbar_app_header, div.egw_fw_ui_app_header_container {
-	background-color: #FAFAFA;
-}
 #calendar-toolbar_app_header {
 	font-weight: bold;
 	color: #616161;
 }
 #calendar-toolbar_toolbar .et2_toolbar_more {
 	margin-top: 0;
-}
+}

calendar/templates/pixelegg/app.css

@@ -1379,6 +1379,11 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
 #calendar_merge {
   margin: 9px 0 0 0;
 }
+#calendar-toolbar_toolbar .et2_toolbar_more > h.ui-toolbar-menulistHeader,
+#calendar-toolbar_toolbar .et2_toolbar_more div.ui-toolbar-menulist button.et2_button_with_image,
+#calendar-toolbar_toolbar .et2_toolbar_actionlist button.et2_button_with_image {
+  background-color: #fafafa;
+}
 /*#calendar_sidebox_content {
     .egw_fw_ui_category_content {
     // Last Element rounded

calendar/templates/pixelegg/app.less

@@ -1393,6 +1393,12 @@ div#calendar-container {
 // insert a document
 #calendar_merge {margin: 9px 0 0 0;}
 
+#calendar-toolbar_toolbar {
+	.et2_toolbar_more > h.ui-toolbar-menulistHeader, .et2_toolbar_more div.ui-toolbar-menulist button.et2_button_with_image, .et2_toolbar_actionlist button.et2_button_with_image  {
+		background-color: #fafafa;
+	}
+}
+
 // Last Element in Sidemenu - rounded
 /*#calendar_sidebox_content {
     .egw_fw_ui_category_content {

etemplate/js/et2_widget_toolbar.js

@@ -504,16 +504,12 @@ var et2_toolbar = et2_DOMWidget.extend([et2_IInput],
 		}
 		if (action.caption)
 		{
-			// Set label for checkboxes inside the dropdown
-			if(this.preference[action.id] &&
-				action.data && action.data.widget && action.data.widget.instanceOf(et2_checkbox))
-			{
-				button.prepend(action.caption);
-			}
-			else if ((this.countActions <= parseInt(this.options.view_range) ||
+			if ((this.countActions <= parseInt(this.options.view_range) ||
 					this.preference[action.id])	&&
-					typeof button[0] !== 'undefined')
+					typeof button[0] !== 'undefined' &&
+					!(action.checkbox && action.data && (action.data.toggle_on || action.data.toggle_off))) // no caption for slideswitch checkboxes 
 			{
+				button.addClass('et2_toolbar_hasCaption');
 				button[0].textContent = action.caption;
 			}
 		}

etemplate/templates/default/etemplate2.css

@@ -1522,15 +1522,20 @@ div.ms-sel-ctn .ms-sel-item {
 .et2_toolbar .et2_toolbar_actionlist button.et2_button_with_image {
 	width: 24px;
 	background-position: center;
-    background-size: 16px 16px;
+	background-size: 16px 16px;
 	border-radius: 3px;
 	padding-left: 0;
+	background-color: #fafafa;
+}
+.et2_toolbar .et2_toolbar_actionlist button.et2_button_with_image.et2_toolbar_hasCaption {
+	width:auto;
+	background-position: 6px center;
+	padding-left: 30px;
 }
 .et2_toolbar button {
 	margin:1px;
 	margin-right: 3px;
 	height: 24px;
-
 }
 .et2_toolbar button.toolbar_toggled {
 	background-color: white;
@@ -1611,6 +1616,10 @@ div.ms-sel-ctn .ms-sel-item {
 }
 .et2_toolbar div.ui-toolbar-menulist button.et2_button_with_image {
     background-size: 16px 16px;
+    background-color: #fafafa;
+}
+.et2_toolbar div.ui-toolbar-menulist span.slideSwitch_container {
+	width:100%;
 }
 div.ui-toolbar-menulist{
 	position: absolute;
@@ -1687,7 +1696,7 @@ span.et2_checkbox_slideSwitch > span.slideSwitch_container {
     background-color: #FFFFFF;
     box-shadow: inset 0 2px 6px rgb(71, 71, 71), 0 1px 0 rgba(255, 255, 255, 0.2);
     margin: 0;
-	min-width:12px;
+	min-width:44px;
     display: block;
     position: relative;
     border-radius: 3px;
@@ -1766,7 +1775,7 @@ span.et2_checkbox_slideSwitch.switchOn > span.slideSwitch_container a {
 	width: 100%;
 }
 .et2_toolbar_more span.et2_checkbox_slideSwitch > span.slideSwitch_container {
-	width: 40px;
+	width: 100%;
 	float: left;
 }
 .et2_toolbar_more span.et2_checkbox_slideSwitch > input {