<div class="multi-column-image-overlay-slider ">
<div class="multi-column-image-overlay-slider__container">
<div class="multi-column-image-overlay-slider__inner-container">
<div class="multi-column-image-overlay-slider__loader is-visible">
<div class="loading-spinner">
<div class="loading-spinner__spinner--large"></div>
</div>
</div>
<div class="multi-column-image-overlay-slider__slider">
<div class="swiper">
<ul class="swiper-wrapper">
<li class="swiper-slide">
<a href="#">
<div class="multi-column-image-overlay-item multi-column-image-overlay__column">
<div class="multi-column-image-overlay__item-container">
<div class="multi-column-image-overlay__overlay-container">
<div class="multi-column-image-overlay__overlay">
<h3 class="multi-column-image-overlay__title">Durable</h3>
<div class="multi-column-image-overlay__sub-title">Ideal für die dunkle Jahreszeit</div>
</div>
</div>
<div class="image ">
<picture>
<img src="/example-assets/images/multi-column-banner/bike.jpg" class="image__img multi-column-image-overlay__image is-loading" alt="Durable" srcset="/example-assets/images/multi-column-banner/bike.jpg 1x, /example-assets/images/multi-column-banner/bike.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
</a>
</li>
<li class="swiper-slide">
<a href="#">
<div class="multi-column-image-overlay-item multi-column-image-overlay__column">
<div class="multi-column-image-overlay__item-container">
<div class="multi-column-image-overlay__overlay-container">
<div class="multi-column-image-overlay__overlay">
<h3 class="multi-column-image-overlay__title">Durable</h3>
<div class="multi-column-image-overlay__sub-title">Ideal für die dunkle Jahreszeit</div>
</div>
</div>
<div class="image ">
<picture>
<img src="/example-assets/images/multi-column-banner/device.jpg" class="image__img multi-column-image-overlay__image is-loading" alt="Durable" srcset="/example-assets/images/multi-column-banner/device.jpg 1x, /example-assets/images/multi-column-banner/device.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
</a>
</li>
</ul>
<div class="multi-column-image-overlay-slider__pagination"></div>
</div>
<div class="multi-column-image-overlay-slider__navigation-next"></div>
<div class="multi-column-image-overlay-slider__navigation-prev"></div>
</div>
</div>
</div>
</div>
{% include '@SharedComponents/modules/bricks/components/multi-column-image-overlay-slider/multi-column-image-overlay-slider.twig' %}
/* No context defined. */
import './multi-column-image-overlay-slider.scss';
import MultiColumnImageOverlaySlider, {selector as sel} from 'cando-cx-components-library/components/modules/bricks/components/multi-column-image-overlay-slider/multi-column-image-overlay-slider';
export default MultiColumnImageOverlaySlider;
export const selector = sel;
@import "~shared/base";
@import "~cando-cx-components-library/components/modules/bricks/components/multi-column-image-overlay-slider/multi-column-image-overlay-slider";
No notes defined.