Read the statement by Michael Teeuw here.
Current Weather and Weather Forecast looks grey out.
-
You can try
.currentweather .normal, .weatherforecast .normal { color: white; }
or
.normal { color: white !important; }
-
first of all I would like to emphasize that I really appreciate your help. I’ve tried both, but no change. I cleared the settings for color icons to see if it worked, but nothing. See my custom.css here…
.newsfeed .small { font-size: 30px; line-height: 25px; } .newsfeed .medium { font-size: 35px; line-height: 30px; } .clock .date { color: #fff; } .calendar td { color: #fff; } .calendar .header { color: #fff; } .MMM-COVID19-SPARKLINE{ color:#fff; } .calendar .time { color:#fff; } .normal { color: white !important; }
-
The rest of custom.css works?
-
Yes, the rest of the custom.css is working an here is the config.js part for that:
{ module: "currentweather", position: "top_right", config: { location: "Heemskerk", locationID: "2754696", appid: "key removed" } }, { module: "weatherforecast", position: "top_right", header: "", config: { location: "Heemskerk", locationID: "2754696", appid: "key removed", fade: false } },
-
you can set custom.css in config.js
-
I don’t have any reference to the custom.css in my config.js I feel bad al ready:disappointed_face:
-
@negrito put in your config.js after all global settings the custom.css path
var config = { ... language: "en", timeFormat: 24, units: "metric", customCss: "css/custom.css", ...
-
/home/pi/MagicMirror/modules/default/weatherforecast/weatherforecast.js
in this file change colored from false to true -
@raf please dont edit the code. use config.js
-
@negrito yes, you can put in your config.js
{ module: "weatherforecast", position: "top_right", header: "", config: { location: "Heemskerk", locationID: "2754696", appid: "key removed", fade: false, colored: true, } },
but this is not your issue, make sure you add custom.css path to your config,js
colored: true will change max and min temp colors, then you can change in custom.css:
.weatherforecast tr.colored .min-temp { color: skyblue; } .weatherforecast tr.colored .max-temp { color: orange; }