MMM-CalendarExt3Agenda - how to hide days with no events and hide/filter out events with a keywords

rkorell

@sdetweil , yes, I’m fully aware of volunteer.
So thanks a LOT!

Ralf

rkorell

Dear Sam (@sdetweil ),
short feedbacj from this end :-)
I was able to found a compromize.
I’ve found a months old thread with the guy whose mirror I saw and @MMRIZE regardins an equivalent “problem”.
The mentioned CSS solution doesn’t work for me - for whatever reason

/* In your custom.css */
.CX3 .event.singleday .headline .title,
.CX3 .event.singleday .headline .time {
  color: var(--calendarColor);
}

Doesn’t colour the textline.
But in the same discoussion I identified the “idea” to use the fact that whole day events DO use the given color as I define in my config.
So now the apperance isO.K.

For reference to others who might have same issues the whole block here:

{
		  module: "MMM-CalendarExt3Agenda",
		  position: "top_left", 
		  //header: "Wichtige Termine",
		  config: {
			  
			        eventTransformer: (ev) => {
			            const customEvents = [
			              { keyword: "Restmüll", symbol: ["fa-regular fa-trash-can"], color: "grey" },
			              { keyword: "Papier", symbol: ["fa-solid fa-dumbbell"], color: "blue" },
			              { keyword: "Gelber Sack", symbol: ["fa-solid fa-arrows-spin"], color: "yellow" },
			              { keyword: "Biomüll", symbol: ["fa-regular fa-trash-can"], color: "brown" },
			              { keyword: "Restmüll & Papier & Gelber Sack", symbol: ["fa-regular fa-trash-can"], color: "fuchsia" },
			              { keyword: "Urlaub", symbol: ["fa-solid fa-dumbbell"], color: "cyan" },
			              
			            ]
			            const found = customEvents.find((condition) => {
			              return ev.title.search(condition.keyword) !== -1   
			            })
			            if (found) {
			                ev.icon = [ found.symbol ]
			                ev.color = found.color 
			            }
			            if (ev.title.search("Restmüll") !== -1) {
			              ev.symbol = [ "fa-regular fa-trash-can" ],
			              ev.isFullday = [true], 
			              ev.color = "grey"  
			            }
			            if (ev.title.search("Papier") !== -1) {
			              ev.symbol = [ "fa-regular fa-trash-can" ],
			              ev.isFullday = [true],
			              ev.color = "blue"  
			            }
			            if (ev.title.search("Gelber Sack") !== -1) {
			              ev.symbol = [ "fa-solid fa-arrows-spin" ],
			              ev.isFullday = [true],
			              ev.color = "yellow"  
			            }
			            if (ev.title.search("Biomüll") !== -1) {
			              ev.symbol = [ "fa-regular fa-trash-can" ],
			              ev.isFullday = [true],
			              ev.color = "brown"  
			            }
						if (ev.title.search("Restmüll & Papier & Gelber Sack") !== -1) {
			              ev.symbol = [ "fa-regular fa-trash-can" ],
			              ev.isFullday = [true],
			              ev.title = "Alle Tonnen",
			              ev.color = "fuchsia"
			            }			            
						if (ev.title.search("Urlaub") !== -1) {
			              ev.symbol = [ "fa-regular fa-trash-can" ],
			              ev.isFullday = [true],
			              ev.color = "green"
			            }

			            return ev
			        },

Thanks for your support!
Warmest regards,
Ralf

sdetweil

@rkorell glad you have it working

MMRIZE

@rkorell
CX3A is identified with CSS selector “.CX3A” to be distinguished from CX3.

rkorell

@MMRIZE , thanks - I was aware of this.

Regards,
Ralf