Merge remote-tracking branch 'origin/mobilesidebar'

css/area_header.less

@@ -3,3 +3,45 @@
  *
  * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
  */
+#dokuwiki__header {
+
+    .menu-togglelink {
+        border: 1px solid @color-border;
+        border-radius: @border-radius;
+        text-align: center;
+        margin: @very-small-spacing -(@very-small-spacing) 0 0;
+
+        font-size: @font-size-small;
+        min-height: 2em;
+        min-width: 2em;
+        box-sizing: border-box;
+        line-height: 2em;
+
+        cursor: pointer;
+        background-color: #fff;
+        text-decoration: none;
+        transition: @transition color, @transition background-color, @transition border-color;
+
+
+        svg {
+            height: @font-size-default + (@font-scale-factor * 4);
+            width: @font-size-default + (@font-scale-factor * 4);
+            vertical-align: middle;
+            path {
+                fill: @color-nav
+            }
+        }
+
+        &:hover,
+        &:active,
+        &:focus {
+            background-color: @button_color;
+            border-color: @button_background;
+            svg path {
+                fill: @button_background;
+            }
+        }
+
+    }
+
+}

css/area_main-sidebar-nav.less

@@ -8,7 +8,9 @@
     @icon-size: @font-size-big;
     @menu-margin: @icon-size + @margin-small*2; // FIXME this is still wrong
 
-    margin-left: @menu-margin; // moves *all* sidebar content to the right
+    > * {
+        margin-left: @menu-margin; // moves *all* sidebar content to the right
+    }
 
     // the toggle element
     a.nav {
@@ -98,6 +100,36 @@
     }
 }
 
+/**
+ * Sidebar handling in mobile view
+ */
+@media @screen_max-md {
+    // hide on medium and smaller screens
+    #dokuwiki__aside {
+        display: none;
+    }
+    // show when toggled
+    #dokuwiki__aside.show {
+        display: block;
+
+        position: absolute;
+        left: 0;
+        z-index: 200; // above all
+
+
+        border-right: @ini_border 1px solid;
+        box-shadow: @box-shadow;;
+
+        max-width: 100%;
+        min-width: 45%;
+        height: 100%;
+
+        background-color: @ini_background;
+    }
+}
+
+
+
 // FIXME check if the stuff below is still relevant
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */
@@ -125,6 +157,8 @@
             }
         }
     }
+
+
 }
 
 /* + + + + + + + + + + + + + + + + + + + + + + + + + + */

css/base_structure.less

@@ -153,6 +153,8 @@
                 }
             }
         }
+
+
     }
 
     .showSidebar {