templates/Navigation/magazine-navbar.html.twig line 1

Open in your IDE?
  1. <header class="js-affix-nav__placeholder">
  2.     <nav class="main-navbar js-search-overlay js-affix-nav">
  3.         <div class="main-navbar__container h-100 js-simple-nav">
  4.             {% do jsConfig().add('simpleNav', true) %}
  5.             {% do jsConfig().add('searchOverlay', true) %}
  7.             <button class="nav-toggle collapsed js-simple-nav__toggle"
  8.                     type="button"
  9.                     aria-expanded="false"
  10.                     aria-label="{{ 'sr.Toggle Navigation'|trans }}"
  11.                     aria-controls="main-navbarbar-nav">
  12.                 <span class="nav-toggle__line"></span>
  13.                 <span class="nav-toggle__line"></span>
  14.                 <span class="nav-toggle__line"></span>
  15.                 <span class="sr-only">{{ 'sr.Toggle Navigation'|trans }}</span>
  16.                 <span class="d-md-none d-block nav-toggle__text">{{ 'navbar.Menu'|trans }}</span>
  17.             </button>
  19.             <div class="main-navbar__top">
  20.                 <a href="{{ siteConfig.home }}" class="main-navbar__top__back d-md-block d-none">
  21.                     <span class="icon icon-arrow-left mr-2" aria-hidden="true"></span>
  22.                     {{ ('magazine.back.' ~ document.property('region').name)|trans }}
  23.                 </a>
  25.                 <div class="main-navbar__top__brand-wrapper">
  26.                     <a href="{{ document.property('blogPortal').overviewDocument }}" class="position-relative">
  27.                         {% if siteConfig.logoMagazin is not null %}
  28.                             {{ siteConfig.logoMagazin.thumbnail('magazine-navbar-brand').html({imgAttributes: {class: 'img-fluid main-navbar__brand' }})| raw }}
  29.                         {% else %}
  30.                             {{ siteConfig.logo.thumbnail('magazine-navbar-brand').html({imgAttributes: {class: 'img-fluid main-navbar__brand' }})| raw }}
  31.                         {% endif %}
  32.                         <img src="/static/img/magazine/logo-magazin.svg" class="img-fluid main-navbar__brand-magazin">
  33.                     </a>
  34.                 </div>
  37.                 <button type="button" class="main-navbar__search-btn js-search-overlay__toggle d-md-flex d-none">
  38.                     <span class="icon icon-search main-navbar__search-btn__icon main-navbar__search-btn__icon--opened" aria-label="{{ 'sr.Search'|trans }}" title="{{ 'sr.Search'|trans }}"></span>
  39.                     <span class="icon icon-close main-navbar__search-btn__icon main-navbar__search-btn__icon--close" aria-label="{{ 'sr.Close Search'|trans }}" title="{{ 'sr.Close Search'|trans }}"></span>
  40.                     <span class="text-uppercase fz12 mt-1">{{ 'magazin.suche'|trans }}</span>
  41.                 </button>
  42.             </div>
  44.             <button class="main-navbar__regions js-simple-nav__toggle-overlay d-md-none"
  45.                     aria-label="{{ 'sr.Show Overlay'|trans }}"
  46.                     title="{{ 'sr.Show Overlay'|trans }}"
  47.                     data-nav-overlay-target="#regionsOverlay">
  48.                 <span class="icon icon-pin-regions" aria-hidden="true"></span>
  49.                 <span class="main-navbar__regions-text">
  50.                             {{ 'nav.Regionen'|trans }}
  51.                         </span>
  52.                 <span class="icon icon-arrow-down main-navbar__regions-arrow-down" aria-hidden="true"></span>
  53.             </button>
  55.             {% set level =  level | default(0) %}
  56.             {% set id =  id | default('main-navbar-nav') %}
  58.             <section id="{{ id }}" class="simple-nav simple-nav--level-{{ level }} {{ styleModifier | default('js-simple-nav__collapse') }}">
  59.                 {% if false  %}
  60.                     <div class="simple-nav__title simple-nav__title--level-{{ level }}" role="heading">
  61.                         <a href="{{ currentPage.getUri() }}" class="simple-nav__title-link simple-nav__title-link--level-{{ level }}">
  62.                             {{ currentPage.getDocument().getProperty('navTitleText') ?: currentPage.getLabel() }}
  63.                         </a>
  64.                     </div>
  65.                 {% endif %}
  67.                 <div class="main-navbar__search-overlay js-search-overlay__overlay">
  68.                     <form action="{{ document.property('blogPortal').searchDocument }}" class="main-navbar__search-overlay__form">
  69.                         <div class="form-group mt-2 row" data-stylelab-tooltip="atoms-form-control">
  70.                             <div class="col-md-9 col-8">
  71.                                 <label class="form-control-label sr-only form-control-label--search" for="nav-search">{{ 'nav.Suche'|trans }}...</label>
  72.                                 <input type="text" class="form-control form-control--search js-search-overlay__input" placeholder=" {{ 'nav.Suche'|trans }}..." name="nav-search" id="nav-search" placeholder="" value="" title="{{ 'nav.Suche'|trans }}" aria-label="{{ 'nav.Suche'|trans }}">
  73.                             </div>
  74.                             <div class="col-md-3 col-4 d-flex align-items-center">
  75.                                 <button type="submit" class="btn btn-primary btn-sm">
  76.                                     {{ 'nav.Suchen'|trans }}
  77.                                 </button>
  78.                             </div>
  79.                         </div>
  80.                     </form>
  81.                 </div>
  83.                 <ul class="simple-nav__list simple-nav__list--level-{{ level }} list-unstyled js-simple-nav__list">
  84.                     {{ magazineNavigation( document, siteConfig ) }}
  86.                     {% if document.property('regionOverlay') is instanceof('\\Pimcore\\Model\\Document\\Snippet') %}
  87.                         <li class="simple-nav__item simple-nav__item--level-{{ level }} d-md-flex d-none">
  88.                             <button class="main-navbar__regions js-simple-nav__toggle-overlay"
  89.                                     aria-label="{{ 'sr.Show Overlay'|trans }}"
  90.                                     title="{{ 'sr.Show Overlay'|trans }}"
  91.                                     data-nav-overlay-target="#regionsOverlay">
  92.                                 <span class="icon icon-pin-regions" aria-hidden="true"></span>
  93.                                 <span class="main-navbar__regions-text">
  94.                                     {{ 'magazine.nav.Regionen'|trans }}
  95.                                 </span>
  96.                                 <span class="icon icon-arrow-down main-navbar__regions-arrow-down" aria-hidden="true"></span>
  97.                             </button>
  98.                         </li>
  99.                     {% endif %}
  100.                 </ul>
  101.             </section>
  103.             {% if document.property('regionOverlay') is instanceof('\\Pimcore\\Model\\Document\\Snippet') %}
  104.                 {{ pimcore_inc(document.property('regionOverlay'), {'isMagazine': true}) }}
  105.             {% endif %}
  107.         </div>
  109.         <a href="{{ siteConfig.home }}" class="main-navbar__top__back d-md-none">
  110.             <span class="icon icon-arrow-left mr-2" aria-hidden="true"></span>
  111.             {{ ('magazine.back.' ~ document.property('region').name)|trans }}
  112.         </a>
  113.     </nav>
  114. </header>