{% sw_extends '@Storefront/storefront/layout/navigation/categories.html.twig' %}
{% block layout_navigation_categories_item %}
<div class="navigation-flyout-col{% if treeItem.category.customFields.crehler_category_highlighted %} nav-flyout-highlighted{% if treeItem.category.customFields.crehler_category_highlighted_color %} {{ treeItem.category.customFields.crehler_category_highlighted_color }}{% endif %}{% endif %}">
{% block layout_navigation_categories_item_link %}
{% if treeItem.category.type == 'folder' %}
<div class="nav-item nav-link navigation-flyout-link is-level-{{ level }}"
title="{{ name }}">
<span itemprop="name">{{ name }}</span>
</div>
{% else %}
<a class="nav-item nav-link navigation-flyout-link is-level-{{ level }}{% if id is same as(activeId) %} active{% endif %}"
href="{% if link %}{{ link }}{% else %}{{ seoUrl('frontend.navigation.page', { navigationId: id }) }}{% endif %}"
itemprop="url"
title="{{ name }}">
<div class="nav-item__media">
{% if treeItem.category.extensions.icon %}
{% sw_thumbnails 'nav-item__image' with {
media: treeItem.category.extensions.icon,
sizes: {
'default': '201px'
},
attributes: {
'class': 'nav-item__image',
'alt': name,
'title': name
}
} %}
{% endif %}
</div>
<span class="nav-item__name" itemprop="name">{{ name }}</span>
</a>
{% endif %}
{% endblock %}
{% block layout_navigation_categories_recoursion %}
{% if level < navigationMaxDepth %}
{% sw_include '@Storefront/storefront/layout/navigation/categories.html.twig' with {
navigationTree: treeItem.children,
level: level + 1
} only %}
{% endif %}
{% endblock %}
</div>
{% endblock %}