Add possibility to use bootstrap4.

Author: debdolph

menu/templates/bootstrap-navbar-submenu.html

@@ -1,13 +1,14 @@
-<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
+<ul class="dropdown-menu">
     {% for item in items %}
         {% if item.visible %}
-            <a class="dropdown-item {% if item.selected %} active{% endif %}{% if item.children %} dropdown-submenu{% endif %}" href="{{ item.url }}">{{ item.title }}
+            <li class="{% if item.selected %} active{% endif %}{% if item.children %} dropdown-submenu{% endif %}">
+                <a href="{{ item.url }}">{{ item.title }}</a>
                 {% if item.children %}
                     {% with items=item.children template_name='bootstrap-navbar-submenu.html' %}
                        {% include template_name %}
                     {% endwith %}
                 {% endif %}
-            </a>
+            </li>
         {% endif %}
     {% endfor %}
-</div>
+</ul>

menu/templates/bootstrap-navbar.html

@@ -4,8 +4,8 @@
             <li class="divider-vertical"></li>
         {% endif %}
 
-        <li class="nav-item {% if item.selected %} active{% endif %}{% if item.children %} dropdown{% endif %}" id="top-menu-{{ item.slug }}">
-            <a href="{{ item.url }}" {% if not item.children %}class=nav-link {% endif%} {% if item.children %} class="nav-link dropdown-toggle" data-hover="dropdown" data-toggle="dropdown"{% endif %}>
+        <li class="{% if item.selected %} active{% endif %}{% if item.children %} dropdown{% endif %}" id="top-menu-{{ item.slug }}">
+            <a href="{{ item.url }}"{% if item.children %} class="dropdown-toggle" data-hover="dropdown" data-toggle="dropdown"{% endif %}>
                 {% if item.icon %}
                     <i class="icon-{{ item.icon }} icon-white"></i>&nbsp;
                 {% endif %}

menu/templates/bootstrap4-navbar-submenu.html

@@ -0,0 +1,13 @@
+<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
+    {% for item in items %}
+        {% if item.visible %}
+            <a class="dropdown-item {% if item.selected %} active{% endif %}{% if item.children %} dropdown-submenu{% endif %}" href="{{ item.url }}">{{ item.title }}
+                {% if item.children %}
+                    {% with items=item.children template_name='bootstrap-navbar-submenu.html' %}
+                       {% include template_name %}
+                    {% endwith %}
+                {% endif %}
+            </a>
+        {% endif %}
+    {% endfor %}
+</div>

menu/templates/bootstrap4-navbar.html

@@ -0,0 +1,22 @@
+{% for item in menu %}
+    {% if item.visible %}
+        {% if item.separator %}
+            <li class="divider-vertical"></li>
+        {% endif %}
+
+        <li class="nav-item {% if item.selected %} active{% endif %}{% if item.children %} dropdown{% endif %}" id="top-menu-{{ item.slug }}">
+            <a href="{{ item.url }}" {% if not item.children %}class=nav-link {% endif%} {% if item.children %} class="nav-link dropdown-toggle" data-hover="dropdown" data-toggle="dropdown"{% endif %}>
+                {% if item.icon %}
+                    <i class="icon-{{ item.icon }} icon-white"></i>&nbsp;
+                {% endif %}
+                <span>{{ item.title }}</span>
+                {% if item.children %}
+                    &nbsp;<b class="caret"></b>
+                {% endif %}
+            </a>
+            {% if item.children %}
+                {% include 'bootstrap4-navbar-submenu.html' with items=item.children %}
+            {% endif %}
+        </li>
+    {% endif %}
+{% endfor %}