MMM-CalendarExt

[Zooooooom]

@Sean Beautiful! Exactly what I wanted.

[Vauxdvihl]

Great Job
Thanks a lot

[Vauxdvihl]

Hi Sean,
i have a few more questions

Please look to my attached screen:

a.)
Today is “not viewable” because it is “more or less” complete white
Any Idea

b.)
Is there a chance to increase the size of the symbols (i mean the symbols in front of the date…like the football)

c.)
I was wondering that your dates a looking a little bit different
In your dates you have the information about the timing and the location.
I have put the same infos in my google calendar but they will not be shown

Thats a lot

[A Former User]

a.)
Today is “not viewable” because it is “more or less” complete white
Any Idea

That is my fault. After some CSS test, my experimental CSS was committed by accident, I thought.
I’ll fix it ASAP.(after answer of this)

b.)
Is there a chance to increase the size of the symbols (i mean the symbols in front of the date…like the football)

in your css/custom.css
you can put these;

div.CALEXT  .event .symbol {
    order:1;
    display:block;
    flex-basis: 30px; // Modify this 
    text-align:center;
    min-width: 30px; // Modify this
    font-size: 150%; // Add this
}

c.)
I was wondering that your dates a looking a little bit different
In your dates you have the information about the timing and the location.
I have put the same infos in my google calendar but they will not be shown

Thats a lot

This is also same with answer of a). Sorry again.

[A Former User]

@Vauxdvihl
I think I’ve fixed it. pull the source and try again.

[Vauxdvihl]

Amazing
Thanks a lot

[Vauxdvihl]

Hi Sean,

according to b.)
Sorry to asked again.
While playing a little bit with the config parameters, i can “only” adjust the size of the area within the symbol is located.
But it doesn’t change the size of the symbol itself
Thanks a lot

[A Former User]

@Vauxdvihl
Did you add this?

 font-size: 150%; // Add this

Give bigger value for that.(And you need to change value of *-width for adjusting)

[Vauxdvihl]

@Sean
I am not a programmer :-)
I have played a little bit…also with big values, but the symbol size does not change.
Maybe i am doing something wrong?

/*****************************************************
 * Magic Mirror                                      *
 * Custom CSS                                        *
 *                                                   *
 * By Michael Teeuw http://michaelteeuw.nl           *
 * MIT Licensed.                                     *
 *                                                   *
 * Add any custom CSS below.                         *
 * Changes to this files will be ignored by GIT. *
 *****************************************************/


 
 div.CALEXT  .event .symbol {
    order:1;
    display:block;
    flex-basis: 40px; // Modify this 
    text-align:center;
    min-width: 50px; // Modify this
    font-size: 800%; // Add this
}
 	

[A Former User]

@Vauxdvihl
Ok. I know what’s the problem. I’ve forgotten emoji belongs different section.
put this in your css.

div.CALEXT .events .symbol.emoji {
    font-size: 100%; //Adjust this as your wish. you can use px or %
}

[Vauxdvihl]

@Sean
Perfect for some symbols
But the symbol “trash-o” will be not “re-sized”.
I have to look for a symbol in other sources == > “em”…and so on

[A Former User]

@Vauxdvihl
for emoji(@em) size, see my last answer.

for FA and MD (default and @fa & @md) sizes are related to my previous answer.

[Vauxdvihl]

@Sean
It works fine with adding this code to custom css :-)

div.CALEXT .events .symbol.font-awesome {
    font-size: 250%; //Adjust this as your wish. you can use px or %

[A Former User]

@Vauxdvihl Ye… Maybe that’s another solution. :)

[Vauxdvihl]

@Sean
Sorry again but i have another question / problem
You can see in my above standing screens that split view => current / upcoming does not work.
But before doing the update it was working.

Here is my config code

		{
				module: 'MMM-CalendarExt',
				position: "lower_third", //anywhere. It is not related to real position of view
				config: { // Read below
				system: {
				  show: ['current','upcoming','daily'],
				  locale: 'de', //when omitted, default value would be your system default locale by moment.js
				  showEmptyView: 0,
				  fullDayEventLocalize: 1,
				  redrawInterval: 30*60*1000, //minimum 60000
				  useProfileConfig: 0,
				  startProfile: ''
				},
				
				 views: {
						current: {
						  position: "top_left",
						  title: "Heute",
						  limit: 3,
						},
						upcoming: {
						  position: "top_left",
						  title: "Demnächst",
						  limit: 3,
						},
						daily: {
						  position: "bottom_bar",
						  title: "Überblick",
						  counts: 7,
						}
					  },

[Vauxdvihl]

@Sean
Hi,
it is me again.
After having everything running, my wife wants to have the view “weekly” with 2 counts.
Now i have the “problem”, that i search for the config parameter which allows also to see the timings in this view (like 08:00-10:00 …and so on)
Is it possible in the “weekly” view?
Thanks again for your support and help

[A Former User]

@Vauxdvihl
Yes possible.

Put this code in your css.

div.CALEXT .tableStyle .eventTime {
    display:block;
}

I’m not on the console on weekends, so i didnt test it, but i think it will work.

Ps. that view is not ‘weekly’. It is ‘weeks’

[Vauxdvihl]

@Sean
Yes you are right…it is the view "weeks
Now i have in the appointment also the date within…it looks a little bit twice…because the date is also within the header of the week…

May be you can help me

Thanks a lot

[A Former User]

@Vauxdvihl
Maybe on Monday I’ll provide you a patch about that.
In ‘Month’ and ‘weeks’ view, I assume nobody needs exact time, because those views might have too many events to show with time. So I I’ve thought time displaying is needed in only daily, upcoming, current.
Anyway, I’ll follow opinion of my real users. :)

[A Former User]

@Vauxdvihl
I’ve finished the patch, re-pull the source and try again.