eouia / MMM-CalendarExt

Calendar views for MagicMirror
MIT License
55 stars 18 forks source link

Need to display event times in 'weeks' calendar view #56

Closed wfsaxton closed 5 years ago

wfsaxton commented 5 years ago

Is there a way to do this?

I'd actually prefer to use the "daily" view as it contains the times AND looks better, but there doesn't seem to be a way to force it to display, say, in 4 rows of 7 days to simulate a "weeks" look.

For now, I hacked the MMM-CalendarExt.css file by setting the flex-basis on the .slot class so only 7 days appear per row in the "daily" view. I'm obviously looking for a more elegant solution than this though!

CALEXT .slot {
    margin-left:5px;
    margin-right:5px;
    flex-grow: 1;
    /* HACK */
    /*flex-basis: 100px;*/
    flex-basis: 12%;
    box-sizing:border-box;
    margin-bottom:5px;
}
eouia commented 5 years ago

Your approach is right. I made daily view to be able to apply for that purpose. You can make it looks like "weeks" view by adjusting CSS rules. Just one thing; You'd better not to modify MMM-CalendarExt.css directly. You can redefine or override your CSS rule in css/custom.css. That is prior than module's CSS, so it's better to maintain and update.

Example;

/* your `css/custom.css` */
CALEXT .slot {
  flex-basis: 12%;
}

Will override that filed of MMM-CalendarExt.css

wfsaxton commented 5 years ago

Sounds good.