New icons not showing up - default MM-Weather modules

[Bill Burch]

Newbie here. I would like to add animated .svg weather icons to my default weather module configurations.

I’ve loaded a test file (“day.svg”) into my /MagicMirror/css/icons folder and created the following instructions within my “custom.css” file located in my css folder.

.currentweather .weathericon {
position: absolute;
z-index: 0;
height: 200px;
right: 180px;
margin-top: -65px;
}

.currentweather .wi-day-sunny {
content: url(“/css/icons/day.svg”);
}

My water module is correctly configured and showing the current weather and icons for my selected region ID. It’s currently sunny outside so I’d expect that my newly uploaded icon would show up in the current weather window. But it does not.

What am I missing? Do I need to do anything to enable the custom.ccs file?

As per another thread in the Forum about adding animated icons, I also added the following callouts in my “config.js” file:

{
module: “weather”,
position: “top_right”,
config: {
weatherProvider: “openweathermap”,
type: “current”,
location: “Reno”,
locationID: “5511077”, //ID from http://bulk.openweathermap.org/sample/city.list.json.gz; unzip the gz file and find yo>
apiKey: “x1x1x1x1x1x1x”, //hidden
iconTable: {
‘01d’: ‘wi-day-sunny’,
‘02d’: ‘wi-day-cloudy’,
‘03d’: ‘wi-cloudy’,
‘04d’: ‘wi-cloudy-windy’,
‘09d’: ‘wi-showers’,
‘10d’: ‘wi-rain’,
‘11d’: ‘wi-thunderstorm’,
‘13d’: ‘wi-snow’,
‘50d’: ‘wi-fog’,
‘01n’: ‘wi-night’,
‘02n’: ‘wi-night-cloudy’,
‘03n’: ‘wi-night-cloudy’,
‘04n’: ‘wi-night-cloudy’,
‘09n’: ‘wi-night-showers’,
‘10n’: ‘wi-night-rain’,
‘11n’: ‘wi-night-thunderstorm’,
‘13n’: ‘wi-night-snow’,
‘50n’: ‘wi-night-alt-cloudy-windy’
}
}
},

Any guidance is much appreciated.

Bill

[sdetweil]

@Bill-Burch weather is done all in browser, so open the developers window ctrl-shift-i on the keyboard, use the console tab to look for error messages. use the elements tab to see the web content

[Bill Burch]

@sdetweil Thanks, Sam. I’m struggling with how SLOW the Dev tool works on my Pi Zero W2. Scrolling is painfully slow and eventually causes the browser to hang/crash.

Bill

[Bill Burch]

@sdetweil Thanks, Sam. One big issue I may be having is I’m trying to run MM on a Pi Zero 2W. Looks like I may be a bit underpowered for what I’m trying to do. Chromium hangs/crashes and the Dev tool is painfully slow with selecting and scrolling. I’ll try upgrading to a 4B with 2gb memory and see if that helps.

Bill

[sdetweil]

@Bill-Burch my 2ws don’t have any issue running mm. have to make the swap space bigger tho

[Bill Burch]

@sdetweil Good call on the swapfile. Bumped it up to 16GB (32GB card) and the browser and dev tools load and work as they should. Thanks.

[greedyvegan]

I have a joke:

After HOURS of reading, research and testing,
I FINALLY got the weather icons to change,
THEN I spent hours trying to find out why I am missing an icon

the cloud icon is white.
the background is white.
so it’s “invisible”

I changed the size of the icon in the developer window and saw six icons and fixed my problem.
I bring this up to share a lesson, spend a little more time trying to figure it out.