Make off canvas work no matter where you are on the page and avoids having to jump...

diff --git a/scss/components/_off-canvas.scss b/scss/components/_off-canvas.scss
index e7175e978267451fa28e7d14eb3c753cabcc7c11..9e9dfc8403bd4f2749abb9e8209bf54009e75f57 100644 (file)
--- a/scss/components/_off-canvas.scss
+++ b/scss/components/_off-canvas.scss
@@ -50,8 +50,9 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5) !default;
 
   .off-canvas-wrapper {
     width: 100%;
-    overflow-x: hidden;
+    height: 100%;
     position: relative;
+    overflow: hidden;
     backface-visibility: hidden;
     -webkit-overflow-scrolling: auto;
   }
@@ -60,13 +61,14 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5) !default;
     @include clearfix;
     position: relative;
     width: 100%;
+    height: 100%;
     transition: transform $offcanvas-transition-length $offcanvas-transition-timing;
   }
 
   // Container for page content
   .off-canvas-content,
   .#{$maincontent-class} {
-    min-height: 100%;
+    height: 100%;
     background: $body-background;
     transition: transform $offcanvas-transition-length $offcanvas-transition-timing;
     backface-visibility: hidden;
@@ -98,7 +100,7 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5) !default;
   position: absolute;
   background: $offcanvas-background;
   z-index: $offcanvas-zindex;
-  max-height: 100%;
+  height: 100%;
   overflow-y: auto;
   transform: translateX(0);
 }