mirror of
https://github.com/nunocoracao/blowfish.git
synced 2025-02-02 11:32:30 -06:00
46 lines
No EOL
1.3 KiB
HTML
46 lines
No EOL
1.3 KiB
HTML
{{ $images := .Page.Resources.Match (.Get "pattern") }}
|
|
{{ $id := .Get "id" }}
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" />
|
|
<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
|
|
|
|
<!-- Slider main container -->
|
|
<div class="swiper swiper{{ $id }}">
|
|
<!-- Additional required wrapper -->
|
|
<div class="swiper-wrapper items-center">
|
|
<!-- Slides -->
|
|
{{ range $images }}
|
|
<div class="swiper-slide swiper-slide{{ $id }}">
|
|
<center>
|
|
<img src="{{ (.Resize "x300").RelPermalink }}" class="my-0 rounded-md">
|
|
</center>
|
|
</div>
|
|
{{ end }}
|
|
|
|
</div>
|
|
<!-- pagination -->
|
|
<div class="swiper-pagination swiper-pagination{{ $id }}"></div>
|
|
|
|
<!-- navigation buttons -->
|
|
<div class="swiper-button-prev swiper-button-prev{{ $id }} hover:text-neutral"></div>
|
|
<div class="swiper-button-next swiper-button-next{{ $id }} hover:text-neutral"></div>
|
|
</div>
|
|
|
|
<script>
|
|
new Swiper('.swiper{{ $id }}', {
|
|
direction: 'horizontal',
|
|
centeredSlides: true,
|
|
loop: true,
|
|
spaceBetween: 10,
|
|
|
|
pagination: {
|
|
el: '.swiper-pagination{{ $id }}',
|
|
clickable: true,
|
|
},
|
|
|
|
navigation: {
|
|
nextEl: '.swiper-button-next{{ $id }}',
|
|
prevEl: '.swiper-button-prev{{ $id }}',
|
|
},
|
|
});
|
|
</script> |