MagicMirror² v2.13.0 is available! For more information about this release, check out this topic.

MMM-CalendarExt2 Color Issues



  • Hello,

    I think I have tried all the working solutions on here to color code events by calendar type. I have failed at all of them. I am using the Upcoming view. Any help is appreciated.

    Here is a section of my config/config.js

    calendars : [
      {
        name: "Fred",
        icon: "maki:bicycle-11",
        url: "https://calendar.google.com/calendar/ical/[snip]/public/basic.ics",
        classname: "fred"
      },
    

    I have tried all of these options in css/custom.css and none of them have worked:

    This did NOT work

    /* style Fred */
    .CX2 .fred {
    color:#F00;
    }

    This did NOT work

    /* style Fred Upcoming*/
    .CX2 .fred.upcoming {
    color:#F00;
    }

    This did NOT work

    .CX2 .event.fred {
    color:#F00;
    }

    This did NOT work

    transform: (event) => {
    if (event.calendarName.search(“Fred”) > -1) {
    color:#F00;
    },
    return event
    },

    Thanks in advance


  • Module Developer

    @DennisFaucher
    “className”, not “classname”



  • Good catch. Thank you. This fixed the problem. The only format above that works and changes the color of the text is:

    .CX2 .event.fred {
    color:#F00;
    }


Log in to reply