104 lines
3.1 KiB
HTML
104 lines
3.1 KiB
HTML
<section class="promo-section">
|
|
<div class="container">
|
|
<!-- DESKTOP SLIDER (1920x640) -->
|
|
<div class="desktop-slider">
|
|
<div class="slider-wrapper js-slider-wrapper">
|
|
<div class="slider-track js-slider-track">
|
|
{{#each banners}}
|
|
<div class="slide">
|
|
<img src="{{this.src}}" alt="{{this.alt}}" loading="lazy" />
|
|
</div>
|
|
{{/each}}
|
|
</div>
|
|
|
|
<button class="slider-btn prev js-slider-prev" aria-label="Předchozí">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path d="m15 18-6-6 6-6" />
|
|
</svg>
|
|
</button>
|
|
<button class="slider-btn next js-slider-next" aria-label="Další">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path d="m9 18 6-6-6-6" />
|
|
</svg>
|
|
</button>
|
|
|
|
<div class="slider-dots js-slider-dots">
|
|
{{#each banners}}
|
|
<button
|
|
class="slider-dot {{#if @first}}active{{/if}}"
|
|
data-index="{{@index}}"
|
|
aria-label="Zobrazit banner {{@index}}"
|
|
></button>
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- MOBILE SLIDER (600x600) -->
|
|
<div class="mobile-slider">
|
|
<div class="slider-wrapper js-slider-wrapper">
|
|
<div class="slider-track js-slider-track">
|
|
{{#each bannersResponsive}}
|
|
<div class="slide">
|
|
<img src="{{this.src}}" alt="{{this.alt}}" loading="lazy" />
|
|
</div>
|
|
{{/each}}
|
|
</div>
|
|
|
|
<button class="slider-btn prev js-slider-prev" aria-label="Předchozí">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path d="m15 18-6-6 6-6" />
|
|
</svg>
|
|
</button>
|
|
<button class="slider-btn next js-slider-next" aria-label="Další">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path d="m9 18 6-6-6-6" />
|
|
</svg>
|
|
</button>
|
|
|
|
<div class="slider-dots js-slider-dots">
|
|
{{#each bannersResponsive}}
|
|
<button
|
|
class="slider-dot {{#if @first}}active{{/if}}"
|
|
data-index="{{@index}}"
|
|
aria-label="Zobrazit banner {{@index}}"
|
|
></button>
|
|
{{/each}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|