Calendar Heading Changes

ooom416354

@onetwankyfive I could but the idea is having some sort of legend as well. So you have the color coded symbols next to the events in the list but there is no way to tell who’s color is who’s (and with a bunch of really little kids, color is important)

broberg

@ooom416354 if all names will be listed over ONE combined calendar you could just add it as static text.

ooom416354

@broberg said in Calendar Heading Changes:

@ooom416354 if all names will be listed over ONE combined calendar you could just add it as static text.

Yep exactly, that would be the idea. Where would that static text be added, would it be in the config.js or would I have to create something for the custom.css?

strawberry 3.141

@ooom416354 you could use the helloworld module for it

ooom416354

@strawberry-3.141 so add the hello world module under the clock in the config.js and code it up to add the color coded “legend”, right?

strawberry 3.141

@ooom416354 put it right above the calendar module in the config with the same position

{
        module: 'helloworld',
        position: 'top_left',
        config: {
            text: '<div>John</div><div>Jane</div>'
        }
    }

EDIT it wont let me do adding styling add style=“color: blue;” for John example behind the open div tag

ooom416354

@strawberry-3.141 perfect, I will do that. thanks again!

ooom416354

@strawberry-3.141 I see that, is it possible to just add 5 separate helloworld modules each stacked on top of each other, each with a different color?

strawberry 3.141

@ooom416354 you could do that but each module has a margin around which takes up more space than adding all in one

ooom416354

@strawberry-3.141 Yea, I saw that, I guess I could modify the module itself to shrink the margin but that would cause a problem with pulling latest updates, right?

billp100

@strawberry-3.141 I am said friend that @ooom416354 is helping. I appreciate the help, I will be able to do some testing of my own tonight and tomorrow with the impending storm coming.

My ideal setup is to have the 5 members in my family share 1 calendar module, each using a separate icon. For my wife and I it’s fairly easy, because there is a male icon and female. For the kids, there is no way do differentiate them.

My other question would be, rather than using a font-awesome symbol, could I just use a letter or name in place of that?

broberg

@ooom416354

If you want it all in a row above the calender then use < span >, < div > usually stacks on top of each other.

< span style="color: blue">Dude, < /span>
< span style="color: pink">Dudette, < /span>
< span style="color: green">Tiny dude, < /span>
< span style="color: yellow">Tiny dudette, < /span>
< span style="color: purple">Tiniest thingymajigg< /span>

That should give you “Dude, Dudette, Tiny dude, Tiny dudette, Tiniest thingymajigg”

ooom416354

@broberg Yes, that makes sense but would that be added as part of the helloworld module which @strawberry-3-141 mentioned to use above?

broberg

@ooom416354 Yes, if you put that inside the text: ' ... ' it should work nicely,
But since the module doesn’t have any width constraints it could stretch the top_left area, but that depends on number of characters and font-size ofc.

ooom416354

@broberg perfect, got it, thanks.

@billp100 this should work but may need some formatting with the margins to get it to look good.

strawberry 3.141

@ooom416354 you can also add <br /> to force a line break where you want

billp100

Guys,
Thanks for the help, using your suggestions I was able to actually accomplish what I was looking for in the header of the calendar module itself.