I am using Lightbox and I want to change its default style..
I use makeStyles
.
<Lightbox
images={[{src:imageRef.current}]}
isOpen={imgDialogOpen}
onClose={closeImgDialog}
/>
It has a default class called content_1h4z6hc
and I want to add a few more things to it like background-color
.
How should I do this?
you need to use activeProps
, try please like this:
activeProps={{width: '10px'}}
or directly you can use styles
<Lightbox
style={{ width: 10 }}
backgroundColor="#000"
>
<Image
style={{
borderRadius: 15,
width: "100%",
}}
resizeMethod="resize"
resizeMode="cover"
/>
</Lightbox>
react-images-zoom-print
doesn't support pass props to update css. So you can use your css to ovreride the default css.
This package using id lightboxBackdrop
. So you can base on that to write your css:
#lightboxBackdrop {
background-color: yellow;
}
https://codesandbox.io/s/inspiring-hopper-q94z7?file=/src/styles.css:59-109