Merge remote-tracking branch 'origin/develop' into v1-dev

Author: modularcoder

bower.json

@@ -20,7 +20,9 @@
     "Sortable": "~1.4.2",
     "tether": "~1.3.7",
     "tinycolor": "~1.2.1",
-    "dropzone": "~4.2.0"
+    "dropzone": "~4.2.0",
+    "jquery-touchswipe": "^1.6.18",
+    "jquery.browser": "^0.1.0"
   },
   "overrides": {
     "bootstrap": {

src/app/_common/sidebar/sidebar.hbs

@@ -20,7 +20,7 @@
 						<i class="fa arrow"></i>
 					</a>
 
-					<ul>
+					<ul class="nav">
 						<li {{#is pagename "===" "items-list"}}class="active"{{/is}} >
 							<a href="items-list.html">
 								Items List
@@ -41,7 +41,7 @@
 						<i class="fa arrow"></i>
 					</a>
 
-					<ul>
+					<ul class="nav">
 						<li {{#is pagename "===" "charts-flot"}}class="active"{{/is}} >
 							<a href="charts-flot.html">
 								Flot Charts
@@ -62,7 +62,7 @@
 						<i class="fa arrow"></i>
 					</a>
 
-					<ul>
+					<ul class="nav">
 						<li {{#is pagename "===" "static-tables"}}class="active"{{/is}} >
 							<a href="static-tables.html">
 								Static Tables
@@ -92,7 +92,7 @@
 						<i class="fa arrow"></i>
 					</a>
 
-					<ul>
+					<ul class="nav">
 						<li {{#is pagename "===" "buttons"}}class="active"{{/is}}>
 							<a href="buttons.html">
 								Buttons
@@ -134,7 +134,7 @@
 						<i class="fa arrow"></i>
 					</a>
 
-					<ul>
+					<ul class="nav">
 						<li {{#is pagename "===" "login"}}class="active"{{/is}}>
 							<a href="login.html">
 								Login
@@ -179,6 +179,91 @@
 					</ul>
 				</li>
 
+				<li>
+					<a href="">
+						<i class="fa fa-sitemap"></i> Menu Levels
+						<i class="fa arrow"></i>
+					</a>
+
+					<ul class="nav">
+
+						<li>
+							<a href="#">
+								Second Level Item
+								<i class="fa arrow"></i>
+							</a>
+
+							<ul class="nav">
+								
+								<li>
+									<a href="#">
+										Third Level Item
+									</a>
+								</li>
+
+								<li>
+									<a href="#">
+										Third Level Item
+									</a>
+								</li>
+
+							</ul>
+						</li>
+						
+						<li>
+							<a href="#">
+								Second Level Item
+							</a>
+						</li>
+
+						<li>
+							<a href="#">
+								Second Level Item
+								<i class="fa arrow"></i>
+							</a>
+
+							<ul class="nav">
+								
+								<li>
+									<a href="#">
+										Third Level Item
+									</a>
+								</li>
+
+								<li>
+									<a href="#">
+										Third Level Item
+									</a>
+								</li>
+
+								<li>
+									<a href="#">
+										Third Level Item
+										<i class="fa arrow"></i>
+									</a>
+
+									<ul class="nav">
+
+										<li>
+											<a href="#">
+												Fourth Level Item
+											</a>
+										</li>
+
+										<li>
+											<a href="#">
+												Fourth Level Item
+											</a>
+										</li>
+									</ul>
+
+								</li>
+							</ul>
+						</li>
+
+					</ul>
+				</li>
+
 				<li {{#is pagename "===" "docs"}}class="active"{{/is}} >
 					<a href="https://github.com/modularcode/modular-admin-html">
 						<i class="fa fa-github-alt"></i> Theme Docs

src/app/_common/sidebar/sidebar.js

@@ -14,5 +14,24 @@ $(function () {
 	$("#sidebar-overlay").on('click', function() {
 		$("#app").removeClass("sidebar-open");
 	});
+
+	if ($.browser.mobile) {
+		var $appContainer = $('.app ');
+
+		$appContainer.swipe({
+			swipeLeft: function() {
+				if($appContainer.hasClass("sidebar-open")) {
+					$appContainer.removeClass("sidebar-open");	
+				}
+			},
+			swipeRight: function() {
+				if(!$appContainer.hasClass("sidebar-open")) {
+					$appContainer.addClass("sidebar-open");
+				}
+			},
+			excludedElements: "button, input, select, textarea, .noSwipe, table", 
+			triggerOnTouchEnd: false
+		});
+	}
 
 });

src/app/_common/sidebar/sidebar.scss

@@ -136,7 +136,7 @@
 		}
 
 		// Second level items
-		& > li > ul > li {
+		& > li > .nav> li {
 
 			// Second level and deeper items links
 			// Have bit darker background and more padding 
@@ -153,6 +153,19 @@
 			&.active a {
 				color: $sidebar-color-text-active;
 			}
+
+			// Third level items	
+			& > .nav > li {
+				a {
+					padding-left: 60px;
+				}
+
+				& > .nav > li {
+					a {
+						padding-left: 70px;
+					}
+				}
+			}		
 		}
 	}