templates/Magazine/DetailBlocks/BlogArticleImageSlider.html.twig line 1

Open in your IDE?
  1. <section class="content-block js-fade-in {{ styleModifier | default(null) }}">
  3.     <div class="container container-sm">
  4.         {{ include('Includes/title-block.html.twig', {
  5.             title: block.headline,
  6.             isCentered: true
  7.         }) }}
  8.     </div>
  10.     <div class="js-img-text-slider img-text-slider">
  12.         <div class="swiper-container js-img-text-slider__slider img-text-slider__container">
  13.             <div class="swiper-wrapper img-teaser-swiper__wrapper">
  15.                 {% for imageblock in block.imageBlock %}
  16.                     <div class="swiper-slide">
  17.                         <section class="big-img-text-slide">
  18.                             <div class="big-img-text-slide__bg js-lazy-img js-lazy-img--bg"
  19.                                  data-lazy-img-background='{{ imageblock['image']|default(false) and imageblock['image'].data ? imageblock['image'].data.thumbnail('big-img-text-slide' ) : '' }}'></div>
  21.                             <div class="container">
  22.                                 {% if imageblock['imageHeadline'].data or imageblock['imageDescription'].data or (imageblock['imageLink'].data and imageblock['imageLink'].data.href and  imageblock['imageLink'].data.getText()) %}
  23.                                     <div class="big-img-text-slide__content">
  24.                                         {% if imageblock['imageHeadline'].data %}
  25.                                             <h3 class="js-toc__title big-img-text-slide__title h2">
  26.                                                 {{ imageblock['imageHeadline'].data }}
  27.                                             </h3>
  28.                                         {% endif %}
  29.                                         {% if imageblock['imageDescription'].data %}
  30.                                             <div class="big-img-text-slide__wysiwyg wysiwyg">
  31.                                                 {{ imageblock['imageDescription'].data|raw }}
  32.                                             </div>
  33.                                         {% endif %}
  35.                                         {% if imageblock['imageLink'].data and imageblock['imageLink'].data.href and  imageblock['imageLink'].data.getText() %}
  36.                                             <a href="{{ imageblock['imageLink'].data.href }}" target="{{ imageblock['imageLink'].data.target }}" class="btn btn-outline-white big-img-text-slide__btn">
  37.                                                 {{ imageblock['imageLink'].data.getText() }}
  38.                                             </a>
  39.                                         {% endif %}
  40.                                     </div>
  41.                                 {% endif %}
  42.                             </div>
  44.                         </section>
  45.                     </div>
  46.                 {% endfor %}
  47.             </div>
  48.         </div>
  50.         {% if block.imageBlock|length > 1 %}
  51.             <div class="container position-relative">
  52.                 <div class="swiper-navigation img-text-slider__swiper-navigation">
  53.                     <button class="swiper-button swiper-button--prev img-text-slider__btn js-img-text-slider__prev"><span class="icon icon-arrow-right" aria-label="Previous"></span></button>
  54.                     <button class="swiper-button swiper-button--next img-text-slider__btn js-img-text-slider__next"><span class="icon icon-arrow-right" aria-label="Next"></span></button>
  55.                 </div>
  56.             </div>
  57.         {% endif %}
  59.     </div>
  61. </section>