<div id="mobile-menu-close" class="hidden">
  <img src="/layout/images/icon-close.svg">
</div>
<div id="menu-container-<?= $this -> menu['id'];?>" class="menu-container-<?= $this -> menu['id'];?>">
  <nav>
    <?= \front\view\Menu::pages( $this -> menu['pages'], 0, $this -> current_page );?>
  </nav>
</div>
<script class="footer" type="text/javascript" src="/libraries/multilevelpushmenu.js"></script>
<script class="footer" type="text/javascript">
  $( function()
  {
    if ( windowsize <= 992 )
    {
      $( '#menu-container-<?= $this -> menu['id'];?>' ).show();
      $( '#menu-container-<?= $this -> menu['id'];?>' ).multilevelpushmenu(
      {
        direction: 'ltr',
        fullCollapse: true,
        mode : 'overlap',
        collapsed: true,
		    wrapperClass: 'mmm',
        backText: 'Wstecz',
				menuHeight: "100%",
        menuWidth: "100vw",
        preventItemClick: false,
        swipe: 'none'
      });

      $( 'body' ).on( click_event, '#mobile-menu-close', function()
      {
        $( '#menu-container-<?= $this -> menu['id'];?>' ).multilevelpushmenu( 'collapse' );
        $( this ).addClass( 'hidden' );
        $( '#mobile-menu-open' ).removeClass( 'hidden' );
      });

      $( 'body' ).on( click_event, '#mobile-menu-open', function()
      {
        $( '#menu-container-<?= $this -> menu['id'];?>' ).css( 'visibility', 'visible' ).multilevelpushmenu( 'expand' );
        $( this ).addClass( 'hidden' );
        $( '#mobile-menu-close' ).removeClass( 'hidden' );
      });
    }
  });
</script>