• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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
77 Posts 19 Posters 26.9k 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.
  • B Offline
    BKeyport Module Developer
    last edited by BKeyport Jun 10, 2024, 2:13 AM Apr 19, 2020, 9:23 AM

    MagicMirror Module to display a calendar with multiple months

    A mini-calendar with as many months as the user wants, assuming screen space is available.

    vert-noweek-norep.png

    horz-noweeknum.png

    Download

    https://www.github.com/BKeyport/MMM-Multimonth
    [card:BKeyport/MMM-Multimonth]

    Installation

    Clone this repository in your ~/MagicMirror/modules/ folder ( $ cd ~MagicMirror/modules/ ):

    git clone https://github.com/BKeyport/MMM-Multimonth.git
    

    Using the module

    To use this module, add it to the modules array in the config/config.js file:

    {
      module: 'MMM-Multimonth',
    	position: 'top_left', // can be any of the postions
    	config: { // Optional - will default to 3 months, with one previous and one next. 
    	  startMonth: -1, // Define when you start from current month (negative is before current, zero is current, positive is in future) 
             monthCount: 3, //  How many months to display 
             highlightWeekend: false // highlightWeekend if desired, set to true. 
    	}
    }
    

    Many thanks to kirash for the inspiration with the monthly_calendar module, sdetweil and lavolp3 for the help in coding and CSS work. Without your help, this would just be a pipe dream.

    This is a basic module, but I felt it was good enough for release to the public.

    Please, if you have any suggestions for improvement, let me know, I’m learning Javascript and CSS as I write this, and I dream of much bigger things.

    Localization is provided by moment.js and controlled by the master language of MagicMirror. Please file any errors with localizations as bugs with the moment.js team - https://github.com/moment/moment/

    Please see github for version info and further instructions.

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

    B 1 Reply Last reply Oct 30, 2022, 1:54 AM Reply Quote 6
    • S Offline
      ShoeBox
      last edited by Apr 26, 2020, 2:46 PM

      @BKeyport this is great! Thank you. Is there a way to change the colors?

      1 Reply Last reply Reply Quote 0
      • M Offline
        matelot20
        last edited by Apr 26, 2020, 9:37 PM

        @BKeyport I would like to know as well if the header color can be changed.

        1 Reply Last reply Reply Quote 0
        • B Offline
          BKeyport Module Developer
          last edited by Apr 26, 2020, 10:45 PM

          yes. It’s all in CSS. Take a look at the CSS file in the directory, and copy over to your custom.css

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

          1 Reply Last reply Reply Quote 0
          • P Offline
            PH1TCH
            last edited by May 30, 2020, 11:32 AM

            @BKeyport Great MMM, exactly what I was looking for! :winking_face: Can the first day of the week be changed to monday?

            B 1 Reply Last reply May 31, 2020, 9:44 PM Reply Quote 0
            • B Offline
              BKeyport Module Developer @PH1TCH
              last edited by May 31, 2020, 9:44 PM

              @PH1TCH It’s in the notes I haven’t figured out how to do this yet. Everything I’ve tried has failed due to API issues. I’m cracking on it when I can. My business takes priority, and we’ve been extended out due to this whole virus thing.

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

              P 1 Reply Last reply Jun 1, 2020, 10:49 AM Reply Quote 0
              • P Offline
                PH1TCH @BKeyport
                last edited by Jun 1, 2020, 10:49 AM

                @BKeyport Okay, thanks for the update!

                1 Reply Last reply Reply Quote 0
                • W Offline
                  Werner1340
                  last edited by Jun 28, 2020, 4:48 AM

                  Hello, how can I change the color from grey (days+numbers) from grey to white?

                  B 1 Reply Last reply Jun 28, 2020, 6:57 AM Reply Quote 0
                  • B Offline
                    BKeyport Module Developer @Werner1340
                    last edited by Jun 28, 2020, 6:57 AM

                    @Werner1340 That’s actually a magicmirror default. I believe it’s getting it from here:

                    .normal {
                      color: #999;
                    }
                    

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

                    W 1 Reply Last reply Jun 28, 2020, 7:46 AM Reply Quote 0
                    • W Offline
                      Werner1340 @BKeyport
                      last edited by Jun 28, 2020, 7:46 AM

                      @BKeyport Hm, i found that code in the main.css and changed the color to #fff.
                      …still grey color in calendar. ;-). any more Ideas?

                      1 Reply Last reply Reply Quote 0
                      • 1
                      • 2
                      • 3
                      • 4
                      • 5
                      • 6
                      • 7
                      • 8
                      • 1 / 8
                      • 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