Cacher is the code snippet organizer for pro developers

//mobile slide menu
#mobile-menu
	+above(768px)
		display none!important
	margin-top 54px
	background white
	border-top 1px solid #e6e6e6
	
	//display none!important

#mobile-menu:not( .mm-menu )
	display: none;

.mobile-menu-el
	padding 10px 0!important
	display inline-block
	color black
	font-size 16px
	font-weight 600
	.header__sub-menu__el
		width 100%
		f()

.mm-listview>li:not(.mm-divider):after
	left 0

.mm-menu .mm-listview>li .mm-next:after,
.mm-menu .mm-btn:after, .mm-menu .mm-btn:before
	border-color black

.mm-title
	color black!important

.mm-navbar
	background #efeeee

html.mm-opened
	overflow hidden

.mobile-menu-el--sub
	a:after, a:before
		border-color  #a5a4a4!important
	span,a
		color #a5a4a4!important

.header-mobile-togle--open
	.icon-menu-close
		display: block
	.icon-menu
		display: none

.icon-menu-close
	display: none

//===== Mobile slide-left menu =====
 var $menu = $("#mobile-menu").mmenu({
  	navbar: {
  		title: "Главное меню",
  		"content": [
  		"searchfield"
  		]
  	},
		/*"searchfield": {
		add: true,
		search: true
		},*/
		extensions: [
			//"effect-menu-slide",
			"effect-listitems-slide",
			"fullscreen"
		],
		offCanvas : {
			position : "left", // changing this alters the position of the menu
			zposition : "front"
		},
	});

//Toggle header icon
if ($menu.data( "mmenu" )) {
	var API = $menu.data( "mmenu" );
	API.bind( "opening", function() {
	  $('.head-toggle').toggleClass('header-mobile-togle--open');
	});
	API.bind( "closing", function() {
	  $('.head-toggle').toggleClass('header-mobile-togle--open');
	});
	$('.modal-get').click(function() {
       API.close();
  });
}
//===== Mobile slide-left menu =====

// add swipe
$("#my-menu").mmenu({
		extensions: ["effect-menu-slide", "effect-listitems-slide","theme-dark"], 
		 position : "left", // changing this alters the position of the menu
    zposition : "front"
	});

	//for mobile hide
	$(function() {      
      $("body").swipe( {
        swipeRight:function() {
          $("#my-menu").data( "mmenu" ).open()
        }
      });
      $("body").swipe( {
        swipeLeft:function() {
          $("#my-menu").data( "mmenu" ).close()
        }
      });
	});

//bower i jQuery.mmenu#5.7.8 --save-dev
//bower i jquery-touchswipe --save-dev

//script(src="bower/jquery-touchswipe/jquery.touchSwipe.js") 
//script(src="bower/jQuery.mmenu/dist/js/jquery.mmenu.all.min.umd.js") 

//link(rel="stylesheet", href="bower/jQuery.mmenu/dist/css/jquery.mmenu.all.css")
//link(rel="stylesheet", href="bower/jQuery.mmenu/dist/extensions/effects/jquery.mmenu.effects.css")
//link(rel="stylesheet", href="bower/jQuery.mmenu/dist/extensions/themes/jquery.mmenu.themes.css")

a(href="#mobile-menu").head-toggle
	+icon("menu","icon icon-menu")
	+icon("close","icon icon-menu-close")

nav#mobile-menu
		ul.mobile-menu__one-lvl
			-
				var items = [
					'Юбки',
					'Брюки',
					'Топы',
					'Блузы и рубашки',
					'Жакеты',
					'Аксессуары',
					'Верхняя одежда'
					];
			each item in items
				li.mobile-menu-el
					a(href="#") #{item}
					ul.mobile-menu__two-lvl
						-
							var subitems = [
								'Вечерние платья ',
								'Вязаные и трикотажные платья ',
								'Джинсовые платья ',
								'Коктейльные платья',
								'Летние платья ',
								'Офисные платья ',
								'Платья-миди ',
								'Платья-макси ',
								'Платья-мини ',
								'Пляжные платья и туники ',
								'Повседневные платья ',
								'Сарафаны ',
								'Свадебные платья ',
								'Спортивные платья'
							];
						each subitem in subitems
							li.mobile-menu-el
								a(href="#") #{subitem}
			li.mobile-menu-el.mobile-menu-el--sub
				span Личный кабинет
				ul.mobile-menu__two-lvl
					li.mobile-menu-el
						span.modal-get(data-modal="enter") Вход
					li.mobile-menu-el
						span.modal-get(data-modal="registration") Регистрация
			li.mobile-menu-el.mobile-menu-el--sub
				span Регион
				ul.mobile-menu__two-lvl
					li.mobile-menu-el
						span Регион 1
					li.mobile-menu-el
						span Регион 2