kolbyjack / MMM-Wallpaper

MagicMirror module to display wallpapers from various online sources
https://magicmirror.builders/
MIT License
104 stars 31 forks source link

Feature: possible to add dim to top and bottom? #16

Closed Andoramb closed 2 years ago

Andoramb commented 4 years ago

Hi again. I noticed that a lot of wallpapers would look much punchier if there is a dim on top/bottom of the screen, just like on Wallberry theme Would it be beneficial for the looks to add like 2 overlays with fade to top/bottom? Thanks! :)

kolbyjack commented 4 years ago

I don't really see the fade you're referring to, I assume they're placing a couple of divs over the top and bottom of the image and applying some css to them?

Andoramb commented 4 years ago

Exactly :) 2 divs on top/bottom with linear-gradient css like here: WallberryTheme.njk

straubus commented 3 years ago

Could You please help me in adding those parameters to css? I also want every photo to dim to top/bottom, what should I do?

editwentyone commented 2 years ago

i second this, having two gradients top and bottom is visually much better

kolbyjack commented 2 years ago

Pull latest and set fadeEdges: true in your config.

editwentyone commented 2 years ago

thank you, I added this to my custom.css to make it softer

.MMM-Wallpaper .top-gradient {
    height:15%;
    background: linear-gradient(rgba(0,0,0,0.5), transparent);
}

.MMM-Wallpaper .bottom-gradient {
    height:15%;
    background: linear-gradient(transparent, rgba(0,0,0,0.5));
}
Andoramb commented 2 years ago

@kolbyjack: You've picked this up after 2years... very nice, thanks for your time :)

kolbyjack commented 2 years ago

@kolbyjack: You've picked this up after 2years... very nice, thanks for your time :)

Yeah, sorry it took so long, I just kinda forgot about it tbh :(