@kusselin Looks like you are using very old calendar module (so as Magic Mirror). Please update the Magic Mirror to latest version and then test (make sure to keep backup of you config.js and other custom.css files).

@kusselin you can open dev tools in Mozilla browser as well (key might be different). Yes MM should be running.

@kusselin Can you check if your code is reaching here ?

1. Open dev tool using ctrl + shift + i
2. Go to sources tab
3. Press control + P to get the files list
4. Type calendar.js
5. Keep break point at below position and also few more breakpoints before it.
6. Press F5 to reload the Magic Mirror
7. If it hits break point, you can press F10 to step to each line and you can press F8 to continue execution (if it reaches to highlighted line then it should work)

Also check if there are any errors in console.


@kusselin : looks like you are missing comma in your config.js

@kusselin The config is JSON and should never be added to css. you need to add this in config.json for calendars check below for new year’s day

{
	module: "calendar",
	header: "NL Holidays",
	position: "top_left",
	config: {
		calendars: [
			{
				symbol: "calendar-check",
				url: "webcal://www.calendarlabs.com/ical-calendar/ics/101/Netherlands_Holidays.ics"
			}
		],
		customEvents: [
			 {
				"keyword": "Christmas Day",
				"symbol": "calendar-icon-christmas",
				"color": "red"
			 },
			 {
				"keyword": "New Year's Day",
				"color": "yellow"
			 },
			 {
				"keyword": "Easter Sunday",
				"symbol": "calendar-icon-easter",
				"color": "blue"
			 }
		]
	}
},

@MyMirror

1. You renamed the recycle to recycle1 in the icon_sprite.svg file right ?
2. You should use relative web url in css, then it will always work even if your Pi’s ip address changes.

Do below in custom.css this file should be in css folder in magicmirror directory

.waste-pickup-icon.recycle {
  background-image:url('../modules/MMM-MyWastePickup/recycle-bin2.svg');
}

@MyMirror I tried to edit it but image didn’t work correctly. moreover the image you uploaded contains image data(base64 encoded). While on https://www.svgrepo.com/vectors/bin/4 files are with svg xml only and not image data. Looks like some svg editor needs to be use to combine the images. or you can use below my hacky solution.

1. Edit the icon_sprite.svg and rename recycle to recycle1 for symbol id (this is to load empty svg)

< svg xmlns="http://www.w3.org/2000/svg">

  < !-- recycle -->
  < symbol id="recycle1" viewBox="0 0 24 24"> < --this line

2. add below in custom.css

.waste-pickup-icon.recycle {
  background-image:url('https://www.svgrepo.com/show/270587/recycle-bin-trash.svg');
}

Result

@George Thank you for mentioning it might helpful to others. Mine was cheaper while bigger in size. I paid ~80 euro for 72.5X42 cm mirror with smoothen(not polished) edges.

Thank you all for your inputs. After ordering few samples and checking the mirror in shop I finally bought one from https://glashandelhillegom.nl/. They are super nice with good service. Will post the mirror result in Show your mirror section.

Also would like to mention https://www.pyrasied.nl/en/product/spy-mirror/ and https://plexiglasstunter.nl/ they have excellent customer care service. only reason I did not use their mirror is it is acrylic and on 32" size of TV it might not fit well.

@DreadFog Check if it works for you by adding below code in custom.css and adjusting font size.

.calendar .title
{
	font-size:15px;
}