j1-template 2020.0.4 → 2020.0.9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9ed33fae1215efb36d11eb406cdf2b4f724505c2a91e56a8154df048cf9f808c
-  data.tar.gz: fc8619dd7bdf3d5fd758636680651ef196e1a3b4c110bc9499e7922e48ef1a53
+  metadata.gz: eb7db370db96635c32c8d18eeab6e27ec39d202c5a3d44fd9ab330b5958734d5
+  data.tar.gz: 8305584dae33b00c78da10e82cacfa82e3e6ba05d724ddf14daa04ac7696d9b7
 SHA512:
-  metadata.gz: cd83535639e49facaa4f1edcb0754a403d32794737540c58121f82cb0496d79d56b76ff40a3d148c59f3d68281b95383e97ba023f860f8d78018df46f8329c2c
-  data.tar.gz: 2e4a397041b0610b5e1df1f82676e477682e992f9df10439040a6be890a0924ff937cf9cc4ead97897aa7f3212586d37f122d887b9081be6e6071c037d796d8f
+  metadata.gz: 52d68902e6b572a13557eff716ca42436ca0650d3859a18660f28052bc3eff0baaa831773af761202aca690458b724f699d5a186eb081077efe4ba19e2f3ed81
+  data.tar.gz: 8d5404d9dd56733813a1433367024bb5557b07462ec4dd0439786fa807380a0891933a7326d74844c1e0b1c0ea59a8d4e62491a4c5962e19d8b323e0ab935e21

data/_includes/themes/j1/layouts/content_generator_blog_archive.html

@@ -67,7 +67,7 @@
 -------------------------------------------------------------------------------- {% endcomment %}
   <!-- [INFO   ] [j1.layout.content_generator_blog.html  ] [Begin content] -->
   <!-- split page to place a sidebar e.g. the document TOC -->
-  <div class="container mb-5">
+  <div class="container mr-5 mb-5">
     <div class="row">
 
       <!-- main class="col-md-9 col-xs-12 r-text-{{rtext_size}} js-toc-content" -->

data/_includes/themes/j1/layouts/content_generator_collection.html

@@ -62,7 +62,7 @@
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
   <!-- [INFO   ] [j1.layout.content_generator_coll.html  ] [ begin content ] -->
-  <div class="container mb-5">
+  <div class="container mr-5 mb-5">
     <div class="row">
 
     {% comment %} COLLECTION content

data/_includes/themes/j1/layouts/content_generator_page.html

@@ -61,7 +61,7 @@
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
 <!-- [INFO   ] [j1.layout.content_generator_page.html ] [ begin content ] -->
-<div class="container mb-5">
+<div class="container mr-5 mb-5">
   <div class="row">
 
     {% if sidebar == false %}

data/_includes/themes/j1/layouts/content_generator_post.html

@@ -65,9 +65,9 @@
 -------------------------------------------------------------------------------- {% endcomment %}
 <!-- [INFO   ] [j1.layout.content_generator_post.html ] [ begin content ] -->
 {% if page.comments %}
-  <div class="container mb-0">
+  <div class="container mr-5 mb-0">
 {% else %}
-  <div class="container mb-5"> <!-- Add additional space between end of article and the footer -->
+  <div class="container mr-5 mb-5"> <!-- Add additional space between end of article and the footer -->
 {% endif %}
 
 
@@ -98,7 +98,7 @@
               </button>
               <ul class="nav navbar-nav">
                 <li class="nav-item">
-                  <span class="nav-link">Series Navigator</span>
+                  <span class="navbar-text">Series Navigator</span>
                 </li>
               </ul>
             </div>
@@ -158,7 +158,7 @@
               </button>
               <ul class="nav navbar-nav">
                 <li class="nav-item">
-                  <span class="nav-link">Series Navigator: {{page.series}}</span>
+                  <span class="navbar-text">Series Navigator: {{page.series}}</span>
                 </li>
               </ul>
             </div>

data/_includes/themes/j1/modules/navigator/generator.html

@@ -56,6 +56,9 @@
 {% assign cookiebar_defaults          = site.data.modules.defaults.cookiebar.defaults %}
 {% assign cookiebar_settings          = site.data.modules.cookiebar.settings %}
 
+{% assign ssm_settings                = modules.ssm.settings %}
+{% assign ssm_defaults                = modules.defaults.ssm.defaults %}
+
 {% comment %} Set config data
 -------------------------------------------------------------------------------- {% endcomment %}
 {% assign nav_bar_defaults            = navigator_defaults.nav_bar %}
