MMM-CalendarExt

[justjim1220]

@yoey2112

May I ask how you were able to show blank events?

mine looks like this, all jumbled up and no blanks…

[justjim1220]

@yoey2112

add the following to your custum.css file

 #CALEXT_month.tableStyle {
  max-width:100%;
  width:100%;
  background:none;
}

[justjim1220]

@Sean

Do you see the calendar posted above by @yoey2112 ?

It has blank events instead of collapsed events, I am wanting mine to look like that!

But, I can’t figure out how to get it done!

[yoey2112]

@justjim1220 I added that to my custom CSS but its still fairly small, a little bigger though. Is there any way to adjust the height of that location as well?

[justjim1220]

@yoey2112

what did you add? I have been looking to do this!

the height is self-adjusting per the font sizes and line heights for the table cells.

May be able to figure out a better way if I had the code you used to get the empty cells to show like that.

[A Former User]

@justjim1220
I’ve already sent email for which was talked between us.

@yoey2112
For the whole module width;

.CALEXT .tableStyle {
    margin:auto;
    max-width: 90%; /*  change to 100%  and if you want, you can add field `width` */
}

But it will be affected by your MM body width (By default, it has some margin)

[yoey2112]

@Sean Can I also adjust the height of the calendar? Example, if I wanted the Calendar to take up the entire bottom half of a Vertical screen?

[A Former User]

@yoey2112
Not easy, but I think possible.

It looks you are using weeks (4 weeks) view, So you can adjust the height of each day slot inweeks or months view with this;

.CALEXT .tableStyle td.slot {
  max-height:150px;
  height:150px;
}

Add above codes in your css/custom.css. Adjust the value for your purpose.

Then, in your config,

config: {
...
  views: {
    ...
    weeks: {
      ...
      overflowHeight:150, 
      ...
    },
    ...
  },
...
}

For further details; https://github.com/eouia/MMM-CalendarExt/wiki/Manipulation-of-looks#viewlimit--viewoverflow
But there could be performance issue in RPI; https://github.com/eouia/MMM-CalendarExt/wiki/Performance-Issues

[bokifide]

Hi! Love this module :) thank you.

Just wondering if there’s a way to omit Saturday and Sunday?
Been poking around and I haven’t been able to figure it out =/

Thanks ahead <3 :)

[A Former User]

@bokifide
Add this to your css/custom.css

.day_6 {
  display:none;
}

.day_7 {
  display:none;
}

.CALEXT .tableStyle td {
  width:17%;
}

[bokifide]

@sean said in MMM-CalendarExt:

.day_6 {
display:none;
}

.day_7 {
display:none;
}

.CALEXT .tableStyle td {
width:17%;
}

Worked!! Thank you so much, that’s perfect :)

[Doudy]

Hello,

How can I delete the text ‘in 15 hours’
In addition it does not seem right to me.
Or does this indicate the end of the event?

module: 'MMM-CalendarExt',
position: "top_left",
config: {
		colored: true,
		        system: {
		        show: ['current','daily'],
		        locale: 'fr-be', //when omitted, default value would be your system default locale by moment.js
			showEmptyView: 0,
			fullDayEventLocalize: 0,
			redrawInterval: 30*60*1000, //minimum 60000
			userProfileConfig: 0,
			startProfile: ''
			},
views: {
	current: {
		position: "top_left",
		title: "Aujourdhui",
		limit: 3,

etc...

Thanks![alt text]

[A Former User]

@doudy
I’m on travel, so I’ll reply to you on Monday.

[Doudy]

@doudy
Thanks

[A Former User]

@doudy said in MMM-CalendarExt:

How can I delete the text 'in 15 hours’

add this in your ~/MagicMirror/css/custom.css

.CALEXT .current .eventTime {
  display:none;
}

Or does this indicate the end of the event?

Sorry, That’s not available.

[Doudy]

That is OK.
Thanks

[cptkex]

hi! still loving your module but im having some issues :/

i´ve been trying to add the code you have linked previously to make the calender bigger but i cant seem to stretch it to the screen sides?

also, why is tuesday bigger then the rest?

how do i remove the corners for each entry text?

it doesnt seem to recognize my oneLineEvent: 1; ?

any help is greatly appriciated

[A Former User]

@cptkex
First, I should know your whole CSS and Configuration to give detail and exact answer,
Anyway,

i´ve been trying to add the code you have linked previously to make the calender bigger but i cant seem to stretch it to the screen sides?

Add this into your MagicMirror/css/custom.css

.CALEXT .tableStyle {
    margin:0;
    max-width: 100%;
}

More detailed adjustment could be needed. But most of case, this is enough.

also, why is tuesday bigger then the rest?

Because Tuesday has more long-text event than other day. I set this as relative-width. You can fix it by this.

.CALEXT .tableStyle td {
    /* Set values for your environment or screen size */
    width: 17%; 
    max-width: 17%;
    min-width: 17%;
}

Or This.

.CALEXT .tableStyle td {
  /* adjust for your screen size */
    width: 100px; 
}

how do i remove the corners for each entry text?

#CALEXT_weeks.tableStyle .event.endHere .eventContainer{
  border:none;
  border-radius:0;
}

#CALEXT_weeks.tableStyle .event.startHere {
  border:none;
  border-radius:0;
}

it doesnt seem to recognize my oneLineEvent: 1; ?

It is working. So, Some events are showing only start time. If you grow the width of cell, you can see more clearly.

Anyway, weeks and months types are not so good for Vertical Screen because vertical-width could be around 1080px,(Maximized, when you remove all the default margin of MM) It means each cell could have only 140px width at most. it would be not enough space for displaying event. You need to use smaller font size.

(you’d better to learn some CSS skills if you have interests.)

[cptkex]

@sean thanks for replying, and yes i should definitly learn more CSS if i want to use this. I just needed to know where to start, and i can work myself forward from there. I know the 1080 pixel space isnt optimal for a Weeks setup, but going through all the other alternatives, it provides just the right kind of data for my family´s day to day activities, so its more suitable. I am playing around with the font sizes, trying to find what fits within the design and how visible it is. I have tried other setups for greater visibility, but ended up with this being the best option together with the upcoming one that is more “at a glance”

thank you so much for your help, ill try to read up on some CSS so i dont bother you with every little detail. My biggest problem has been that i dont know where to start, and now i have enough data to start changing parameters to learn what i need to change to achieve the best possible outcome.

[A Former User]

@cptkex
I think https://www.w3schools.com/ is the best source for the beginners. I wish you have a good luck.