ui-components-react-js v1.0.1

ui-components-react-js

Getting started

npm i ui-components-react-js

Gallery

Import component:

import Gallery from "ui-components-react-js";

Use component inside JSX:

<Gallery imageList={[]} cssProperties={{}} />

imageList takes an array of strings (images sources):

import img1 from './source/images/image1.png';
import img2 from './source/images/image2.png';
import img3 from './source/images/image3.png';

imageList={[img1, img2, img3]}

cssProperties - write css properties here. They will be applied to the gallery.

cssProperties={{
    width: '90vw',
    maxWidth: '600px',
    aspectRatio: '16 / 9',
    background: 'rgba(0, 0, 0, 0.5)',
    outline: 'transparent',
    borderRadius: '5px'
}}

Ready to use component looks like:

<Gallery
    imageList={[img1, img2, img3]}
    cssProperties={{
        width: '90vw',
        maxWidth: '600px',
        aspectRatio: '16 / 9',
        background: 'rgba(0, 0, 0, 0.5)',
        outline: 'transparent',
        borderRadius: '5px'
   }}
/>