@@ -81,6 +84,7 @@
 {% assign authentication_options      = authentication_defaults | merge: authentication_settings %}
 {% assign auth_manager_options        = authentication_options.j1_auth %}
 {% assign nav_mmenu_options           = nav_mmenu_defaults | merge: nav_mmenu_settings %}
+{% assign ssm_options                 = ssm_defaults | merge: ssm_settings %}
 
 {% comment %} Set navBarOptions
 -------------------------------------------------------------------------------- {% endcomment %}
@@ -112,11 +116,17 @@
 
 {% capture nav_bar_default_css_classes %}navbar navigator navbar-expand-{{nav_navbar_media_breakpoint}} navbar-default{% endcapture %}
 
-
-
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
 
+{% comment %} Generate SSM container
+-------------------------------------------------------------------------------- {% endcomment %}
+<!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ check for ssm ] -->
+{% if ssm_options.enabled %}
+<!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place ssm container for AJAX load ] -->
+<nav id="ssm-container" class="ssm-btns-right ssm-anim-slide no-r-text"></nav>
+{% endif %}
+
 {% comment %} Generate TopSearch container
 -------------------------------------------------------------------------------- {% endcomment %}
 <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ check for topsearch ] -->
@@ -132,7 +142,7 @@
 {% for item in nav_mmenu_options.menus %}
 <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ processing: {{item.menu.xhr_container_id}} ] -->
 
-{% comment %} Conditiuon DISABLED for testing
+{% comment %} Condition DISABLED for testing
 --------------------------------------------------------------------------------
 {% if item.menu.enabled %}
 <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place mmenu container for AJAX load ] -->
@@ -155,9 +165,9 @@
   {% if brand_position == "left" %}
     <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place brand image to the: left ] -->
     {% if site.brand.image %}
-      <a id="navbar-brand" class="navbar-brand animated" href="#"> <img src="{{ site.data.template_settings.image_path }}/{{ site.brand.image }}" height="{{ site.brand.image_height }}" alt="{{ site.brand.text }}"></a>
+      <a id="navbar-brand" class="navbar-brand animated"> <img src="{{ site.data.template_settings.image_path }}/{{ site.brand.image }}" height="{{ site.brand.image_height }}" alt="{{ site.brand.text }}"></a>
     {% else %}
-      <a id="navbar-brand" class="navbar-brand animated" href="#" "> <b><font color="{{site.brand.text_color}}">{{ site.brand.text }}</font></b></a>
+      <a id="navbar-brand" class="navbar-brand animated"> <b><font color="{{site.brand.text_color}}">{{ site.brand.text }}</font></b></a>
     {% endif %}
     <button id="navbar-toggler" type="button" class="navigator navbar-toggler animated fadeIn" data-toggle="collapse" data-target="#{{nav_menu_id}}" aria-controls="{{nav_menu_id}}" aria-expanded="false" aria-label="Toggle navigation">
       <i class="mdi mdi-menu mdi-48px"></i>
@@ -165,20 +175,20 @@
   {% elsif brand_position == "right" %}
     <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place brand to the: right ] -->
     {% if site.brand.image %}
-      <a id="navbar-brand" class="navbar-brand animated" href="#"> <img src="{{ site.data.template_settings.image_path }}/{{ site.brand.image }}" height="{{ site.brand.image_height }}" alt="{{ site.brand.text }}"></a>
+      <a id="navbar-brand" class="navbar-brand animated"> <img src="{{ site.data.template_settings.image_path }}/{{ site.brand.image }}" height="{{ site.brand.image_height }}" alt="{{ site.brand.text }}"></a>
     {% else %}
-      <a id="navbar-brand" class="navbar-brand animated" href="#" "> <b><font color="{{site.brand.text_color}}">{{ site.brand.text }}</font></b></a>
+      <a id="navbar-brand" class="navbar-brand animated"> <b><font color="{{site.brand.text_color}}">{{ site.brand.text }}</font></b></a>
     {% endif %}
