Calendar and Icons

[bicolorbore586]

Hi again,

below is a brief part of my config.js. A few days ago this was working fine, however now it no longer shows the icon/symbol in the default calendar.

Note there is also configuration for colors which does work.

{
			module: "calendar",
			header: "FamCal",
			position: "top_left",
			config:	{
				displaySymbol: true,
				customEvents: [	{keyword: "Swimming", symbol: "swimmer"},

it does however show the icon in the MMM-Calendarext3

[sdetweil]

@bicolorbore586

https://fontawesome.com/search?q=swimming &o=r

I don’t see a ‘swimming’ icon, I do see
‘person-swimming’

is cx3 using a different icon lib is it’s css ?

[bicolorbore586]

@sdetweil

Not sure I understand the question. I know from the github page it talks about EX3 taking information from the default calendar.

Have just tried person-swimming, but still gives same results.

[sdetweil]

@bicolorbore586 can u open the developers window, ctrl-shift-i, and select the console tab, and put cal
in the filter field
to see if there is any error

[bicolorbore586]

@sdetweil

Styles loaded for: MMM-CalendarExt3
loader.js:164 Translations loaded for: MMM-CalendarExt3Refused to apply style from ‘http://localhost:8080/css/custom.css’ because its MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.
2calendar.js:89 Starting module: calendar
localhost/:1 Refused to apply style from ‘http://localhost:8080/css/custom.css’ because its MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.

[sdetweil]

@bicolorbore586 that means custom.css doesn’t exist(which means u didn’t use my install script, cause I create it) from a termianl window, do

touch ~/MagicMirror/css/custom.css

[bicolorbore586]

@sdetweil No longer get the error, but the icon’s still don’t show

[sdetweil]

@bicolorbore586 see this,
https://forum.magicmirror.builders/topic/14862/help-with-a-couple-css-issues?_=1666112801067

navigate to the calendar entry to see what the element looks like and if symbol is used…

[bicolorbore586]

@sdetweil
for comparison, using a UK holiday calendar, the default icon is present, but the sleigh for Christmas isn’t

[sdetweil]

@bicolorbore586 interesting…

but they don’t contain the font awesome prefixes

				symbol.className = "fas fa-fw fa-" + s

what version of MagicMirror are u on?

see the startup messages or
grep version ~/MagicMirror/package.json

for grins change the symbol in custom event entry to
‘fa-swimming’

it will probably fail in ext3

[bicolorbore586]

@sdetweil v 2.22.0-develop

changing to fa-swimming removes the icon from ext3 as you predicted. Still not showing in default calendar either.

[sdetweil]

@bicolorbore586 but if u examine the content again it should say fa-swimming

I just switched to 22 develop and still see the same code

[MMRIZE]

@bicolorbore586
2.22.0-develop? not 2.21.0-develop?

[bicolorbore586]

@MMRIZE Yes, although I have now downgraded to 2.21.0. Still experiencing the same issue.

[MMRIZE]

@bicolorbore586
In my test on 2.21,
swimming, person-swimming, swimmer showed the right result. It is very interesting why yours is not.

[bicolorbore586]

@MMRIZE If I change / add fas fa-fw fa-symbol name, that appears to have resolved the issue.

[sdetweil]

@MMRIZE 22-develop is the name of the upcoming release develop branch in package json

so main is 2.21.0
develop is 2.22-develop

[sdetweil]

@bicolorbore586 I checked 19, 20,21…

the extra classes are added under the covers… hard coded