MMM-Multimonth

BKeyport

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.

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.

ShoeBox

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

matelot20

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

BKeyport

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

PH1TCH

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

BKeyport

@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.

PH1TCH

@BKeyport Okay, thanks for the update!

Werner1340

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

BKeyport

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

.normal {
  color: #999;
}

Werner1340

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