react-image-gallery doesn't apply styles

user_15170911 0
Viewed 41

I want to use react-image gallery to create a thumbnail carousel, but it doesn't apply the styles from the package, and I did everything as the documentation says .

# SCSS
 @import "~react-image-gallery/styles/scss/image-gallery.scss";

 # CSS
 @import "~react-image-gallery/styles/css/image-gallery.css";

I put both of these 2 in my css/scss file, but nothing. I also change the path so that they will point exactly to the node_modules package folder, like this "../../node_modules/react-image-gallery/styles/css/image-gallery.css", but still doesn't work.

Any idea what I am doing wrong ?

reactjs sass css
1 Answers

Look at my question I found the solution if you are interested in the solution to now

import React from 'react'
import "react-image-gallery/styles/css/image-gallery.css";
import ImageGallery from 'react-image-gallery';
import {ImgGallery} from "./Styled.js"
export  function ShopDetails() {


    const images = [
        {
          original: 'https://picsum.photos/id/1018/1000/600/',
          thumbnail: 'https://picsum.photos/id/1018/250/150/',
        },
        {
          original: 'https://picsum.photos/id/1015/1000/600/',
          thumbnail: 'https://picsum.photos/id/1015/250/150/',
        },
        {
          original: 'https://picsum.photos/id/1019/1000/600/',
          thumbnail: 'https://picsum.photos/id/1019/250/150/',
        },
      ];
    return (
      
         
        <ImgGallery>
          <ImageGallery thumbnailPosition="left" useBrowserFullscreen={false} showPlayButton={false} autoPlay={true} items={images} />;
      
        </ImgGallery>
    )
}
Admin1
Related