MinJieLiu/react-photo-view

Changing the background colour

Opened this issue · 1 comments

This is a great viewer, just what I was looking for.

However, I'd like to change the background colour without hacking the CSS.
At the moment it is black and using maskOpacity={0.5} I can change the transparency, but nothing in the docs for the colour.

Do you have an example of how to do this?

Thanks

For anyone here from Google I ended up using CSS:

.PhotoView-Slider__Overlay{
    z-index: 20;
    position: relative;
}
.PhotoView-Portal .PhotoView-Slider__Backdrop{
    background-color: rgb(from var(--accent-colour) r g b / .95) !important;
}
.PhotoView-Portal .PhotoView-overlay {
    position: fixed;
    bottom: 0;
    left: 0;
    background: #00000088;
    width: 100%;
    color: #ffffff;
    padding: 5px;
}