Improved mobile view #151 (#150)

- fixed group by for mysql mode
- only user can edit own prefs
- updated installation README
- pagerfanta shows less links
- improved manual tab
- moved user profile link to pref tabs
- added menu links to top navbar
- moved page actions to breadcrumb position
- integrated daterangepicker and improved toolbar forms
- bugfix for time rounding

assets/css/kimai.scss

@@ -5,10 +5,38 @@
  * file that was distributed with this source code.
  */
 
+@import "~bootstrap-sass/assets/stylesheets/bootstrap/variables";
+
 .error-page {
     margin-bottom: 50px;
 }
 
+/* ================================ CONTENT ================================ */
+
+.content {
+    padding: 15px 0;
+}
+.content-header {
+    h1 {
+        small {
+            display: none;
+        }
+    }
+}
+
+@media (min-width: $screen-sm-min) {
+    .content-header {
+        h1 {
+            small {
+                display: inline-block;
+            }
+        }
+    }
+    .content {
+        padding: 15px;
+    }
+}
+
 /* ================================ NAVBAR ================================ */
 
 .navbar-nav>li>a.ddt-large {
@@ -16,7 +44,7 @@
     padding-bottom: 9px;
 }
 
-li.messages-menu ul.menu li:hover .pull-left i {
+li.messages-menu ul.menu li .pull-left i {
     color: #dd4b39;
 }
 
@@ -53,8 +81,23 @@ li.open .ticktac i.running{
 
 /* ================================ TOOLBAR ================================ */
 
-.control-sidebar select {
-    color: #000;
+@media (max-width: $screen-md-min) {
+    .content-header > .breadcrumb {
+        position: absolute;
+        float: right;
+        background: transparent;
+    }
+}
+
+.control-sidebar {
+    select {
+        color: #000;
+    }
+    div.image {
+        img.img-circle {
+            max-width: 34px;
+        }
+    }
 }
 
 .data_table .box-header>.box-tools {
@@ -64,10 +107,12 @@ li.open .ticktac i.running{
 .box-header .box-title.toolbar form {
     font-size: 13px;
 }
-.toolbar form input,
-.toolbar form select {
-    display: inline-block;
-    width: inherit;
+@media (min-width: $screen-sm-min) {
+    .toolbar form input,
+    .toolbar form select {
+        display: inline-block;
+        width: inherit;
+    }
 }
 
 .toolbar form .form-group {
@@ -105,6 +150,16 @@ footer.main-footer {
 
 /* ================================ INVOICES ================================ */
 
+.invoice {
+    margin: 0;
+}
+
+@media (min-width: $screen-sm-min) {
+    .invoice {
+        margin: 10px 25px;
+    }
+}
+
 .page-header-small{
     font-size: 14px;
 }
@@ -127,13 +182,6 @@ table.invoice-sum th, table.invoice-sum td  {
 
 /* ================================ DATA-TABLES ================================ */
 
-/*
-    TODO "display:hidden" regel für dataTable - spalten - mobile ansicht
-    TODO "display:hidden" regel für dataTable - header icon - mobile ansicht
-
-*/
-
-
 /*
 dataTables.bootstrap.css
 */
@@ -194,7 +242,6 @@ div.dataTables_paginate ul.pagination {
     }
 }
 
-
 table.dataTable td,
 table.dataTable th {
     -webkit-box-sizing: content-box;
@@ -202,7 +249,6 @@ table.dataTable th {
     box-sizing: content-box;
 }
 
-
 table.dataTable {
     clear: both;
     /*margin-top: 6px !important;
@@ -331,9 +377,6 @@ div.dataTables_scrollHead table.table-bordered {
     border-bottom-width: 0;
 }
 
-
-
-
 /*
  * TableTools styles
  */

assets/css/vendor.scss

@@ -4,3 +4,4 @@ $fa-font-path: "~font-awesome/fonts";
 
 @import '~bootstrap-sass/assets/stylesheets/bootstrap';
 @import '~font-awesome/scss/font-awesome';
+@import '~daterangepicker/daterangepicker.css';