MMM-DarkSkyForecast - Yet ANOTHER weather module

[Smotx]

@j-e-f-f

Thx but, i have changed 3 settings on /home/pi/MagicMirror/modules/MMM-DarkSkyForecast/MMM-DarkSkyForecast.css

after reboot nothing has changed :(

it’s not MMM-DarkSkyForecast.css ?

[dan-o]

@j-e-f-f

Same issue as @Messel - main icon has disappeared since updating just now. I’m on the latest version of MM, using icon set 4c.

[j.e.f.f]

@smotx Put the CSS into MagicMirror/css/custom.css

[j.e.f.f]

@messel I just tried your exact config, and it worked for me just fine. What version of MM are you running?

[Messel]

@j-e-f-f

Sorry for the late answer, I was sleeping :) and that probably did the trick, because the main icon is back. I don’t know what happened. Doesn’t matter, I’m happy. Thanks

[Smotx]

@j-e-f-f

Ok but nothing change^^.

thanks anyway

[j.e.f.f]

@messel I’ve since been able to replicate your problem. Has to do with the animated icon dray command. In some cases it gets executed before the DOM is updated. I’m working on a fix.

[j.e.f.f]

@messel @dan-o I think I’ve fixed your issue. Do a git pull in the MMM-DarkSkyForecast directory and restart MM.

[j.e.f.f]

@smotx said in MMM-DarkSkyForecast - Yet ANOTHER weather module:

@j-e-f-f

Ok but nothing change^^.

thanks anyway

Can you post a screenshot of what you’re trying to change? I think I might be giving you incorrect instructions.

[Smotx]

@j-e-f-f

I want to reduce free space identified by “red areas” on this screen :

[j.e.f.f]

@smotx screenshot didn’t come through. You don’t need to host the image on Imagur. You can upload it directly when editing your post. Just drag it in, or hit the cloud/upload icon.

[BKeyport]

It’s showing for me, @j-e-f-f

[j.e.f.f]

@smotx Yeah coming through for me now too. Weird.

OK from the top down:

• The first two regions are actually spacing that accommodates the icon when it appears (It’s currently not appearing due to a bug I fixed today. Do a git pull to update the module and restart MM. You’ll see once the icon is in place, that the vertical space is better used. Keep in mind that the icons are square, and some of them only use a portion of the square. Nonetheless the square still takes up that amount of space. Here’s what it should look like:

You can decrease the space under the header a bit with this:

.MMM-DarkSkyForecast .module-header {
  margin-bottom: 5px; /* adjust to taste */
}

Keep in mind this will also affect the header above the forecast if you have configured it to be there. That can be controlled independently as follows:

.MMM-DarkSkyForecast .module-header.forecast-header {
  margin-bottom: 10px; /* adjust to taste */
}

* the next one below the extra current conditions is margin above the summary.  Adjust it as follows:

.MMM-DarkSkyForecast .summary {
margin-top: 10px; /* adjust to taste */
}

You can also affect the margin underneath the summary in a similar way:

.MMM-DarkSkyForecast .summary {
margin-bottom: 10px; /* adjust to taste */
}

* The following four below are controlled by the line-height of the time and day displays:

.MMM-DarkSkyForecast .wrapper.tiled .forecast-container .forecast-item .time,
.MMM-DarkSkyForecast .wrapper.tiled .forecast-container .forecast-item .day-name {
line-height: 20px; /* adjust to taste */
}

Put all of the CSS changes in your `custom.css` file.  Don't make changes to `MMM-DarkSkyForecast.css` as they will be overwritten if you update the module to a newer version.

[Smotx]

@j-e-f-f

Thx a lot

it’s good now, it remains 2 spaces a little wide, but it does not exceed more on the next module, thank you again.

[dan-o]

@j-e-f-f came home to see the icon working, which was strange. anyway, grabbed your recent update and it works great. thank you SO MUCH for your time on this :)

[dan-o]

@dan-o said in MMM-DarkSkyForecast - Yet ANOTHER weather module:

@j-e-f-f came home to see the icon working, which was strange. anyway, grabbed your recent update and it works great. thank you SO MUCH for your time on this :)

Looks like I spoke too soon :(. Was working after a restart. Walked by the mirror just now and no icon present.

[j.e.f.f]

@smotx you can control the width of the module in CSS. It defaults to 300px, but if you need it wider or narrower you can use this:

.MMM-DarkSkyForecast .module-content {
  width: 250px; /* adjust this to taste */
}

[j.e.f.f]

@dan-o hmmm… will look into this some more. For now, if you disable the animated icons you will at least get the static one reliably.

[j.e.f.f]

I left this running on my mirror overnight and my main icon disappeared at some point as well, but it was back this morning. I have a few theories as to why.

The way the animated icons work is that they get drawn real-time by JavaScript, which means I need to wait until the DOM update is finished before executing the draw command. I thought I had licked that with my last update but the combination of the Nunjucks templating system seems to be adding a latency I’m not accounting for.

Will continue working on this over the next couple of days. Turn off animated icons for now as a work around.

[Arjan]

Is it possible to disable the main icon via the config?
I’m running two configs of MMM-DarkSlyForecast next to each other. One with 9 hour forecast and the other one with 6 day forecast.
Because of this I have 2 main icons that are the same. See picture below.

Is it possible to disable one of them via the config?