Open sidebar menu on swipe

Author: modularcoder

src/app/_common/sidebar/sidebar.hbs

@@ -279,4 +279,5 @@
 	{{> app/_common/sidebar/customize/customize}}
 
 </aside>
-<div class="sidebar-overlay" id="sidebar-overlay"></div>
+<div class="sidebar-overlay" id="sidebar-overlay"></div>
+<div class="sidebar-mobile-menu-handle" id="sidebar-mobile-menu-handle"></div>

src/app/_common/sidebar/sidebar.js

@@ -16,9 +16,10 @@ $(function () {
 	});
 
 	if ($.browser.mobile) {
-		var $appContainer = $('.app ');
+		var $appContainer = $('#app ');
+		var $mobileHandle = $('#sidebar-mobile-menu-handle ');
 
-		$appContainer.swipe({
+		$mobileHandle.swipe({
 			swipeLeft: function() {
 				if($appContainer.hasClass("sidebar-open")) {
 					$appContainer.removeClass("sidebar-open");	
@@ -29,7 +30,7 @@ $(function () {
 					$appContainer.addClass("sidebar-open");
 				}
 			},
-			excludedElements: "button, input, select, textarea, .noSwipe, table", 
+			// excludedElements: "button, input, select, textarea, .noSwipe, table", 
 			triggerOnTouchEnd: false
 		});
 	}

src/app/_common/sidebar/sidebar.scss

@@ -198,4 +198,18 @@
 			opacity: 1;
 		}
 	}
+}
+
+.sidebar-mobile-menu-handle {
+	display: none;
+	position: absolute;
+	top: $header-height-xs;
+	background-color: transparent;
+	width: 30px;
+	bottom: 0;
+	z-index: 10;
+
+	@include media-down(md) {
+		display: block;
+	}
 }

src/app/app-layout.hbs

@@ -10,6 +10,8 @@ themeTitle: ModularAdmin
     {{!-- Default sidebar block --}}
     {{> app/_common/sidebar/sidebar}}
 
+    <div class="mobile-menu-handle"></div>
+
     {{!-- Content section --}}
     <article class="content {{pagename}}-page">
       {{{body}}}