49 lines
2.1 KiB
PHP
49 lines
2.1 KiB
PHP
<section class="bg-body-tertiary">
|
|
<div class="container" style="padding-top:24px;">
|
|
<div class="row">
|
|
|
|
|
|
<!-- Linked images (controlled slider) -->
|
|
<div class="col-12">
|
|
<div class="position-relative ms-md-n4">
|
|
<div class="ratio" style="--cz-aspect-ratio: calc(9 / 17 * 100%)"></div>
|
|
<div class="swiper position-absolute top-0 start-0 w-100 user-select-none"
|
|
id="heroImages"
|
|
data-swiper='{
|
|
"spaceBetween": 24,
|
|
"loop": true,
|
|
"speed": 400,
|
|
"controlSlider": "#heroImages",
|
|
"pagination": {
|
|
"el": "#sliderBullets",
|
|
"clickable": true
|
|
},
|
|
"autoplay": {
|
|
"delay": 5500,
|
|
"disableOnInteraction": false
|
|
}
|
|
}'>
|
|
<div class="swiper-wrapper">
|
|
@foreach ($items as $item)
|
|
<div class="swiper-slide">
|
|
<img src="{{ env('WMS_ASSET_URL') . '/' .$item->filename }}" class="w-100"
|
|
alt="Image">
|
|
</div>
|
|
@endforeach
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slider bullets (pagination) -->
|
|
<div
|
|
class="d-flex justify-content-center justify-content-md-start pb-4 pb-xl-5 mt-n1 mt-md-auto mb-md-3 mb-lg-4">
|
|
<div class="swiper-pagination position-static w-auto pb-1" id="sliderBullets"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|