benhowell/react-grid-gallery

Want to add custom border to image item in gallery.

SymntxHomendra51 opened this issue · 2 comments

How to add border to each item in gallery?
or box shadow

Hi! Try to style with CSS. Available class names are ReactGridGallery_tile, ReactGridGallery_tile-viewport, and ReactGridGallery_tile-overlay.

.ReactGridGallery_tile-viewport {
    border: 1px solid black;
}

thanks, but i've managed to make this work. by using this props. Its strange that tileViewportStyle removes default viewport style which I have to mention manually.

 <Gallery
        images={Images}
        enableImageSelection={false}
        onClick={openNewTab}
        margin={15}
        tileViewportStyle={(o) => ({
          height: o.item.scaledHeight,
          width: o.item.viewportWidth,
          overflow: 'hidden',
          boxShadow: '0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)',
        })}
     
      />