-    <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place menu toggler to the: left ] -->
-    <button id="navbar-toggler" type="button" class="navigator navbar-toggler animated fadeIn" data-toggle="collapse" data-target="#{{nav_menu_id}}" aria-controls="{{nav_menu_id}}" aria-expanded="false" aria-label="Toggle navigation">
-      <i class="mdi mdi-menu mdi-48px"></i>
+    <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place mobile menu button to the: left ] -->
+    <button id="mmenu-button" type="button" class="navigator navbar-toggler animated fadeIn" data-toggle="collapse" data-target="#{{nav_menu_id}}" aria-controls="{{nav_menu_id}}" aria-expanded="false" aria-label="Toggle navigation">
+      <i class="mdi mdi-menu mdi-36px"></i>
     </button>
   {% else %}
     <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place brand to default position: left ] -->
     {% if site.brand.image %}
-      <a id="navbar-brand" class="navbar-brand animated" href="#"> <img src="{{ site.data.template_settings.image_path }}/{{ site.brand.image }}" height="{{ site.brand.image_height }}" alt="{{ site.brand.text }}"></a>
+      <a id="navbar-brand" class="navbar-brand animated"> <img src="{{ site.data.template_settings.image_path }}/{{ site.brand.image }}" height="{{ site.brand.image_height }}" alt="{{ site.brand.text }}"></a>
     {% else %}
-      <a id="navbar-brand" class="navbar-brand animated" href="#" "> <b><font color="{{site.brand.text_color}}">{{ site.brand.text }}</font></b></a>
+      <a id="navbar-brand" class="navbar-brand animated"> <b><font color="{{site.brand.text_color}}">{{ site.brand.text }}</font></b></a>
     {% endif %}
     <!-- [INFO   ] [j1.modules.navigator.generator.html   ] [ place menu toggler to the: right ] -->
     <button id="navbar-toggler" type="button" class="navigator navbar-toggler animated fadeIn" data-toggle="collapse" data-target="#{{nav_menu_id}}" aria-controls="{{nav_menu_id}}" aria-expanded="false" aria-label="Toggle navigation">

data/_includes/themes/j1/procedures/layouts/module_writer.proc

@@ -267,4 +267,4 @@ NO need to load this again
     {% assign resource_settings.data            = nil %}
     ---------------------------------------------------------------------------- {% endcomment %}
   {% endif %}
-{% endif %}
+{% endif %}

data/assets/data/menu.html

@@ -7,7 +7,8 @@ regenerate:                             true
 {% comment %}
  # -----------------------------------------------------------------------------
  # ~/assets/data/menu.html
- # Liquid procedure to generate HTML portion of the main menu bar
+ # Liquid procedure to generate HTML portion of the main menu
+ # for the desktop version
  # NOTE: Loaded dynamically by J1 NAV Manager module (AJAX)
  #
  # Product/Info:

data/assets/data/mmenu.html

@@ -6,8 +6,8 @@ regenerate:                             true
 
 {% comment %}
  # -----------------------------------------------------------------------------
- # ~/assets/data/menu.html
- # Liquid procedure to generate HTML portion of the main menu bar
+ # ~/assets/data/mmenu.html
+ # Liquid procedure to generate HTML portion of the mobile menu
  # NOTE: Loaded dynamically by J1 NAV Manager module (AJAX)
  #
  # Product/Info:
@@ -137,7 +137,7 @@ regenerate:                             true
 <!-- [DEBUG  ] [j1.modules.mmenu.html  ] [collect all nav links for the navigation bar (navbar)] -->
 <!-- div id="{{nav_menu_id}}" class="{{dropdown_collapse}}" -->
 <!-- div class="{{dropdown_collapse}}" -->
-  <ul id="mobile_menu">
+  <ul id="menu_mmenu" style="display:none">
 
   {% for menu in navigator_menu_config %}
 

data/assets/data/mmenu_sidebar.html

@@ -89,7 +89,7 @@ regenerate:                             true
 
 <!-- [INFO   ] [ j1.modules.navigator.mmenu_sidebar.html ] [Start processing: sidebar] -->
 <!-- use BS4 class d-block to make sure, the sidebar is VISIBLE on ALL @media -->
-<div class="mm-side d-block">
+<div id="sidebar_mmenu" class="mm-side" style="display:none">
 {% for boxes in sidebar_options.boxes %}
   {% for box in boxes %}
 

data/assets/data/mmenu_toc.html

@@ -26,7 +26,7 @@ regenerate:                             true
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
 <!-- [INFO   ] [ j1.modules.navigator.mmenu_toc.html ] [Start processing: toc] -->
-<div class="mm-side">
+<div id="toc_mmenu" class="mm-side" style="display:none">
   <div class="widget">
     <h4 class="heading">Table of Contents</h4>
   </div>

