custom/plugins/WynTheme/src/Resources/views/storefront/layout/header/header.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/layout/header/header.html.twig' %}
  3. {% block layout_header %}
  4.   {% block layout_top_bar %}
  5.   {% endblock %}
  7.   <div class="container">
  8.     {% block layout_header_navigation %}
  9.       {% block layout_header_logo %}
  10.         {% sw_include '@Storefront/storefront/layout/header/logo.html.twig' %}
  11.       {% endblock %}
  13.       {% block layout_header_compare_and_contact %}
  14.         <div class="compare-and-contact">
  15.           {% block layout_header_compare_and_contact_compare_button %}
  16.             <wyn-button
  17.               variant="no-bg-highlight"
  18.               size="small"
  19.               class="compare-btn js-compare-btn"
  20.               type="button"
  21.               aria-label="{{ "general.compare"|trans|striptags }}"
  22.             >
  23.               {% sw_icon 'compare' style { 'slotAttr' : 'icon' } %}
  24.               {{ "general.compare"|trans|striptags }}
  26.               {# This is filled from js #}
  27.               <span class="badge badge-lg badge-secondary badge--top-left js-comparison-badge hidden">
  28.                 {{ compareItems|length }}
  29.               </span>
  30.             </wyn-button>
  31.           {% endblock %}
  33.           {% block layout_header_compare_and_contact_phone %}
  34.             <wyn-button
  35.               variant="no-bg-highlight"
  36.               size="small"
  37.               href="phone:{{ "wyn-theme.contact.phoneNumberOnly"|trans|striptags }}"
  38.               class="contact-phone-btn"
  39.               aria-label="{{ "wyn-theme.contact.phoneNumberOnly"|trans|striptags }}"
  40.             >
  41.               {% sw_icon 'chat' style { 'slotAttr' : 'icon' } %}
  42.               {{ "wyn-theme.contact.phoneNumberOnly"|trans|striptags }}
  43.             </wyn-button>
  44.           {% endblock %}
  46.           {% block layout_header_compare_and_contact_mail %}
  47.             <wyn-button
  48.               variant="no-bg-highlight"
  49.               icon-button
  50.               size="small"
  51.               href="mailto:{{ "wyn-theme.contact.mail"|trans|striptags }}"
  52.               class="contact-mail-btn"
  53.               aria-label="{{ "wyn-theme.contact.mail"|trans|striptags }}"
  54.             >
  55.               {% sw_icon 'mail' style { 'slotAttr' : 'icon' } %}
  56.             </wyn-button>
  57.           {% endblock %}
  58.         </div>
  59.       {% endblock %}
  61.       {% block layout_header_menu_and_or_nav %}
  62.         <div class="menu-and-or-nav">
  63.           {% block layout_header_menu_and_or_nav_menu_btn %}
  64.             <wyn-button
  65.               variant="no-bg"
  66.               icon-button
  67.               class="nav-main-toggle-btn header-actions-btn"
  68.               type="button"
  69.               data-offcanvas-menu="true"
  70.               aria-label="{{ "general.menuLink"|trans|striptags }}"
  71.             >
  72.               {% block layout_header_navigation_toggle_tablet_button_icon %}
  73.                 {% sw_icon 'stack' style { 'slotAttr': 'icon' } %}
  74.               {% endblock %}
  76.               {% block layout_header_navigation_toggle_tablet_button_label %}
  77.                 {{ "wyn-theme.header.menuBtnLabel"|trans|striptags }}
  78.               {% endblock %}
  79.             </wyn-button>
  80.           {% endblock %}
  82.           {% block layout_header_menu_and_or_nav_navigation %}
  83.             <nav
  84.               class="nav main-navigation-menu"
  85.               itemscope="itemscope"
  86.               itemtype="http://schema.org/SiteNavigationElement"
  87.             >
  88.               <div id="main-nav-hide-anchor" class="main-navigation-menu__hide-anchor"></div>
  89.               {% block layout_header_menu_and_or_nav_navigation_list %}
  90.                 <ul class="nav__list">
  91.                   {% if page.product is defined %}
  92.                     {% set activePath = page.product.categoryTree %}
  93.                   {% else %}
  94.                     {% set activePath = page.header.navigation.active.path %}
  95.                   {% endif %}
  97.                   {% for treeItem in page.header.navigation.tree %}
  98.                     {% set category = treeItem.category %}
  99.                     {% set name = category.translated.name %}
  101.                     {% block layout_main_navigation_menu_item %}
  102.                       <li class="nav__item">
  103.                         {% if category.type == 'folder' %}
  104.                           <div
  105.                             class="nav-link main-navigation-link"
  106.                             {% if treeItem.children|length > 0 %}
  107.                               id="navigation-{{ category.id }}"
  108.                               aria-controls="navigation-popup-{{ category.id }}"
  109.                               aria-haspopup="true"
  110.                               aria-expanded="false"
  111.                             {% endif %}
  112.                           >
  113.                             <div class="main-navigation-link-text">
  114.                               <span itemprop="name">{{ name }}</span>
  115.                             </div>
  116.                           </div>
  117.                         {% else %}
  118.                           <a
  119.                             class="nav-link main-navigation-link{% if category.id == page.header.navigation.active.id or category.id in activePath %} active{% endif %}"
  120.                             href="{{ category_url(category) }}"
  121.                             itemprop="url"
  122.                             {% if treeItem.children|length > 0 %}
  123.                               id="navigation-{{ category.id }}"
  124.                               aria-controls="navigation-popup-{{ category.id }}"
  125.                               aria-haspopup="true"
  126.                               aria-expanded="false"
  127.                             {% endif %}
  128.                             {% if category_linknewtab(category) %}target="_blank"{% endif %}
  129.                           >
  130.                             <div class="main-navigation-link-text">
  131.                               <span itemprop="name">{{ name }}</span>
  132.                             </div>
  133.                           </a>
  134.                         {% endif %}
  135.                       </li>
  136.                     {% endblock %}
  137.                   {% endfor %}
  138.                 </ul>
  139.               {% endblock %}
  140.             </nav>
  141.           {% endblock %}
  142.         </div>
  143.       {% endblock %}
  145.       {% block layout_header_search_and_buttons %}
  146.         <div class="search-and-buttons">
  147.           {% block layout_header_search_and_buttons_search_field %}
  148.             {% sw_include '@Storefront/storefront/layout/header/search.html.twig' %}
  149.           {% endblock %}
  151.           {% block layout_header_search_toggle %}
  152.             <wyn-button
  153.               variant="no-bg"
  154.               icon-button
  155.               class="header-actions-btn search-toggle-btn js-search-toggle-btn collapsed d-md-none"
  156.               type="button"
  157.               data-toggle="collapse"
  158.               data-target="#searchCollapse"
  159.               data-target-input=".header-search-input"
  160.               data-no-close-on-focus=".js-search-result,.header-search-form"
  161.               aria-expanded="false"
  162.               aria-controls="searchCollapse"
  163.               aria-label="{{ "header.searchButton"|trans|striptags }}"
  164.             >
  165.               {% sw_icon 'search' style { 'slotAttr' : 'icon' } %}
  166.             </wyn-button>
  167.           {% endblock %}
  169.           {% if config('core.cart.wishlistEnabled') %}
  170.             {% block layout_header_actions_wishlist %}
  171.               <wyn-button
  172.                 variant="no-bg"
  173.                 icon-button
  174.                 class="header-wishlist-btn header-actions-btn"
  175.                 href="{{ path('frontend.wishlist.page') }}"
  176.                 title="{{ 'header.wishlist'|trans|striptags }}"
  177.                 data-wyn-popup-placement="bottom"
  178.                 aria-label="{{ 'header.wishlist'|trans|striptags }}"
  179.               >
  180.                 {% sw_include '@Storefront/storefront/layout/header/actions/wishlist-widget.html.twig' %}
  181.               </wyn-button>
  182.             {% endblock %}
  183.           {% endif %}
  185.           {% block layout_header_actions_account %}
  186.             <div class="account-menu">
  187.               {% sw_include '@Storefront/storefront/layout/header/actions/account-widget.html.twig' %}
  188.             </div>
  189.           {% endblock %}
  191.           {% block layout_header_actions_cart %}
  192.             <div
  193.               class="header-cart"
  194.               data-offcanvas-cart="true"
  195.             >
  196.   {#          <a class="btn btn-icon btn-icon--rounded btn-icon--transparent header-cart-btn header-actions-btn"#}
  197.               <wyn-button
  198.                 variant="no-bg"
  199.                 icon-button
  200.                 class="header-cart-btn header-actions-btn"
  201.                 href="{{ path('frontend.checkout.cart.page') }}"
  202.                 data-cart-widget="true"
  203.                 title="{{ 'checkout.cartTitle'|trans|striptags }}"
  204.                 data-wyn-popup-placement="bottom"
  205.                 aria-label="{{ 'checkout.cartTitle'|trans|striptags }}"
  206.               >
  207.                 {% sw_include '@WynTheme/storefront/layout/header/actions/cart-widget.html.twig' %}
  208.               </wyn-button>
  209.             </div>
  210.           {% endblock %}
  211.         </div>
  212.       {% endblock %}
  213.     {% endblock %}
  214.   </div>
  215. {% endblock %}