Linear-gradient on lazy-backgrounds

[lupas]

Hello there

I used to do the following to darken my background photos with a single line of css:

background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(image.png);

Now with vue-lazyload, I can't figure out a simple way to do the same. Any ideas?

[fritzfr]

Yip, would also be interested in this.

[backrunner]

Set linear-gradient on an overlay, that's work for me.

<div class="wallpaper" v-lazy:background-image="wallpaper">
    <div class="wallpaper-overlay"></div>
</div>

The z-index of the overlay needs to be lower than the background div.

[harrytran998]

Set linear-gradient on an overlay, that's work for me.

<div class="wallpaper" v-lazy:background-image="wallpaper">
    <div class="wallpaper-overlay"></div>
</div>

The z-index of the overlay needs to be lower than the background div.

Thank you! It's worked 🥳