MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    MMM-Multimonth

    Scheduled Pinned Locked Moved Utilities
    calendarmagicmirror2module
    78 Posts 19 Posters 49.5k Views 17 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • BKeyportB Offline
      BKeyport Module Developer @p1lspeda
      last edited by

      @p1lspeda No worries, was using a routine wrong and didn’t catch that it was reporting the last day of the week as the first day of the week. Surprised it got through most of the month without an issue. 🤣

      The "E" in "Javascript" stands for "Easy"

      1 Reply Last reply Reply Quote 0
      • M Offline
        marchvet
        last edited by sdetweil

        Just installed this module and have it positioned as

        bottom_bar
        

        but it actually is about a half inch above the bottom.

        Anyway to get it to sit flush with the bottom of the screen?

        (I am a noob with coding)

        BKeyportB 1 Reply Last reply Reply Quote 0
        • BKeyportB Offline
          BKeyport Module Developer @marchvet
          last edited by

          @marchvet Yes, it’s actually not the module that’s the error though it’s the overall system.

          in css/custom.css:

          :root {
          	--gap-body-top: ??px;
          	--gap-body-right: ??px;
          	--gap-body-bottom: ??px;
          	--gap-body-left: ??px;
          	--gap-modules: ??px;
          }
          

          replace ?? with whatever value you find useful. the defaults are 60 for body and 30 for modules. I use 15 and 1 respectively.

          – Brendan

          The "E" in "Javascript" stands for "Easy"

          M 2 Replies Last reply Reply Quote 0
          • M Offline
            marchvet @BKeyport
            last edited by

            @BKeyport Thank you but I am not even sure how to get to the css/custom.css file?

            1 Reply Last reply Reply Quote 0
            • M Offline
              marchvet @BKeyport
              last edited by

              @BKeyport Thank you but I am not even sure how to get to the css/custom.css file?

              S 1 Reply Last reply Reply Quote 0
              • S Do not disturb
                sdetweil @marchvet
                last edited by

                @marchvet ~/MagicMirror/css/custom.css

                is a file. if it doesn’t exist, create it

                touch ~/MagicMirror/css/custom.css

                Sam

                How to add modules

                learning how to use browser developers window for css changes

                BKeyportB 1 Reply Last reply Reply Quote 0
                • BKeyportB Offline
                  BKeyport Module Developer @sdetweil
                  last edited by

                  @sdetweil Thanks, Sam - I tend to think multiple platform so I leave the main directories off when I write…

                  The "E" in "Javascript" stands for "Easy"

                  S 1 Reply Last reply Reply Quote 2
                  • S Do not disturb
                    sdetweil @BKeyport
                    last edited by

                    @BKeyport many new users don’t connect the names we talk about to the folders. many have not looked at the folders at all!

                    my install script is a blessing and a curse. gets u up and running fast , but doesn’t teach you much.

                    Sam

                    How to add modules

                    learning how to use browser developers window for css changes

                    1 Reply Last reply Reply Quote 0
                    • M Offline
                      marchvet
                      last edited by

                      Thanks I appreciate it. Works like a charm!

                      1 Reply Last reply Reply Quote 1
                      • E Offline
                        Egnos
                        last edited by

                        Thanks @BKeyport great module!

                        My Mirror https://forum.magicmirror.builders/topic/17262/the-raspimirror-was-born/7

                        1 Reply Last reply Reply Quote 1
                        • BKeyportB Offline
                          BKeyport Module Developer @BKeyport
                          last edited by BKeyport

                          MAJOR Update -
                          29 Oct 2022 - Start Implementing streamlined CSS, add feature to move weekend around, documentation improvements.

                          This update will not break old CSS or code. I’ve made sure any changed CSS includes reference to old CSS for compatibility. Some CSS names are changing to make more sense. Un-needed duplicates are being eliminated.

                          New:
                          If all you’re doing is changing the appearance, the README.md file has new instructions on how to do this… You can actually delete your old long changes and simply have changes in one css element.

                          Now you can move the weekend. See the config table in README.

                          Now you can turn on or off the previous/next month display in the month grid regardless of number of months!

                          Let me know if you have any bugs or oddities.

                          Thanks!

                          The "E" in "Javascript" stands for "Easy"

                          BKeyportB 1 Reply Last reply Reply Quote 2
                          • BKeyportB Offline
                            BKeyport Module Developer @BKeyport
                            last edited by

                            Another big update.

                            Event visualization is now working. Module will underline in a color of your choice (see css in README.md) for any event pulled from MagicMirror’s default calendar module.

                            Other tweaks have occurred. Please read the readme completely to upgrade.

                            Thanks!

                            The "E" in "Javascript" stands for "Easy"

                            MZ-BERM pugslyP 2 Replies Last reply Reply Quote 1
                            • MZ-BERM Offline
                              MZ-BER @BKeyport
                              last edited by

                              Thank you! Is there also an option to disable it or can I only hide that via css?

                              BKeyportB 1 Reply Last reply Reply Quote 0
                              • BKeyportB Offline
                                BKeyport Module Developer @MZ-BER
                                last edited by

                                @MZ-BER To be honest, I forgot to add the code to turn it off. Was gonna fix something else and re-release in a couple of days.

                                The "E" in "Javascript" stands for "Easy"

                                BKeyportB 1 Reply Last reply Reply Quote 0
                                • BKeyportB Offline
                                  BKeyport Module Developer @BKeyport
                                  last edited by

                                  New update to this module: Event visualization is now controllable by calendar.

                                  Please see github for adjustments - Pay attention to “calNames” .

                                  As always, module requires default calendar for functionality, but does not require display of said calendar.

                                  Enjoy!
                                  – B

                                  The "E" in "Javascript" stands for "Easy"

                                  1 Reply Last reply Reply Quote 0
                                  • pugslyP Offline
                                    pugsly @BKeyport
                                    last edited by

                                    @BKeyport
                                    How do you change the font and size now?

                                    BKeyportB 1 Reply Last reply Reply Quote 0
                                    • S sdetweil referenced this topic on
                                    • BKeyportB Offline
                                      BKeyport Module Developer @pugsly
                                      last edited by BKeyport

                                      @pugsly in your custom.css file, change as desired, everything is based off the MagicMirror fonts:

                                      .MMM-Multimonth .settings {
                                        --background-dimmed: var(--color-background);
                                        --background-weekday: var(--color-background);
                                        --background-weekend: cornflowerblue;
                                        --background-current: Yellow;
                                        --background-header: Green;
                                        --background-weekno: grey;
                                        --background-dow: var(--color-background);
                                        --color-weekday: var(--color-text);
                                        --color-weekend: var(--color-background);
                                        --color-current: var(--color-background);
                                        --color-dimmed: var(--color-text-dimmed);
                                        --color-header: var(--color-text-bright);
                                        --color-weekno: var(--color-text-bright);
                                        --color-dow: var(--color-text);
                                        --color-event: Red;
                                        --back-rounding: 8px;
                                        --alignment: center; 
                                        --fontsize: --var(--font-size-xsmall);
                                      }
                                      

                                      If you’re talking about the undocumented feature, It’s not ready yet, I just had some critical updates caught in the crossfire of forgetting to build on a dev branch. :)

                                      Also, you may want to scrub any previous custom.css for the module out and start over, a lot of the module’s css changed when I did the “one entry to rule them all” functionality above, and it may be confused a bit. This was mentioned in an older release.

                                      The "E" in "Javascript" stands for "Easy"

                                      1 Reply Last reply Reply Quote 0
                                      • S Offline
                                        Spinster
                                        last edited by

                                        @BKeyport

                                        I find it even after setting the config for monthsVertical: true it is still not showing vertical,
                                        Whay could be the problem. Please advice.

                                        BKeyportB 1 Reply Last reply Reply Quote 0
                                        • BKeyportB Offline
                                          BKeyport Module Developer @Spinster
                                          last edited by sdetweil

                                          @Spinster Indeed. Something seems to have broken. I’ll fix it today.

                                          Edit:

                                          It appears I deleted it’s CSS. Backed off to fix - Repull the files, in the module folder do

                                          git pull
                                          

                                          and relaunch your mirror, it’ll work now.

                                          Starting to recode the project to incorporate the “Undocumented feature” I mentioned in previous git pushes - as well as make it easier to read and do in the future, and I guess I missed that when I redid the CSS.

                                          The "E" in "Javascript" stands for "Easy"

                                          1 Reply Last reply Reply Quote 0
                                          • P Offline
                                            p1lspeda
                                            last edited by

                                            Hi,
                                            any idea on how I can achieve full background transparency with this module ?
                                            Currently this is it:
                                            a0063b34-07e3-48a3-9a88-ccad1c61f800-image.png

                                            Furthermore I’d like the day marking to have the same rounded edges as the week numbers.
                                            How do I achieve that ?

                                            Unfortunately I am not very experienced with css, so I most likely do not now how to ask the correct question - sorry for that.

                                            BKeyportB 1 Reply Last reply Reply Quote 0

                                            Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                                            Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                                            With your input, this post could be even better 💗

                                            Register Login
                                            • 1
                                            • 2
                                            • 3
                                            • 4
                                            • 3 / 4
                                            • First post
                                              Last post
                                            Enjoying MagicMirror? Please consider a donation!
                                            MagicMirror created by Michael Teeuw.
                                            Forum managed by Sam, technical setup by Karsten.
                                            This forum is using NodeBB as its core | Contributors
                                            Contact | Privacy Policy