MMM-MonthlyCalendar, config and .css

Fuergrissa

I’m trying to work through the same issue. I have specified a titleClass in the calendars module, in the main.css I have:

.family {
     color: rgba(255,52,255,0.7);
}

and this causes events in the calandar module to show as magenta, however in the fourweeks calendar (MMM_MonthlyCalendar) thet still appear in white.

Does this imply that this module does not use the event title, but some other part of the event? or am I missing something? I also tried

.MMM-MonthlyCalendar.family {
     color: rgba(255,52,255,0.7);
}

sdetweil

@Fuergrissa never edit main.css it will stop upgrades. never edit any file we ship

all your config for css goes in css/custom.css

if it doesn’t exist create it

sdetweil

@Fuergrissa there needs to be spaces between the classes unless u mean they are in the same element

sdetweil

@Fuergrissa use the dev window link I posted to be able to see and fiddle w css live without file edit , try , no, edit, try, no loop

Fuergrissa

Thanks I did all of the things you suggest. The developer pane is really handy, but when I drill all the way down to individual calendar events there is no difference in class for events coming from different calendars (which do have the titleClass assigned). Looking in MMM-MonthlyCalendar.js there is a section at the end that looks like it is intended to inherit the color information from the event, but this doesn’t actually happen?

if (e.color) {
            var c = e.color;

            if (e.fullDayEvent) {
              div.style.backgroundColor = c;
              if (getLuminance(div.style.backgroundColor) >= self.config.luminanceThreshold) {
                div.style.color = "black";
              }
            } else {
              div.style.color = c;
            }
          }

sdetweil

@Fuergrissa don’t know this module’s workings

sdetweil

@Fuergrissa so it looks like this module gets it’s events from the base calendar
and if the base is not shown

anyhow, use multiple { url: …}
blocks in the based calendar add a name: attribute to each

that will carry forward on the event. I don’t know if this cal will use it

but then u could set styles for events by cal name