templates/navigation/includes/navbar-main-subnav.html.twig line 1

Open in your IDE?
  1. {% set bigSubnav = bigSubnav|default(false) %}
  3. <div class="{{ bigSubnav ? 'subnav-big' : 'subnav subnav--small' }} js-render-template js-nav__subnav">
  4.     <template class="js-render-template__template">
  5.         <button type="button" class="subnav__back d-md-none js-nav__back">
  6.             <span class="icon icon-arrow icon-rotate-180" aria-hidden="true"></span>
  7.             {{ 'global.Back'|trans }}
  8.         </button>
  10.         <div class="navbar-main__title d-md-none">{{ mainPage.getLabel() }}</div>
  12.         <ul class="subnav__list list-unstyled js-nav__list {{ bigSubnav ? 'subnav__list---big' }}">
  13.             {% for firstSubnavLayer in pages %}
  14.                 {% if firstSubnavLayer.isVisible() and not firstSubnavLayer.getCustomSetting('exclude') %}
  15.                     {% set firstSubnavLayerHasVisiblePages = firstSubnavLayer.hasPages() and (firstSubnavLayer.getPages()|length != 1 and not firstSubnavLayer.getPages()|first.getCustomSetting('exclude')) %}
  16.                     <li class="subnav__item js-nav__list-item {{ firstSubnavLayerHasVisiblePages ? 'js-nav__has-subnav' }} {{ firstSubnavLayer.getActive(true) ? 'is-active' }} js-nav__menu-aim">
  17.                         <a href="{{ firstSubnavLayer.getUri() }}" target="{{ firstSubnavLayer.getTarget() }}" class="subnav__link js-nav-tracking__link {{ firstSubnavLayer.hasPages() ? 'js-nav__list-link' }}">
  18.                             <span class="subnav__text">
  19.                                 <span class="subnav__text-text is-big">
  20.                                     {{ firstSubnavLayer.getLabel() }}
  21.                                 </span>
  22.                                 
  23.                                 {% if firstSubnavLayerHasVisiblePages %}
  24.                                     <span class="icon icon-arrow-right subnav__icon" aria-hidden="true"></span>
  25.                                 {% endif %}
  26.                             </span>
  27.                         </a>
  29.                         {% if firstSubnavLayerHasVisiblePages %}
  30.                             <div class="subnav-level-2">
  32.                                 <button type="button" class="subnav__back d-md-none js-nav__back">
  33.                                     <span class="icon icon-arrow icon-rotate-180" aria-hidden="true"></span>
  34.                                     {{ 'global.Back'|trans }}
  35.                                 </button>
  37.                                 <div class="subnav__title strong d-flex align-items-end stretch-link">
  39.                                     {% if firstSubnavLayer.getCustomSetting('hasBrand') %}
  40.                                         {% if not firstSubnavLayer.getCustomSetting('hasBrand').navigationLogo is empty() %}
  41.                                             {{ firstSubnavLayer.getCustomSetting('hasBrand').navigationLogo.getThumbnail('subnav-logo').getHtml({
  42.                                                 imgAttributes: {
  43.                                                     class: 'img-fluid subnav__img',
  44.                                                 }
  45.                                             })|raw }}
  46.                                         {% endif %}
  48.                                     {% endif %}
  50.                                     <a href="{{ firstSubnavLayer.getUri() }}" class="stretch-link__link js-nav-tracking__link">
  51.                                         {{ firstSubnavLayer.getLabel() }}
  52.                                     </a>
  53.                                 </div>
  54.                                 <ul class="subnav-level-2__list list-unstyled subnav-level-2__list">
  55.                                     {% for secondSubnavLayer in firstSubnavLayer.getPages() %}
  56.                                         {% if secondSubnavLayer.isVisible() and not secondSubnavLayer.getCustomSetting('exclude') %}
  57.                                             <li class="subnav__item {{ secondSubnavLayer.getActive(true) ? 'is-active' }}">
  58.                                                 <a href="{{ secondSubnavLayer.getUri() }}" class="subnav__link js-nav-tracking__link">
  59.                                                     {{ secondSubnavLayer.getLabel() }}
  60.                                                 </a>
  61.                                             </li>
  62.                                         {% endif %}
  63.                                     {% endfor %}
  64.                                 </ul>
  65.                                 <a href="{{ firstSubnavLayer.getUri() }}" class="link-primary subnav__overview-link js-nav-tracking__link">{{ 'navigation.Overview'|trans }} <span class="icon icon-arrow" aria-hidden="true"></span></a>
  66.                             </div>
  67.                         {% endif %}
  68.                     </li>
  70.                     {% if firstSubnavLayer.document.property('configuratorNav') and loop.last %}
  71.                         <li class="subnav__bottom-item subnav__item mt-0">
  72.                             <a href="{{ firstSubnavLayer.document.property('configuratorNav') }}" class="subnav__link js-nav-tracking__link subnav__bottom-link mt-2">
  73.                                 <span class="icon icon-konfigurator" aria-hidden="true"></span>
  74.                                 {{ 'navigation.Configurator'|trans }}
  75.                             </a>
  76.                         </li>
  77.                     {% endif %}
  78.                 {% endif %}
  79.             {% endfor %}
  80.         </ul>
  81.     </template>
  82. </div>