import Swiper, { Pagination, Navigation } from 'swiper';
import 'swiper/css';
import 'swiper/css/pagination';
import 'swiper/css/navigation';

const swiper = new Swiper('.swiper-word', {
    modules: [Pagination, Navigation],
    spaceBetween: 230,
    pagination: {
        el: '.swiper-word-pagination',
        clickable: true,
    },
    navigation: {
        prevEl: '.swiper-word-prev',
        nextEl: '.swiper-word-next',
    },
    breakpoints: {
        320: {
            slidesPerView: 1,
            spaceBetween: 16,
            initialSlide: 0,
        },
        480: {
            slidesPerView: 1,
            spaceBetween: 16,
        },
        768: {
            slidesPerView: 2,
            spaceBetween: 20,
        },
        1366: {
            slidesPerView: 4,
            spaceBetween: 20,
        },
        1800: {
            slidesPerView: 4,
            spaceBetween: 30,
        },
    }
});