Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Day headers not aligning when using maximumDaysPerLine #40

Open
alexbergsland opened this issue Jan 3, 2020 · 2 comments
Open

Day headers not aligning when using maximumDaysPerLine #40

alexbergsland opened this issue Jan 3, 2020 · 2 comments
Labels
bug Something isn't working

Comments

@alexbergsland
Copy link

First I'd like to say that this is the first calendar I found that does not show deleted weekly reoccurring items in the calendar, which is awesome.

But I'd like to have my calendar displayed vertically and that seems to be done with maximumDaysPerLine. However that makes the day headers misaligned.
The first picture shows maximumNumberOfDays: "2" and maximumDaysPerLine: "1".
The second picture shows maximumNumberOfDays: "4" and maximumDaysPerLine: "2".

My CalendarWeek code:

{
    module: "MMM-CalendarWeek",
    position: "bottom_bar",
    config: {
        maximumNumberOfDays: "2",
        displayLocation: "true",
        showEndDate: "true",
        maximumDaysPerLine: "1",
        calendars: [
            {
                symbol: "calendar",
                url: "https://calendar.google.com/calendar/ical/xxgroup.calendar.google.com/private-xxx/basic.ics",
            }
        ]
    }
},

Fredag = Friday
Lördag = Saturday
Söndag = Sunday
Måndag = Monday

2020-01-03-231132_768x1024_scrot
2020-01-03-231035_768x1024_scrot

@alexbergsland
Copy link
Author

alexbergsland commented Jan 3, 2020

I see now that the header is centered above the event symbol, time and title and with different lengths of the event title the vertical position of the header differs.

@alexbergsland
Copy link
Author

Sorted by editing MagicMirror/modules/MMM-CalendarWeek/MMM-CalendarWeek.css.
from

.col {
  width: 20%;
  min-width: 20%;
  vertical-align: top;
}

to

.col {
  width: 20%;
  min-width: 20%;
  vertical-align: top;
  text-align: left;
}

Not really sure how that effects others though it seems fine to me.
Maybe there is a neater solution?

@heskja heskja added the bug Something isn't working label Jan 5, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants