custom/static-plugins/NdVoorwindenTheme/src/Resources/views/storefront/layout/navigation/navigation-enrichment.html.twig line 1

Open in your IDE?
  1. {# This element is used in both the offcanvas navigation AND the flyout navigation on desktop. #}
  2. {% set categoryName = category.name ?? category.translated.name %}
  3. {% set additionalMenuId = categoryName|lower %}
  5. {% if page.header.extensions.additional_menus.get('inspiration-'~additionalMenuId) %}
  6.     <div class="navigation-offcanvas-inspiration {% if location == 'offcanvas' %}{% else %}flyout{% endif %}">
  7.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-xl mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationInspiration"|trans|sw_sanitize }}</h4>
  8.         <ul class="{% if location == 'offcanvas' %}divide-y divide-grey-400{% endif %}">
  9.             {% for item in page.header.extensions.additional_menus.get('inspiration-'~additionalMenuId).elements %}
  10.                 {% set isActive = item.id == activeId %}
  11.                 {% set hasChildren = item.visibleChildCount > 0 %}
  12.                 {% set url = category_url(item) %}
  13.                 {% set name = item.translated.name %}
  14.                 {% set img = item.media %}
  15.                 {% set isRoot = activeId == context.salesChannel.navigationCategoryId %}
  16.                 <li class="navigation-offcanvas-list-item">
  17.                     <a class="navigation-offcanvas-link flex items-center grid-gap-4 nav-item nav-link hover:text-black{% if isActive %} active{% endif %}{% if location == 'flyout' %} py-2{% endif %}"
  18.                        href="{{ url }}"
  19.                        itemprop="url"
  20.                        {% if category_linknewtab(item) %}target="_blank"{% endif %}
  21.                        title="{{ name }}">
  22.                         <div class="flex justify-between w-full items-center {% if location == 'offcanvas' %}py-4{% else %}py-1{% endif %}">
  23.                             <span itemprop="name">{{ name }}</span>
  24.                             <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon text-black">
  25.                             {% sw_icon 'chevron-right' style { 'pack':'theme-icons', 'size': '12' } %}
  26.                         </span>
  27.                         </div>
  28.                     </a>
  29.                 </li>
  30.             {% endfor %}
  31.         </ul>
  32.     </div>
  33. {% endif %}
  34. {% if page.header.extensions.additional_menus.get('department-'~additionalMenuId) %}
  35.     <div class="navigation-offcanvas-department {% if location == 'offcanvas' %}py-6{% else %}flyout{% endif %}">
  36.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-xl mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationDepartment"|trans|sw_sanitize }}</h4>
  37.         <ul class="{% if location == 'offcanvas' %}divide-y divide-grey-400{% endif %}">
  38.             {% for item in page.header.extensions.additional_menus.get('department-'~additionalMenuId).elements %}
  39.                 {% set isActive = item.id == activeId %}
  40.                 {% set hasChildren = item.visibleChildCount > 0 %}
  41.                 {% set url = category_url(item) %}
  42.                 {% set name = item.translated.name %}
  43.                 {% set img = item.media %}
  44.                 {% set isRoot = activeId == context.salesChannel.navigationCategoryId %}
  45.                 <li class="navigation-offcanvas-list-item">
  46.                     <a class="navigation-offcanvas-link flex items-center grid-gap-4 nav-item nav-link hover:text-black{% if isActive %} active{% endif %}{% if location == 'flyout' %} py-2{% endif %}"
  47.                        href="{{ url }}"
  48.                        itemprop="url"
  49.                        {% if category_linknewtab(item) %}target="_blank"{% endif %}
  50.                        title="{{ name }}">
  51.                         <div class="flex justify-between w-full items-center {% if location == 'offcanvas' %}py-4{% else %}py-1{% endif %}">
  52.                             <span itemprop="name">{{ name }}</span>
  53.                             <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon text-black">
  54.                             {% sw_icon 'chevron-right' style { 'pack':'theme-icons', 'size': '12' } %}
  55.                         </span>
  56.                         </div>
  57.                     </a>
  58.                 </li>
  59.             {% endfor %}
  60.         </ul>
  61.     </div>
  62. {% endif %}
  63. {% if page.header.extensions.additional_menus.get('brands-'~additionalMenuId) %}
  64.     <div class="navigation-offcanvas-brands {% if location == 'offcanvas' %}py-4{% else %}flyout{% endif %}">
  65.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-lg mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationBrands"|trans|sw_sanitize }}</h4>
  66.         {% if location == 'offcanvas' %}
  67.         <ul class="flex flex-wrap grid-gap-2 max-w-[600px]">
  68.             {% else %}
  69.             {% endif %}
  70.             {% for item in page.header.extensions.additional_menus.get('brands-'~additionalMenuId).elements %}
  71.                 {% set url = category_url(item) %}
  72.                 {% if location == 'offcanvas' %}<li class="navigation-offcanvas-list-item">{% endif %}
  73.                 <a class="navigation-offcanvas-link nav-item nav-link {% if location == 'offcanvas' %}flex items-center grid-gap-4{% else %}leading-9{% endif %}"
  74.                    href="{{ url }}"
  75.                    itemprop="url"
  76.                    title="{{ item.translated.name }}">
  77.                     <span class="hover:text-black" itemprop="brand">{{ item.translated.name }}</span>
  79.                     {% if location == 'offcanvas' %}
  80.                         {% if not loop.last %}
  81.                             <span class="seperator inline-block mx-1">&bull;</span>
  82.                         {% endif %}
  83.                     {% else %}
  84.                         <span class="seperator inline-block mx-1">&bull;</span>
  85.                     {% endif %}
  86.                 </a>
  87.                 {% if location == 'offcanvas' %}</li>{% endif %}
  88.             {% endfor %}
  89.             {% if location == 'offcanvas' %}</ul>{% endif %}
  90.         <a class="text-black underline mt-2 {% if location == 'offcanvas' %}font-medium block{% else %}{% endif %}"
  91.            href="/merken/"
  92.            title="{{ "themeGlobal.showAllBrands"|trans|sw_sanitize }}">
  93.             {{ "themeGlobal.showAllBrands"|trans|sw_sanitize }}
  94.         </a>
  95.     </div>
  96. {% endif %}
  97. {% if page.header.extensions.additional_menus.get('ladies-'~additionalMenuId) %}
  98.     <div class="navigation-offcanvas-ladies {% if location == 'offcanvas' %}{% else %}flyout{% endif %}">
  99.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-xl mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationLadies"|trans|sw_sanitize }}</h4>
  100.         <ul class="{% if location == 'offcanvas' %}divide-y divide-grey-400{% endif %}">
  101.             {% for item in page.header.extensions.additional_menus.get('ladies-'~additionalMenuId).elements %}
  102.                 {% set isActive = item.id == activeId %}
  103.                 {% set hasChildren = item.visibleChildCount > 0 %}
  104.                 {% set url = category_url(item) %}
  105.                 {% set name = item.translated.name %}
  106.                 {% set img = item.media %}
  107.                 {% set isRoot = activeId == context.salesChannel.navigationCategoryId %}
  108.                 <li class="navigation-offcanvas-list-item">
  109.                     <a class="navigation-offcanvas-link flex items-center grid-gap-4 nav-item nav-link hover:text-black{% if isActive %} active{% endif %}{% if location == 'flyout' %} py-2{% endif %}"
  110.                        href="{{ url }}"
  111.                        itemprop="url"
  112.                        {% if category_linknewtab(item) %}target="_blank"{% endif %}
  113.                        title="{{ name }}">
  114.                         <div class="flex justify-between w-full items-center {% if location == 'offcanvas' %}py-4{% endif %}">
  115.                             <span itemprop="name">{{ name }}</span>
  116.                             <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon text-black">
  117.                             {% sw_icon 'chevron-right' style { 'pack':'theme-icons', 'size': '12' } %}
  118.                         </span>
  119.                         </div>
  120.                     </a>
  121.                 </li>
  122.             {% endfor %}
  123.         </ul>
  124.     </div>
  125. {% endif %}
  126. {% if page.header.extensions.additional_menus.get('gentlemen-'~additionalMenuId) %}
  127.     <div class="navigation-offcanvas-gentlemen {% if location == 'offcanvas' %}{% else %}flyout{% endif %}">
  128.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-xl mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationGentlemen"|trans|sw_sanitize }}</h4>
  129.         <ul class="{% if location == 'offcanvas' %}divide-y divide-grey-400{% endif %}">
  130.             {% for item in page.header.extensions.additional_menus.get('gentlemen-'~additionalMenuId).elements %}
  131.                 {% set isActive = item.id == activeId %}
  132.                 {% set hasChildren = item.visibleChildCount > 0 %}
  133.                 {% set url = category_url(item) %}
  134.                 {% set name = item.translated.name %}
  135.                 {% set img = item.media %}
  136.                 {% set isRoot = activeId == context.salesChannel.navigationCategoryId %}
  137.                 <li class="navigation-offcanvas-list-item">
  138.                     <a class="navigation-offcanvas-link flex items-center grid-gap-4 nav-item nav-link hover:text-black{% if isActive %} active{% endif %}{% if location == 'flyout' %} py-2{% endif %}"
  139.                        href="{{ url }}"
  140.                        itemprop="url"
  141.                        {% if category_linknewtab(item) %}target="_blank"{% endif %}
  142.                        title="{{ name }}">
  143.                         <div class="flex justify-between w-full items-center {% if location == 'offcanvas' %}py-4{% endif %}">
  144.                             <span itemprop="name">{{ name }}</span>
  145.                             <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon text-black">
  146.                             {% sw_icon 'chevron-right' style { 'pack':'theme-icons', 'size': '12' } %}
  147.                         </span>
  148.                         </div>
  149.                     </a>
  150.                 </li>
  151.             {% endfor %}
  152.         </ul>
  153.     </div>
  154. {% endif %}
  155. {% if page.header.extensions.additional_menus.get('kids-'~additionalMenuId) %}
  156.     <div class="navigation-offcanvas-kids {% if location == 'offcanvas' %}{% else %}flyout{% endif %}">
  157.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-xl mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationKids"|trans|sw_sanitize }}</h4>
  158.         <ul class="{% if location == 'offcanvas' %}divide-y divide-grey-400{% endif %}">
  159.             {% for item in page.header.extensions.additional_menus.get('kids-'~additionalMenuId).elements %}
  160.                 {% set isActive = item.id == activeId %}
  161.                 {% set hasChildren = item.visibleChildCount > 0 %}
  162.                 {% set url = category_url(item) %}
  163.                 {% set name = item.translated.name %}
  164.                 {% set img = item.media %}
  165.                 {% set isRoot = activeId == context.salesChannel.navigationCategoryId %}
  166.                 <li class="navigation-offcanvas-list-item">
  167.                     <a class="navigation-offcanvas-link flex items-center grid-gap-4 nav-item nav-link hover:text-black{% if isActive %} active{% endif %}{% if location == 'flyout' %} py-2{% endif %}"
  168.                        href="{{ url }}"
  169.                        itemprop="url"
  170.                        {% if category_linknewtab(item) %}target="_blank"{% endif %}
  171.                        title="{{ name }}">
  172.                         <div class="flex justify-between w-full items-center {% if location == 'offcanvas' %}py-4{% endif %}">
  173.                             <span itemprop="name">{{ name }}</span>
  174.                             <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon text-black">
  175.                             {% sw_icon 'chevron-right' style { 'pack':'theme-icons', 'size': '12' } %}
  176.                         </span>
  177.                         </div>
  178.                     </a>
  179.                 </li>
  180.             {% endfor %}
  181.         </ul>
  182.     </div>
  183. {% endif %}
  184. {% if page.header.extensions.additional_menus.get('sport-'~additionalMenuId) %}
  185.     <div class="navigation-offcanvas-sport {% if location == 'offcanvas' %}{% else %}flyout{% endif %}">
  186.         <h4 class="navigation-title {% if location == 'offcanvas' %}text-xl mb-2{% else %}h2 mb-4 uppercase{% endif %}">{{ "themeGlobal.navigationSport"|trans|sw_sanitize }}</h4>
  187.         <ul class="{% if location == 'offcanvas' %}divide-y divide-grey-400{% endif %}">
  188.             {% for item in page.header.extensions.additional_menus.get('sport-'~additionalMenuId).elements %}
  189.                 {% set isActive = item.id == activeId %}
  190.                 {% set hasChildren = item.visibleChildCount > 0 %}
  191.                 {% set url = category_url(item) %}
  192.                 {% set name = item.translated.name %}
  193.                 {% set img = item.media %}
  194.                 {% set isRoot = activeId == context.salesChannel.navigationCategoryId %}
  195.                 <li class="navigation-offcanvas-list-item">
  196.                     <a class="navigation-offcanvas-link flex items-center grid-gap-4 nav-item nav-link hover:text-black{% if isActive %} active{% endif %}{% if location == 'flyout' %} py-2{% endif %}"
  197.                        href="{{ url }}"
  198.                        itemprop="url"
  199.                        {% if category_linknewtab(item) %}target="_blank"{% endif %}
  200.                        title="{{ name }}">
  201.                         <div class="flex justify-between w-full items-center {% if location == 'offcanvas' %}py-4{% endif %}">
  202.                             <span itemprop="name">{{ name }}</span>
  203.                             <span class="navigation-offcanvas-link-icon js-navigation-offcanvas-loading-icon text-black">
  204.                             {% sw_icon 'chevron-right' style { 'pack':'theme-icons', 'size': '12' } %}
  205.                         </span>
  206.                         </div>
  207.                     </a>
  208.                 </li>
  209.             {% endfor %}
  210.         </ul>
  211.     </div>
  212. {% endif %}