data/assets/data/quicklinks.html

@@ -208,8 +208,6 @@ regenerate:                             true
 <!-- [INFO   ] [j1.modules.navigator.quicklinks.html  ] [Set icon familiy as: {{ icon_family }}] -->
 <!-- [INFO   ] [j1.modules.navigator.quicklinks.html  ] [Set icon size as: {{ icon_size }}] -->
 
-{% assign show_toc_icon = true %}
-
 <ul class="navbar-nav">
   {% if back_url != "none" %}<li id="quickLinksHomeButton" class="nav-item"><a id="page_back_id" class="nav-icon" href="{{back_url}}"><i class="{{icon_family}} {{icon_family}}-{{back_icon}} {{icon_size}}"></i></a></li>{% endif %}
   {% if home_url != "none" %}<li id="quickLinksHomeButton" class="nav-item"><a id="home_id" class="nav-icon" href="{{home_url}}"><i class="{{icon_family}} {{icon_family}}-{{home_icon}} {{icon_size}}"></i></a></li>{% endif %}
@@ -224,7 +222,6 @@ regenerate:                             true
   {% if show_quick_search_icon %}<li id="quickLinksSearchButton" class="nav-item search"><a class="nav-icon" href="#"><i class="{{icon_family}} {{icon_family}}-{{search_icon}} {{icon_size}}"></i></a></li>{% endif %}
   {% if show_control_center_icon %}<li id="quickLinksControlCenterButton" class="nav-item control-center" style="display: block;"><a class="nav-icon" href="{{control_center_url}}"><i class="{{icon_family}} {{icon_family}}-{{control_center_icon}} {{icon_size}}"></i></a></li>{% endif %}
   {% if show_r_text_icon %}<li id="quickLinksRTextButton" class="nav-item control-center" style="display: block;"><a class="nav-icon" href="#" data-toggle="modal" data-target="#fluidModalRTextResizer"><i class="{{icon_family}} {{icon_family}}-{{r_text_icon}} {{icon_size}}"></i></a></li>{% endif %}
-  {% if show_toc_icon %}<li id="quickLinksTocButton" class="nav-item"><a id="toc-toggler" class="nav-icon" href="#"><i class="{{icon_family}} {{icon_family}}-{{toc_icon}} {{icon_size}}"></i></a></li>{% endif %}
 </ul>
 
 mdi-menu

data/assets/data/ssm.html

