navbar-menu.html 4.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. {% assign current-page = page.menu | default: layout.menu | split: '.' %}
  2. {% assign hide-icons = include.hide-icons %}
  3. {% assign icons-count = site.data.icons | size %}
  4. {% assign menu = site.data.menu %}
  5. {% if include.sample %}
  6. {% assign menu = site.data.menu-sample %}
  7. {% endif %}
  8. <ul class="navbar-nav{% if include.class %} {{ include.class }}{% endif %}">
  9. {% for level-1 in menu %}
  10. {% assign icon = level-1[1].icon %}
  11. <li class="nav-item{% if level-1[0] == current-page[0] or level-1[1].active %} active{% endif %}{% if level-1[1].children %} dropdown{% endif %}">
  12. <a class="nav-link{% if level-1[1].children %} dropdown-toggle{% endif %}{% if level-1[1].disabled %} disabled{% endif %}" {% if level-1[1].children %}href="#navbar-{{ level-1[0] }}" data-bs-toggle="dropdown" data-bs-auto-close="{% if include.keep-open %}false{% else %}outside{% endif %}" role="button" aria-expanded="{% if include.auto-open and level-1[0] == current-page[0] %}true{% else %}false{% endif %}" {% else %}href="{{ site.base }}/{{ level-1[1].url }}" {% endif %}>
  13. {% unless hide-icons %}
  14. <span class="nav-link-icon d-md-none d-lg-inline-block">{% include ui/icon.html icon=icon %}</span>
  15. {% endunless %}
  16. <span class="nav-link-title">
  17. {% if include.long-titles %}
  18. {{ level-1[1].title-long | default: level-1[1].title | replace: '%ICONS_COUNT%', icons-count }}
  19. {% else %}
  20. {{ level-1[1].title | replace: '%ICONS_COUNT%', icons-count }}
  21. {% endif %}
  22. </span>
  23. {% if level-1[1].badge %}
  24. <span class="badge badge-sm bg-red">{{ level-1[1].badge }}</span>
  25. {% endif %}
  26. </a>
  27. {% if level-1[1].children %}
  28. <div class="dropdown-menu{% if level-1[1].right %} dropdown-menu-end{% endif %}{% if include.auto-open and level-1[0] == current-page[0] %} show{% endif %}">
  29. {% if level-1[1].columns %}
  30. <div class="dropdown-menu-columns">
  31. {% assign per-column = level-1[1].children | size | times: 1.0 | divided_by: level-1[1].columns | ceil %}
  32. <div class="dropdown-menu-column">
  33. {% endif %}
  34. {% for level-2 in level-1[1].children %}
  35. {% if level-1[1].columns %}
  36. {% assign modulo = forloop.index0 | modulo: per-column %}
  37. {% if forloop.index > 1 and modulo == 0 %}</div><div class="dropdown-menu-column">{% endif %}
  38. {% endif %}
  39. {% if level-2[1].children %}<div class="dropend">{% endif %}
  40. <a class="dropdown-item{% if level-2[1].children %} dropdown-toggle{% endif %}{% if level-1[0] == current-page[0] and level-2[0] == current-page[1] and current-page.size == 2 %} active{% endif %}{% if level-2[1].color %} text-{{ level-2[1].color }}{% endif %}" {% if level-2[1].children %}href="#sidebar-{{ level-2[0] }}" data-bs-toggle="dropdown" data-bs-auto-close="{% if include.keep-open %}false{% else %}outside{% endif %}" role="button" aria-expanded="false" {% else %}href="{% if level-2[1].url contains 'http://' or level-2[1].url contains 'https://'%}{{ level-2[1].url }}{% else %}{{ site.base }}/{{ level-2[1].url }}{% endif %}"{% endif %}{% if level-2[1].url contains 'http://' or level-2[1].url contains 'https://'%} target="_blank" rel="noopener"{% endif %}>
  41. {% if level-2[1].icon %}
  42. {% assign icon = level-2[1].icon %}
  43. {% include ui/icon.html icon=icon class="icon-inline me-1" %}
  44. {% endif %}
  45. {{ level-2[1].title }}
  46. {% if level-2[1].badge %}
  47. <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">{{ level-2[1].badge }}</span>
  48. {% endif %}
  49. </a>
  50. {% if level-2[1].children %}
  51. <div class="dropdown-menu">
  52. {% for level-3 in level-2[1].children %}
  53. <a href="{% if level-3[1].url contains 'http://' or level-3[1].url contains 'https://'%}{{ level-3[1].url }}{% else %}{{ site.base }}/{{ level-3[1].url }}{% endif %}" class="dropdown-item">
  54. {{ level-3[1].title }}
  55. {% if level-3[1].badge %}
  56. <span class="badge badge-sm bg-green-lt text-uppercase ms-auto">{{ level-3[1].badge }}</span>
  57. {% endif %}
  58. </a>
  59. {% endfor %}
  60. </div>
  61. {% endif %}
  62. {% if level-2[1].children %}</div>{% endif %}
  63. {% endfor %}
  64. {% if level-1[1].columns %}</div></div>{% endif %}
  65. </div>
  66. {% endif %}
  67. </li>
  68. {% endfor %}
  69. {% comment %}
  70. <li class="nav-item d-none-navbar-vertical">
  71. <a href="#" class="nav-link" data-bs-toggle="modal" data-bs-target="#modal-customize">
  72. <span class="nav-link-icon">{% include ui/icon.html icon="adjustments" %}</span>
  73. <span class="nav-link-title">Customize</span>
  74. </a>
  75. </li>
  76. {% endcomment %}
  77. </ul>