Our powerful JS Calendar component


Post by orthobridge »

We're now working with full-width timeRanges (thanks to Animal) and would like to change the orientation of the labels so horizontal (ideally very near top).

Can someone guide us / provide some code example.

Thanks

(It should be noted that the inset on the events isn't functioning as intended - on current release. Hence the gap to the left of events

Attachments
trange-oriontation.PNG
trange-oriontation.PNG (45.8 KiB) Viewed 216 times

Post by Animal »

You have to configure the view of your ResourceView, not the ResourceView. The ResourceView is not really a calendar view. It's just a container for the configured views

So you ned to configure the view with

eventLayout : {
    offset : 0
}

Post by Animal »

It sohuld be just some CSS to tweak how the ranges lay out, maybe:

.b-dayview .b-cal-timerange .b-cal-timerange-header {
    flex: 1;
}

.b-dayview .b-cal-timerange {
    writing-mode: inherit;
}

Post by orthobridge »

Animal wrote: Wed Jul 31, 2024 3:34 pm

It sohuld be just some CSS to tweak how the ranges lay out, maybe:

.b-dayview .b-cal-timerange .b-cal-timerange-header {
    flex: 1;
}

.b-dayview .b-cal-timerange {
    writing-mode: inherit;
}

Thanks. And where in the world should I seek out these items ?


Post by Animal »

In the Day cells:

Screenshot 2024-07-31 at 16.18.20.png
Screenshot 2024-07-31 at 16.18.20.png (4.08 MiB) Viewed 204 times

Post Reply