mirror of
https://github.com/ivabus/www
synced 2024-11-26 14:35:06 +03:00
Added swiper below package grid.
This commit is contained in:
parent
5a562b6124
commit
bd38abd572
3 changed files with 63 additions and 0 deletions
|
@ -98,6 +98,19 @@
|
||||||
|
|
||||||
{{- partial "package-grid.html" . -}}
|
{{- partial "package-grid.html" . -}}
|
||||||
|
|
||||||
|
{{- partial "swiper.html" . -}}
|
||||||
|
|
||||||
|
<!-- Style for Swiper -->
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
.swiper {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
||||||
<!-- Package CTA Section -->
|
<!-- Package CTA Section -->
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
|
|
|
@ -149,3 +149,27 @@ integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+
|
||||||
rdt('track', 'SignUp');
|
rdt('track', 'SignUp');
|
||||||
rdt('track', 'ViewContent');
|
rdt('track', 'ViewContent');
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const swiper = new Swiper('.swiper', {
|
||||||
|
// Optional parameters
|
||||||
|
direction: 'horizontal',
|
||||||
|
loop: true,
|
||||||
|
|
||||||
|
// If we need pagination
|
||||||
|
pagination: {
|
||||||
|
el: '.swiper-pagination',
|
||||||
|
},
|
||||||
|
|
||||||
|
// Navigation arrows
|
||||||
|
navigation: {
|
||||||
|
nextEl: '.swiper-button-next',
|
||||||
|
prevEl: '.swiper-button-prev',
|
||||||
|
},
|
||||||
|
|
||||||
|
// And if we need scrollbar
|
||||||
|
scrollbar: {
|
||||||
|
el: '.swiper-scrollbar',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
26
src/layouts/partials/swiper.html
Normal file
26
src/layouts/partials/swiper.html
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
<!-- Slider main container -->
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col">
|
||||||
|
<div class="swiper">
|
||||||
|
<!-- Additional required wrapper -->
|
||||||
|
<div class="swiper-wrapper">
|
||||||
|
<!-- Slides -->
|
||||||
|
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
|
||||||
|
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
|
||||||
|
<div class="swiper-slide">{{- partial "package-thumbnail.html" . -}}</div>
|
||||||
|
...
|
||||||
|
</div>
|
||||||
|
<!-- If we need pagination -->
|
||||||
|
<div class="swiper-pagination"></div>
|
||||||
|
|
||||||
|
<!-- If we need navigation buttons
|
||||||
|
<div class="swiper-button-prev"></div>
|
||||||
|
<div class="swiper-button-next"></div> -->
|
||||||
|
|
||||||
|
<!-- If we need scrollbar -->
|
||||||
|
<div class="swiper-scrollbar"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
Loading…
Reference in a new issue