In case anyone else is coming into this thread looking for answers, I’ve been stumped on this same problem for awhile and think I got it working (instead of trying to put a picture, I wanted a CSS gradient in the background for various reasons).

What I’ve been running into is this: if I put my desired background: info in the body { } portion of the CSS file, it fills up the middle part, but the margins are white. If I put it in the html { } portion, I can make a nice border that fills the margins, but now the inside isn’t covered.

After looking through the main.css file (and running enough attempts to lock myself out of the fitbit API), I appear to have gotten it by adding my background: under .region.fullscreen.below. Not knowing how CSS works, I of course only recently figured out that this has to be outside the body{} designation that comes standard in the custom.css file. The code looks kind of like this:

body {	
}

.region.fullscreen.below {
  background: linear-gradient(208deg, #235182, #196586);
}

Hope this helps anyone else.

I have two nests, and tbh I can’t fully recommend them. My friend LOVES her Ecobee— take a look at those.

So, I’m having a really unexpected bug, where this module somehow negates my custom CSS for the header color of all modules. No idea how/why, but when the page first loads, it’s fine, but as the last of the modules (including this one) load and are activated, the color suddenly snaps back to the default #aaa.

I know for certain it’s this module, since disabling it in the config fixed the header issue. I think this was introduced in the newest update, but I’m not 100% for-sure positive. I do know it started right around the most recent release date though.

@ATibbs This is not my work (I’m not that smart) but I did find a fork of this module that adds what I think you’re looking for – it’s behind the master still, but it works pretty well by and large. Check out the calendar-integration branch of this repository (courtesy of olexs on github).

You may need some additional configuration settings to make it work. I don’t currently have access to mine, but iirc I guessed at the changes based on this changelog from the pull request on the master repo.

In a few days I’ll be back home, feel free to shoot me a message if you can’t get it up and running an I’ll send you my config once I can get to it.

Houston, TX checking in. From rural Pennsylvania though.

@Jopyth I didn’t think I had (actually I don’t think I ever even noticed it!) but I guess I bumped into it just enough to change the value. All good now. Thanks!

@olexs Thanks a lot for that fork – it’s exactly what I needed for the mirror!

@Reotch2 I actually just was dealing with something similar trying to get that module to work as a background!

Right now I have just a picture instead, but it should be the same idea. Put the video file somewhere on the MagicMirror directory - my image is in the CSS file but it doesn’t matter where. That way it’s included in what’s accessible on MM’s webserver that it starts. That way, in the config, you can specify the URL for the file! On mine, the picture bg.jpg is in the CSS folder, so my file listed in the config is "http://127.0.0.1:8080/css/bg.jpg".

The biggest issue with this is that AFAIK it’s liable to get erased in updates to the MagicMirror framework, since I’m pretty sure the only two files that don’t get touched are config.js and custom.css. I’m also pretty sure that someone smarter than I has figured out a great way to get around that. BUt, since it’s just for halloween it’s probably temporary anyways so hopefully this gets you up and going.
PS that is a cool as hell idea!

@dmcinnes Oh, okay — that makes a lot of sense! Glad to know it’s not just me missing something. I’ll take a look at the html and see what I can do, thanks for pointing that out for me.

This is awesome and I like it a whole lot.

Thanks, man