@@ -0,0 +1,231 @@
+---
+regenerate:                             true
+---
+
+{% capture cache %}
+
+{% comment %}
+ # -----------------------------------------------------------------------------
+ # ~/assets/data/ssm.html
+ # Liquid procedure to generate HTML portion for the Sticky Side Menu
+ # container
+ #
+ # NOTE: Loaded dynamically by J1 NAV Manager module (AJAX)
+ #
+ # Product/Info:
+ # https://jekyll.one
+ #
+ # Copyright (C) 2020 Juergen Adams
+ #
+ # J1 Template is licensed under the MIT License.
+ # See: https://github.com/jekyll-one-org/J1 Template/blob/master/LICENSE
+ # -----------------------------------------------------------------------------
+ # Test data:
+ #    {{variable | debug}}
+ # -----------------------------------------------------------------------------
+{% endcomment %}
+
+{% comment %} Liquid procedures (unused)
+--------------------------------------------------------------------------------
+{% capture select_color     %}themes/{{site.template.name}}/procedures/global/select_color.proc{% endcapture %}
+{% capture select_icon_size %}themes/{{site.template.name}}/procedures/global/select_icon_size.proc{% endcapture %}
+-------------------------------------------------------------------------------- {% endcomment %}
+
+{% comment %} Liquid var initialization
+-------------------------------------------------------------------------------- {% endcomment %}
+
+{% comment %} Set config files
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign site_config     = site %}
+{% assign template_config = site.data.template_settings %}
+{% assign modules         = site.data.modules %}
+
+{% comment %} Set config data
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign ssm_settings    = modules.ssm.settings %}
+{% assign ssm_defaults    = modules.defaults.ssm.defaults %}
+
+{% comment %} Set config options
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign ssm_options     = ssm_defaults | merge: ssm_settings %}
+{% assign ssm_menu_config = ssm_options.items %}
+
+{% comment %} Set permalink setting
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign ext = '' %}
+{% if site.permalink == 'none' %}
+  {% assign ext = '.html' %}
+{% endif %}
+
+{% comment %} Set base icons and sizes
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign ssm_menu_icon_family         = ssm_options.icon_family %}
+{% assign ssm_menu_icon_style          = ssm_options.icon_style %}
+{% assign ssm_menu_icon_color          = ssm_options.icon_color %}
+{% assign ssm_menu_icon_size           = ssm_options.icon_size %}
+
+{% assign icon_family = ssm_menu_icon_family | strip | downcase %}
+
+{% if icon_family == 'fontawesome' or icon_family == 'fontawesome5' %}
+  {% assign ssm_menu_icon_family  = 'fa' %}
+  {% assign ssm_menu_icon_style   = ssm_menu_icon_style %}
+{% elsif icon_family == 'mdi' %}
+  {% assign ssm_menu_icon_family  = 'mdi' %}
+  {% assign ssm_menu_icon_style   = ssm_menu_icon_style %}
+{% else %}
+  {% assign ssm_menu_icon_family  = 'mdi' %}
+  {% assign ssm_menu_icon_style   = ssm_menu_icon_style %}
+{% endif %}
+
+{% comment %} unused
+--------------------------------------------------------------------------------
+{% include {{select_color}} color=ssm_menu_icon_color fallback="#9E9E9E" %}
+{% assign ssm_menu_icon_color = color %}
+
+{% include {{select_icon_size}} family=ssm_menu_icon_family size=ssm_menu_icon_size %}
+{% assign ssm_menu_icon_size = size %}
+-------------------------------------------------------------------------------- {% endcomment %}
+
+{% comment %} Main
+-------------------------------------------------------------------------------- {% endcomment %}
+<!-- [DEBUG  ] [j1.modules.ssm_menu.html  ] [collect all menu items] -->
+  <ul id="{{ssm_options.menu_id}}" class="ssm-light-hover">
+
+  {% for menu in ssm_menu_config %}
+
+    {% comment %} {{menu | debug}}
+    ---------------------------------------------------------------------------- {% endcomment %}
+
+    {% comment %} Identify the menu (item) type
+    ---------------------------------------------------------------------------- {% endcomment %}
+    {% if menu.sublevel %}
+      {% assign menu_type = 'sublevel_menu' %}
+    {% elsif menu.sublevel == null and menu.megamenu == null and menu.login_menu == null and menu.theme_select == null %}
+      {% assign menu_type = 'top_level_item' %}
+    {% endif %}
+
+    {% comment %} Process all menu sections
+    ---------------------------------------------------------------------------- {% endcomment %}
+    {% case menu_type %}
+
+    {% comment %} Collect items having a SUB menue
+    ---------------------------------------------------------------------------- {% endcomment %}
+    {% when 'sublevel_menu' %}
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [found menu-type: sub-menue] -->
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [submenu sublevel detected] -->
+      {% if menu.enabled %}
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [processing: sublevel] -->
+      <li class="ssm-share-btn ssm-btn">
+        {% if menu.icon == null %}
+          <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [no menu icon found] -->
+          <a href="#"><span class="ssm-btn-text">{{menu.item}}</span>>
+            <i class="{{ssm_menu_icon_family}} {{ssm_menu_icon_family}}-{{menu.icon}} {{menu.icon_classes}} {{ssm_menu_icon_color}} {{ssm_menu_icon_size}} ml-2 mr-2"></i>
+            <span class="ssm-btn-text">{{menu.item}}</span>
+          </a>
+        {% else %}
+          <a href="#"> <i class="{{ssm_menu_icon_family}} {{ssm_menu_icon_family}}-{{menu.icon}} {{menu.icon_classes}} {{ssm_menu_icon_color}} {{ssm_menu_icon_size}} ml-2 mr-2"></i><span class="ssm-btn-text">{{menu.item}}</span></a>
+        {% endif %}
+        <div class="ssm-sub-menu">
+          <ul>
+          {% for sublevel in menu.sublevel %}
+            {% if sublevel.event_handler == null %}
+              <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [no event_handler found, create simple URL ] -->
+              {% if sublevel.icon == null %}
+                <li id="{{sublevel.id}}" class="ssm-btn">
+                  <a href="{{sublevel.href}}{{ext}}">{{sublevel.title}}</a>
+                </li>
+              {% else %}
+                <li id="{{sublevel.id}}" class="ssm-btn">
+                  <a href="{{sublevel.href}}{{ext}}" target="{{sublevel.target}}">{{sublevel.title}}</a>
+                </li>
+              {% endif %}
+            {% else %}
+              <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [event_handler found, register click event ] -->
+              <li id="{{sublevel.id}}" class="ssm-btn">
+                <a href="{{sublevel.href}}{{ext}}" target="{{sublevel.target}}"
+                  onclick="{{sublevel.event_handler}}">
+                  <i class="{{ssm_menu_icon_family}} {{ssm_menu_icon_family}}-{{sublevel.icon}}  {{sublevel.icon_classes}} {{ssm_menu_icon_color}} {{ssm_menu_icon_size}} ml-2 mr-2"></i>
+                  {{sublevel.title}}
+                </a>
+              </li>
+            {% endif %}
+          {% endfor %} <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [end processing: sublevel] -->
+          </ul>
+        </div>
+      </li>
+      {% else %}
+        <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [sublevel menu disabled: {{sublevel.id}}] -->
+      {% endif %}
+
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [reset menu_type for next loop] -->
+    {% assign menu_type = '' %}
+
+    {% comment %} Collect TOP-LEVEL items (NO sub-menu)
+    ---------------------------------------------------------------------------- {% endcomment %}
+    {% when 'top_level_item' %}
+
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [found menu-type: menu-top-level-only] -->
+      {% if menu.icon == null %}
+        <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [no icon for menu-item found -->
+        {% if menu.target == null %}
+          <li class="ssm-btn">
+            <a id="{{menu.id}}" href="{{menu.href}}{{ext}}">
+              <span class="ssm-btn-text">{{menu.item}}</span>
+            </a>
+          </li>
+        {% else %}
+          <li class="ssm-btn">
+            <a id="{{menu.id}}" href="{{menu.href}}{{ext}}" target="{{menu.target}}">
+              <span class="ssm-btn-text">{{menu.item}}</span>
+          </a>
+          </li>
+        {% endif %}
+      {% elsif menu.icon %}
+        <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [icon for menu-item found -->
+        {% if menu.href == null %}
+          {% if menu.enabled  %}
+          <li class="ssm-btn">
+            <!-- a href="{{menu.href}}{{ext}}" -->
+            <a id="{{menu.id}}">
+              <i class="{{ssm_menu_icon_family}} {{ssm_menu_icon_family}}-{{menu.icon}} {{menu.icon_classes}} {{ssm_menu_icon_color}} {{ssm_menu_icon_size}} ml-2 mr-2"></i>
+              <span class="ssm-btn-text">{{menu.item}}</span>
+            </a>
+          </li>
+          {% else %}
+            <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [menu item disabled: {{menu.id}}] -->
+          {% endif %}
+        {% else %}
+          {% if menu.enabled %}
+          <li class="ssm-btn">
+            <a id="{{menu.id}}" href="{{menu.href}}{{ext}}" target="{{menu.target}}">
+              <i class="{{ssm_menu_icon_family}} {{ssm_menu_icon_family}}-{{menu.icon}} {{menu.icon_classes}} {{ssm_menu_icon_color}} {{ssm_menu_icon_size}}  ml-2 mr-2"></i>
+              <span class="ssm-btn-text">{{menu.item}}</span>
+            </a>
+          </li>
+          {% else %}
+            <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [menu item disabled: {{menu.id}}] -->
+          {% endif %}
+        {% endif %}
+      {% else %}
+        <!-- [FATAL ] [ssm-top-level-only       ] [processing menu item failed] -->
+      {% endif %}
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [menu-top-level-only: end items] -->
+      <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [reset menu_type for next loop] -->
+      {% assign menu_type = '' %}
+
+      {% comment %} Collect items failed
+      -------------------------------------------------------------------------- {% endcomment %}
+      {% else %}
+        <!-- [FATAL  ] [j1.modules.ssm_menu.html  ] [detecting menu items|type failed] -->
+    {% assign menu_type = '' %}
+
+    {% endcase %}
+
+  {% endfor %}
+  <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [nav_menu_settings: end menu] -->
+  </ul>
+  <!-- [INFO   ] [j1.modules.ssm_menu.html  ] [nav_menu_settings: end ssc container] -->
+
+{% endcapture %}
+{{cache | pretty_print | remove:'<html><body>' | remove:'</body></html>' | strip_empty_lines}}
+{% assign cache = nil %}