MMM-Multimonth

[retroflex]

Great module @BKeyport , thanks a lot! I changed my custom.css a bit to match my other modules and ended up with a rather minimalist look:

Here’s the css if anyone’s interested:

.MMM-Multimonth .month {
  padding-left: 0px;
  padding-right: 0px;
}
    
.MMM-Multimonth .month-header {
  background-color: #000000;
  text-transform: uppercase;
  font-size: 15px;
  font-family: "Roboto Condensed", Arial, Helvetica, sans-serif;
  font-weight: 400;
  border-bottom: 1px solid #666;
  line-height: 15px;
  padding-bottom: 5px;
  margin-bottom: 10px;
  color: #999;
  border-radius: 0px;
}

.MMM-Multimonth .days-header {
  color: #808080;
  text-align: center;
}

.MMM-Multimonth .weeknumber:before {
  content: "v. ";
}

.MMM-Multimonth .weeknumber {
  background-color: #000000;
  color: #808080;
  padding-right: 9px;
}

.MMM-Multimonth .day {
  text-align: center;
}

.MMM-Multimonth .current_day {
  background-color: #FFD11C;
  text-align: center;
  border-radius: 4px;
  padding-left: 0px;
  padding-right: 0px;
  margin-left: 4px;
  margin-right: 4px;
}

[BKeyport]

@retroflex Nice!

[BKeyport]

new product released!

Added:
Language and calendar modification unlinked. The module now has startWeek variable to set the start of the week

You now can shorten the day names to the shortest available for your language. (for english, instead of “Sun Mon Tue Wed Thu Fri Sat” it will be “S M T W T F S”

Removed:
All references and use of Moment. It’s now native code completely.

Other:
There’s a bug - Week numbers are in the system, but it will generate an additional line. I am going to re-do the module more (enough to create a MultiMonth2), so in that process I’ll sure I’ll find the cause.

As a reminder, internationalization is based on the mirror as a whole, so if you have your mirror set to French, it will have French month and day names.

Read the Readme for instructions.

Thanks to MMRize for the inspiration to do this!

[pugsly]

I only want to display a single month, how do I remove the beginning and ending dates from the current month calendar? Also seems like the alignment is off.

[BKeyport]

@pugsly

add this to your custom.css file. It will clear it out. As for the malformed space, I’ll have to look into that, it appears something’s minorly wrong with the CSS, which I didn’t touch from previous version.

.MMM-Multimonth .daydim {
color: var(–color-background);
}

[Egnos]

@BKeyport great work!
Thanks.

[p1lspeda]

Great Module, but I think I found a small issue/bug.

The October I live in has 31 days, any idea what’s wrong ?

[sdetweil]

@p1lspeda I had a similar problem in code I am porting.

month takes 4 or 5 weeks to show all the days… oops or 6 occasionally!

[BKeyport]

@p1lspeda Yep. Bug confirmed. Something to do with the start of week being specifically on monday (I suspect start of week and end of month being the same day). I’ll look into it when I’m able. We’re busy at work at the moment. Short term fix: set start of week to any day but Monday. 😉

[BKeyport]

@p1lspeda Bug Squashed (99% sure). Thanks for reporting.

[p1lspeda]

Confirmed,
Bug fixed.
Thanks for (very) quick fix.

[BKeyport]

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

[marchvet]

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)

[BKeyport]

@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

[marchvet]

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

[marchvet]

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

[sdetweil]

@marchvet ~/MagicMirror/css/custom.css

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

touch ~/MagicMirror/css/custom.css

[BKeyport]

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

[sdetweil]

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

[marchvet]

Thanks I appreciate it. Works like a charm!