Multiline Week Events

[tpurkl]

Hi,
Can anybody help me how to get the events multiline?

As you can see, the text is cut, because of my portrait view, which doesn’t provide much space.
I already tried manipulating the css like
.CX2 .event .eventMain {
height: auto;
flex-wrap: wrap;
flex-grow: 2;
overflow: visible;
}

But that’s leading to overlapping events:

[KristjanESPERANTO]

Thanks for the question! This is a known limitation discussed in #112. The week view positions events absolutely with fixed-height "timeline sleeves" — each sleeve assumes exactly one line of text. When you allow the event title to wrap, the sleeve doesn't grow, causing events to overlap.

The full CSS workaround from @mpoxberry in #112 also requires adjusting .timelineSleeve:

.CX2 .weekSlot .timeline {
  display: flex;
  flex-wrap: wrap;
  gap: 1px;
}
.CX2 .weekSlot .timelineSleeve {
  height: fit-content;
}
.CX2 .weekSlot .event:not(.fullday) .eventMain {
  height: auto;
  flex-wrap: wrap;
  flex-grow: 2; /* use 1 if no calendar icon is set */
  overflow: visible;
}

Be aware that this can cause uneven spacing between rows depending on how many events are present per day. A native solution would require reworking the layout algorithm in JavaScript, which is tracked in #112 as a feature request.