set swiper import styles

This commit is contained in:
andres alcocer
2021-10-06 13:48:13 -04:00
parent 0ef1edc10e
commit e66e5bf133
2 changed files with 7 additions and 5 deletions

View File

@@ -1,6 +1,7 @@
import React, { Component } from 'react';
import { Swiper, SwiperSlide } from 'swiper/react';
import SwiperCore, { Navigation, Pagination, Scrollbar, A11y } from 'swiper';
// install Swiper components
SwiperCore.use([Navigation, Pagination, Scrollbar, A11y]);
@@ -13,11 +14,11 @@ export default class DisplayMovieRow extends Component {
}
componentDidMount() {
window.addEventListener("resize", this.handleResize);
window.addEventListener('resize', this.handleResize);
}
componentWillUnMount() {
window.addEventListener("resize", this.handleResize);
window.addEventListener('resize', this.handleResize);
}
handleResize = (e) => {
@@ -44,9 +45,7 @@ export default class DisplayMovieRow extends Component {
draggable={false}
loop={true}
loopAdditionalSlides={
width >= 1378 ? 4 :
width >= 998 ? 3 :
width >= 625 ? 2 : 2
width >= 1378 ? 4 : width >= 998 ? 3 : width >= 625 ? 2 : 2
}
breakpoints={{
1378: {

View File

@@ -9,6 +9,9 @@ import '@babel/polyfill';
import App from './containers/App';
// Import Swiper styles
import 'swiper/css';
import 'swiper/css/navigation';
import 'swiper/css/pagination';
// import 'swiper/css/scrollbar';
// Import main sass file to apply global styles
import './static/sass/style.scss';