custom/plugins/SchilderSysteme/src/Resources/views/storefront/layout/navigation/flyout.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/layout/navigation/flyout.html.twig' %}
  4. {% block layout_navigation_flyout %}
  5.     {% set navTreeChildrens= navigationTree.children %}
  6.     {% set name = category.translated.name %}
  7.     {% block layout_navigation_flyout_bar %}
  8.     {% endblock %}
  10.     {% block layout_navigation_flyout_content %}
  11.         <div class="row navigation-flyout-content flex-nowrap">
  12.         {% block layout_navigation_flyout_categories %}
  13.             <div class="navigation-categories-list {% if category.media %}{% else %}{% endif %} p-0">
  14.                 <div class="navigation-flyout-categories">
  15.                     {% block layout_navigation_flyout_categories_recoursion %}
  17.                         <span class="navigation-flyout-categories-headline">{{ 'header.categoriesHeadline'|trans|sw_sanitize }}</span>
  18.                         {% for treeItem in navTreeChildrens %}
  19.                             {% set isOpen = loop.index0 is same as(0) %}
  20.                             {% set category = treeItem.category %}
  21.                             {% set name = category.translated.name %}
  23.                             {# @deprecated tag:v6.5.0 - Use "category.id" directly instead. #}
  24.                             {% set categorId = category.id %}
  26.                             {% block layout_main_navigation_menu_item %}
  27.                                 {% if category.type == 'folder' %}
  28.                                     <div class="nav-link main-navigation-link"
  29.                                          data-flyout-category-trigger="{{ category.id }}"
  30.                                          title="{{ name }}">
  31.                                         <div class="main-navigation-link-text">
  32.                                             <span itemprop="name">{{ name }}</span>
  33.                                         </div>
  34.                                     </div>
  35.                                 {% else %}
  36.                                     <a class="nav-link main-navigation-link {% if isOpen %} is-open{% endif %}"
  37.                                        href="{{ category_url(category) }}"
  38.                                        itemprop="url"
  39.                                        data-flyout-category-trigger="{{ category.id }}"
  40.                                        {% if category_linknewtab(category) %}target="_blank"{% endif %}
  41.                                        title="{{ name }}">
  42.                                         <div class="main-navigation-link-text">
  43.                                             <span itemprop="name">{{ name }}</span>
  44.                                         </div>
  45.                                     </a>
  46.                                 {% endif %}
  47.                             {% endblock %}
  48.                         {% endfor %}
  49.                     {% endblock %}
  50.                 </div>
  51.             </div>
  52.         {% endblock %}
  54.         {% set seprateCategory = '' %}
  55.         {% set middleColumnCategory = 'Leitsysteme' %}
  57.         {% for item in mainNavigation %}
  58.             {% if middleColumnCategory  in item.category.name %}
  59.                 {% set seprateCategory = item %}
  60.             {% endif %}
  61.         {% endfor %}
  64.         {% for treeItem in navTreeChildrens %}
  65.             {% set isOpen = loop.index0 is same as(0) %}
  67.             {% set customFields =  treeItem.category.customFields %}
  68.             {% set banner = customFields.custom_category_menu_banner_img %}
  69.             {% if banner %}
  70.                 {% set iconMediaId = customFields.custom_category_menu_banner_img %}
  72.                 {% set media = searchMedia([iconMediaId], context.context) %}
  73.                 {% set icon = media.get(iconMediaId) %}
  74.             {% endif %}
  75.             <div class="navigation-flyout-category-wrapper row flex-nowrap m-0 p-0 {% if isOpen %}is-open{% endif %}"
  76.                  data-flyout-category-id="{{ treeItem.category.id }}"
  77.             >
  78.                 <div class="row flex-nowrap m-0">
  79.                     <div class="category-card-section  {% if isFirstCategory %}  {% else %} d-none {% endif %}">
  80.                         <a class="main-category-name " href="{{ category_url(seprateCategory.category) }}">
  81.                             {% if seprateCategory.category.customFields.custom_category_info_custom_name %}
  82.                                 {{ seprateCategory.category.customFields.custom_category_info_custom_name }}
  83.                             {% else %}
  84.                                 {{ seprateCategory.category.translated.name }}
  85.                             {% endif %}
  86.                             <span class="arrow-right-rotate">
  87.                             {% sw_icon 'arrow_left'  style {
  88.                                 'namespace': 'Tuerschild_2',
  89.                             } %} </span> </a>
  90.                         <div class=" m-0 categories-list">
  91.                             {% for subcategory in seprateCategory.children %}
  92.                                 {% set categoryColor = subcategory.category.customFields.custom_category_info_color %}
  94.                                 {% if subcategory.category.mediaId %}
  95.                                     {% set imgMediaId  = subcategory.category.mediaId %}
  97.                                     {% set media = searchMedia([imgMediaId], context.context) %}
  98.                                     {% set img = media.get(imgMediaId) %}
  99.                                 {% endif %}
  101.                                 <div class="category-card">
  102.                                     <a href="{{ category_url(subcategory.category) }}"
  103.                                        alt="{{ subcategory.category.translated.name }}" class="category-card-wrapper">
  105.                                         {% sw_thumbnails 'product-image-thumbnails' with {
  106.                                             media: img,
  107.                                             sizes: {
  108.                                                 'xs': '218px',
  109.                                                 'sm': '218px',
  110.                                                 'md': '218px',
  111.                                                 'lg': '218px',
  112.                                                 'xl': '218px',
  113.                                             },
  114.                                             attributes: {
  115.                                                 'class': 'category-card-image',
  116.                                                 'alt': ( subcategory.category.translated.name  ?: ''),
  117.                                             }
  119.                                         } %}
  121.                                         <span class="category-card-name">{{ subcategory.category.translated.name }}</span>
  122.                                         <div class="background-container"
  123.                                              style="background-color:{{ categoryColor }}"></div>
  125.                                     </a>
  126.                                 </div>
  127.                             {% endfor %}
  128.                         </div>
  129.                     </div>
  131.                     {% block layout_navigation_flyout_teaser %}
  132.                         <div class="category-banner {% if not isFirstCategory %}full-width{% endif %}">
  133.                             <div class="navigation-flyout-teaser">
  134.                                 <span class="category-banner-headline">{{ customFields.custom_category_menu_banner_headline }}</span>
  135.                                 {% block layout_navigation_flyout_teaser_image %}
  136.                                     {% if banner %}
  137.                                         {# <a class="navigation-flyout-teaser-image-container  {% if treeItem.children == false %}mw-100 bigger{% endif %}" #}
  138.                                         <a class="navigation-flyout-teaser-image-container"
  139.                                            href="{{ customFields.custom_category_menu_banner_url }}">
  140.                                             <img src="{{ icon.url }}" class="navigation-flyout-teaser-image"
  141.                                                  data-object-fit="cover">
  142.                                         </a>
  143.                                     {% endif %}
  145.                                 {% endblock %}
  146.                             </div>
  147.                             {% block layout_navigation_top_products %}
  148.                                 {% set topProducts = false %}
  149.                                 {% set categoryTopProducts = false %}
  151.                                 {% for item in mainNavigation %}
  152.                                     {% if item.category.name is same as('TOP Produktreihen') %}
  153.                                         {% set topProducts = item.children %}
  154.                                         {% set categoryTopProducts = item.category %}
  155.                                     {% endif %}
  156.                                 {% endfor %}
  158.                                 {% if isFirstCategory and topProducts %}
  159.                                     <span class="navigation-flyout-categories-headline top-products">{{ categoryTopProducts.translated.name }}</span>
  160.                                     <ul class="top-product-list">
  161.                                         {% for product in topProducts %}
  162.                                             <li class="product-item">
  163.                                                 <a href="{{ category_url(product.category) }}"
  164.                                                    class="nav-link">{{ product.category.name }}</a>
  165.                                             </li>
  166.                                         {% endfor %}
  167.                                     </ul>
  168.                                 {% endif %}
  169.                             {% endblock %}
  170.                         </div>
  171.                     {% endblock %}
  172.                 </div>
  173.             </div>
  174.         {% endfor %}
  176.     {% endblock %}
  177.     </div>
  178. {% endblock %}