(js) Allow hiding the sidenav on large screens

Position of button is not final as it causes an issue with the tabs of
the Calendar module.

UI/WebServerResources/scss/components/sidenav/sidenav.scss

@@ -7,9 +7,14 @@ $sidenav-min-space: $pitch;
 md-sidenav {
   &.md-locked-open {
     @include from(lg) {
-      @include flex-col(lg, 4, 1, 0)
+      @include flex-col(lg, 4, 1, 0);
+      // Custom representation of a closed sidenav where the sidenav is pushed to the left;
+      // Used in in "locked open" mode.
+      &.sg-closed.md-sidenav-left {
+        transform: translateX(-100%);
+        margin-right: -20vw; // See views/_views.scss
+      }
     }
-
   }
 }
 

UI/WebServerResources/scss/views/_view.scss

@@ -79,7 +79,7 @@ $detailView-width: grid-step(8) !global;
     margin: 0;
   }
   @include from(lg) {
-    @include flex-col(lg, 10, 2, 1);
+    flex: 1 1 auto;
     margin: 0;
   }