aside menu toggle

pages/_data/libs.json

@@ -3,7 +3,7 @@
     "jquery", "bootstrap"
   ],
   "js": {
-    "jquery": "jquery/dist/jquery.slim.min.js",
+    "jquery": "jquery/dist/jquery.min.js",
     "bootstrap": "bootstrap/dist/js/bootstrap.bundle.min.js",
     "autosize": "autosize/dist/autosize.min.js",
     "imask": "imask/dist/imask.min.js",

pages/_includes/layout/css.html

@@ -8,7 +8,7 @@
 {% endif %}
 
 <!-- Tabler Core -->
-<link href="{{ site.base }}/dist/css/tabler{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}" rel="stylesheet"/>
+<link href="{{ site.base }}/{% if jekyll.environment == 'development' %}tmp-{% endif %}dist/css/tabler{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}" rel="stylesheet"/>
 
 <!-- Tabler Plugins -->
-<link href="{{ site.base }}/dist/css/tabler-flags{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}" rel="stylesheet"/>
+<link href="{{ site.base }}/{% if jekyll.environment == 'development' %}tmp-{% endif %}dist/css/tabler-flags{% if jekyll.environment == 'production' %}.min{% endif %}.css?{{ site.time | date: '%s' }}" rel="stylesheet"/>

pages/_includes/layout/js.html

@@ -10,4 +10,4 @@
 {% endif %}
 
 <!-- Tabler Core -->
-<script src="{{ site.base }}/dist/js/tabler{% if jekyll.environment == 'production' %}.min{% endif %}.js?{{ site.time | date: '%s' }}"></script>
+<script src="{{ site.base }}/{% if jekyll.environment == 'development' %}tmp-{% endif %}dist/js/tabler{% if jekyll.environment == 'production' %}.min{% endif %}.js?{{ site.time | date: '%s' }}"></script>

pages/_includes/layout/menu-aside.html

@@ -5,7 +5,7 @@
 	{% for level-1 in site.data.menu %}
 	<li class="sidebar-nav-item">
 
-		<a href="{{ site.base }}/{{ level-1[1].url }}" class="sidebar-nav-link{% if level-1[0] == current-page[0] and current-page.size == 1 %} active{% endif %}">
+		<a href="{% if level-1[1].children %}#{% else %}{{ site.base }}/{{ level-1[1].url }}{% endif %}" class="sidebar-nav-link{% if level-1[0] == current-page[0] and current-page.size == 1 %} active{% endif %}" {% if level-1[1].children %}data-toggle="collapse" data-target="#sidebar-menu-{{ level-1[0] }}"{% endif %}>
 			{% if level-1[1].icon %}
 				{% assign icon = level-1[1].icon %}
 				{% include ui/icon.html icon=icon class="nav-icon" %}
@@ -25,7 +25,7 @@
 		</a>
 
 		{% if level-1[1].children %}
-		<ul class="sidebar-subnav">
+		<ul class="sidebar-subnav collapse" id="sidebar-menu-{{ level-1[0] }}">
 			{% for level-2 in level-1[1].children %}
 			<li class="sidebar-nav-item">
 				<a href="{{ site.base }}/{{ level-2[1].url }}" class="sidebar-nav-link{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] and current-page.size == 2 %} active{% endif %}">

scss/layout/_layout.scss

@@ -97,6 +97,10 @@ $sidenav-folded-item-height: 3.5rem;
         box-shadow: -6px 0px 16px -10px rgba(0, 0, 0, 0.2), $box-shadow;
       }
 
+      .sidebar-nav-arrow {
+        display: none !important;
+      }
+
       .sidebar-nav-title {
         display: none;
       }
@@ -294,7 +298,7 @@ Sidebar
   flex: 1;
   display: flex;
   flex-direction: column;
-  overflow: auto;
+  overflow-y: scroll;
   @include scrollbar(true);
 
   .sidebar-brand + & {
@@ -309,6 +313,7 @@ Sidebar menu
   margin: (-$sidenav-padding) (-$sidenav-padding) $sidenav-padding;
   padding: 0;
   list-style: none;
+  user-select: none;
 
   ul {
     margin: 0;
@@ -356,18 +361,17 @@ Sidebar menu
 }
 
 .sidebar-nav-arrow {
-  outline: 1px solid green;
   display: block;
+
   margin-left: auto;
   @include caret(right);
+
+  .sidebar-nav-link[aria-expanded="true"] &:after {
+    transform: rotate(-45deg);
+  }
 }
 
 .sidebar-subnav {
-  display: none;
-
-  .sidebar-nav-item.active & {
-    display: block;
-  }
 }
 
 .sidebar-nav-title {