Mobile theme W.I.P.:

- Fix pale colors for slideSwitch captions
- Fix Today button in calendar toolbar
- Fix date indicator in calendar header

calendar/templates/mobile/app.css

@@ -141,19 +141,41 @@ form[id^="tracker-"] .dialogHeadbar {
  * @package calendar
  * @version $Id$
  */
-/* $Id: app.css 55492 2016-03-22 15:09:39Z nathangray $ */
+/* $Id: app.css 55588 2016-03-31 22:44:00Z nathangray $ */
 /*Media print classes*/
 @media print {
-  .th td,
+  #calendar-view.et2_container,
-  .row_on td,
+  #calendar-todo.et2_container,
-  .row_off td {
+  #calendar-planner.et2_container,
-    border: none !important;
+  #calendar-list.et2_container {
+    position: static;
+    height: auto !important;
   }
-  img.calendar_print_button {
+  .calendar_plannerWidget {
-    display: none !important;
+    height: auto !important;
   }
-  tr.calendar_print_cat {
+  .calendar_plannerWidget .calendar_plannerHeader {
-    border-bottom: 1px solid gray;
+    margin-right: 2px !important;
+  }
+  .calendar_plannerWidget .calendar_plannerRows {
+    height: auto !important;
+  }
+  .calendar_plannerWidget .verticalBar {
+    display: none;
+  }
+  /* Don't split a calendar week across pages */
+  #calendar-view_view > tbody > tr.view_row {
+    page-break-inside: avoid;
+  }
+  .calendar_calTimeGrid .calendar_calTimeGridScroll {
+    overflow-y: hidden !important;
+  }
+  /* Let hidden user names be visible */
+  #calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul {
+    position: static;
+  }
+  #calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul > li {
+    overflow: visible !important;
   }
 }
 /**
@@ -242,6 +264,9 @@ form[id^="tracker-"] .dialogHeadbar {
 }
 #calendar-toolbar .egw_fw_ui_app_header_container {
   border: none;
+  display: flex;
+  align-items: center;
+  min-height: 26px;
 }
 /* Space for toolbar */
 #calendar-view,
@@ -364,6 +389,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
   overflow: hidden;
   display: flex;
   flex-direction: column;
+  page-break-inside: avoid;
 }
 .calendar_calTimeGrid .calendar_calTimeGridScroll {
   position: relative;
@@ -373,6 +399,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
   overflow-y: auto;
   overflow-x: hidden;
   cursor: default;
+  background-color: white;
 }
 .calendar_calTimeGrid .calendar_calTimeLabels {
   height: 100%;
@@ -399,13 +426,16 @@ Hide subsequent headers in week view with non-consolidated owners
 #calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader .calendar_calDayColHeader > div[data-date] {
   display: none;
 }
-#calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul > li {
+#calendar-view_view.hideDayColHeader tr .calendar_calGridHeader > ul > li {
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
 }
-#calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul > li:hover {
+#calendar-view_view.hideDayColHeader tr .calendar_calGridHeader > ul:hover {
   overflow: visible;
+  width: auto;
+  background-color: inherit;
+  z-index: 100;
 }
 /* single row in the time-line you dont need to set a bgcolor, but you can
  */
@@ -1024,7 +1054,6 @@ Hide subsequent headers in week view with non-consolidated owners
   top: 0px;
   left: 0px;
   width: 99.5%;
-  background-color: #f0f0f0;
 }
 .calendar_plannerWidget > div:not(.calendar_plannerHeader) {
   overflow-y: auto;
@@ -2666,7 +2695,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
 /* tablets and smartphones  */
 @media all {
   #calendar-toolbar {
-    height: 50px;
+    height: 70px;
     box-shadow: 0px 4px 5px 2px silver;
     width: 100%;
     background: #0c5da5;
@@ -2699,7 +2728,7 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
     padding: 0px 5px 0 5px !important;
   }
   #calendar-list button.plus_button {
-    bottom: 65px ;
+    bottom: 85px ;
   }
   #calendar-edit_category {
     max-width: 100%;
