@MMRIZE Thank you again for looking into this and the advice. A lot of this was a project on a whim mixed with OpenAI. Overestimated its ability to give coherent css and js.

1. I did not immediately see the preProcessor for MMM-CalendarExt3 in the docs so that is clearly something I missed.

2. After a lot of random tweaks figured I was overcomplicating and went back to the default ‘sample-config’ from the Ext3 module which has been a relief.

**Opinion - is there any greater benefit to the ‘Google secret link’ (calendar) vs OAuth (MMM-GoogleCalendar)? Seems inherent security benefit with OAuth but not sure. That is what started me down using the separate module.

3. again - thanks. some easy fixes.
   shouldnt need to refresh the module that regularly. will adjust when I go to ‘prod’

Can consider this solved at this point.

As an aside - also want to thank @sdetweil . Anybody reading this in the future make sure to review this page and it will make modifying css much easier.
https://forum.magicmirror.builders/topic/14862/help-with-a-couple-css-issues/4?_=1696523432686

@MMRIZE thanks for quick response.

At this point I’m stuck on how to get the Google Calendar events (top left) fed into the CalendarExt3 calendar.

Trying to put them in the same position seemed to cause me an error but will try another few tweaks.

The top right calendar is just basic calendar for testing purposes.

howdy - have spent entirely too many hours trying to get this to display properly so resorting to the experts.

At this point in time, I’m just trying to have my Google Calendar feed the events for the CalendarExt3 module as it seems the latter has more flexibility for changes or css down the road.

I was finally able to get the ‘calendar grid’ to appear after moving the positioning to the bottom. Its a 27in screen does the Ext3 module position need to be set on the ‘bottom’ to see the calendar grid?

Config file with personal calendar redacted and a crude photo of the screen. Events are working as expected from the Google Calendar.

/* Config Sample
 *
 * For more information on how you can configure this file
 * see https://docs.magicmirror.builders/configuration/introduction.html
 * and https://docs.magicmirror.builders/modules/configuration.html
 *
 * You can use environment variables using a `config.js.template` file instead of `config.js`
 * which will be converted to `config.js` while starting. For more information
 * see https://docs.magicmirror.builders/configuration/introduction.html#enviromnent-variables
 */
let config = {
    address: "localhost",   // Address to listen on
    port: 8080,
    basePath: "/",        // The URL path where MagicMirror² is hosted
    ipWhitelist: ["127.0.0.1", "::ffff:127.0.0.1", "::1"],  // Set IP addresses that are allowed to connect
    useHttps: false,      // Support HTTPS or not
    httpsPrivateKey: "",  // HTTPS private key path
    httpsCertificate: "", // HTTPS Certificate path

    language: "en",
    locale: "en-US",
    logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for more logging
    timeFormat: 24,
    units: "metric",

    modules: [
        {
            module: "calendar",
            position: "top_right",
            config: {
                broadcastPastEvents: true,
                calendars: [
                    {
                        url: "webcal://www.calendarlabs.com/ical-calendar/ics/76/US_Holidays.ics",
                        name: "us_holiday",
                        color: "#3399ff"
                    }
                ]
            }
        },
        {
            module: 'MMM-GoogleCalendar',
            header: "My Google Calendar",
            position: "top_left",
            config: {
                calendars: [
                    {
                        symbol: "calendar-week",
                        calendarID: "" // Replace with your calendar ID
                    }
                ],
                mode: "month",
                maximumEntries: 10,
                maxDays: 30,
                showEndTime: true,
                showLocation: true,
                showDescription: true,
                showInvitees: false
            }
        },
        {
            module: "MMM-CalendarExt3",
            position: "bottom_center",
            title: "Events Calendar",
            config: {
                mode: "month",
                weekIndex: 0,
                weeksInView: 5,
                instanceId: "basicCalendar",
                locale: 'en-EN',
                maxEventLines: 5,
                firstDayOfWeek: 0,
                refreshInterval: 120000,
                animationSpeed: 0,
                useSymbol: false,
                calendarSet: []
            }
        }
    ],

    customCss: "css/custom.css"
};

/*************** DO NOT EDIT THE LINE BELOW ***************/
if (typeof module !== "undefined") { module.exports = config; }