Month View on mobile device

[Tim]

I am using Scheduler with Month View for an application I'm developing. The control works as intended when viewing on a desktop computer, however when viewing on a low resolution device (mobile) there is cut off text for both the day labels and events which leads to a less than ideal mobile experience (refer to attachment). Is there a way to enable a more mobile friendly viewing mode for ‘Month View’?

[Svet]

Hi Tim,

Thank you for reaching out to us and for the provided screenshot.

Indeed, at the moment there isn't much that can be done on this matter. What I can suggest is to add some custom CSS in order to display ellipses whenever there isn't enough space for the complete scheduler header titles:

    `, encapsulation: ViewEncapsulation.None,

    styles: [`

    .k-scheduler-header th{

      text-overflow: ellipsis;

    }

    `]

Please check the following example demonstrating such approach:

https://stackblitz.com/edit/angular-wpkvng?file=app/app.component.ts

An alternative would be to use a template that will allow to add any custom content for the Scheduler header cells, but currently there isn't such available for the MonthView. Thus using some custom CSS as demonstrated in the provided example seems the way to go. Please let me know in case I can provide any additional details on this case or if further assistance is required. Thank you in advance.

Regards,
Svetlin
Progress Telerik