@@ -2717,6 +2746,28 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
     background-color: #cc0033;
   }
   #calendar-view button.plus_button {
-    bottom: 65px;
+    bottom: 85px;
+  }
+  #calendar-toolbar button#toolbar-today {
+    font-weight: bold;
+    font-size: 12pt;
+    text-align: center;
+    vertical-align: bottom;
+  }
+  #calendar-toolbar_toolbar .et2_toolbar_more {
+    width: 30px;
+  }
+  #calendar-toolbar .egw_fw_ui_app_header_container {
+    background: white;
+    width: 100%;
+    display: block;
+    margin-top: 44px;
+    font-size: 10pt;
+  }
+  #calendar-toolbar .egw_fw_ui_app_header_container span {
+    display: block;
+    width: 100%;
+    text-align: center;
+    font-size: 10pt;
   }
 }

calendar/templates/mobile/app.less

@@ -16,7 +16,7 @@
 /* tablets and smartphones  */
 @media all {
 	#calendar-toolbar {
-		height: 50px;
+		height: 70px;
 		box-shadow: 0px 4px 5px 2px silver;
 		width: 100%;
 		background: #0c5da5;
@@ -50,7 +50,7 @@
 		padding: 0px 5px 0 5px !important;
 	}
 	#calendar-list button.plus_button {
-		bottom: 65px ;
+		bottom: 85px ;
 	}
 	#calendar-edit_category {max-width: 100%;}
 	#calendar-edit #calendar-edit_whole_day {margin:0;}
@@ -59,7 +59,29 @@
 	#calendar-toolbar {background-color: @calendar-color;}
 	#calendar-view {
 		button.plus_button {
-			bottom: 65px;
+			bottom: 85px;
+		}
+	}
+	#calendar-toolbar button#toolbar-today {
+		font-weight: bold;
+		font-size: 12pt;
+		text-align: center;
+		vertical-align: bottom;
+	}
+	#calendar-toolbar_toolbar .et2_toolbar_more {
+		width:30px;
+	}
+	#calendar-toolbar .egw_fw_ui_app_header_container {
+		background: white;
+		width: 100%;
+		display: block;
+		margin-top: 44px;
+		font-size: 10pt;
+		span{
+			display: block;
+			width:100%;
+			text-align: center;
+			font-size:10pt;
 		}
 	}
 }

pixelegg/mobile/fw_mobile.css

@@ -2900,7 +2900,7 @@ div.dhtmlxMenu_egw_SubLevelArea_Polygon table.dhtmlxMebu_SubLevelArea_Tbl tr.sub
  * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
  * @author Stefan Reinhard <stefan.reinhard@pixelegg.de>
  * @package pixelegg
- * @version $Id: layout_dialog.less 55572 2016-03-31 09:21:55Z ralfbecker $
+ * @version $Id: layout_dialog.less 55581 2016-03-31 16:59:47Z hnategh $
  */
 /*body {
     background-color: @gray_0;
@@ -8184,6 +8184,9 @@ form[id^="tracker-"] .dialogHeadbar {
     margin-top: 15px;
     box-shadow: inset 0 2px 2px #474747, 0 0px 0 rgba(255, 255, 255, 0.2);
   }
+  body span.et2_checkbox_slideSwitch span.slideSwitch_container span {
+    color: #696969 !important;
+  }
   body span.et2_checkbox_slideSwitch span.slideSwitch_container a {
     background-color: #E0E0E0;
     border-radius: 50%;

pixelegg/mobile/fw_mobile.less

@@ -1240,6 +1240,9 @@
 				border-radius: 15px;
 				margin-top: 15px;
 				box-shadow: inset 0 2px 2px rgb(71, 71, 71), 0 0px 0 rgba(255, 255, 255, 0.2);
+				span {
+					color:#696969 !important;
+				}
 				a {
 					background-color: #E0E0E0;
 					border-radius: 50%;