We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Is it possible to change color of the "out of bunds" indicator for timeline view?


I am using event templates including custom colors for our timeline view, and it annoys me that the color for the arrows when the event extends out of the current view are the default blue color. Is the nowhere to change this?

I need to be able to set the color programticly during runtime.
Example of the event template.

var Data = context as Visit;
<div class="@(Data.GetTemplateDiv())">
<div class="subject">
<div class="worksheet appointment-header">@(Data.Subject + " - " + Data.TaskId)</div>
<div class="worksheet">@(Data.StartTime.ToString("HH:mm")) - @(Data.EndTime.ToString("HH:mm"))</div>

By the way how does one post code snippets in the forum? I have done it by accident before. But i can't figure out how to do it. The code formatting not do it, it only formats the text.

1 Reply

RM Ruksar Moosa Sait Syncfusion Team October 7, 2022 11:53 AM

Hi Jens,

We have checked on your query and suggest you to customize the left and right indicators (arrows) in the event template and hide the default left and right indicators using the below CSS class like the below code to achieve your requirement. Kindly try the attached sample and let us know if this meets your requirement.

.e-appointment-details .e-indicator.e-icons.e-right-icon,

.e-appointment-details .e-indicator.e-icons.e-left-icon


     display: none;


By the way how does one post code snippets in the forum?

You can either directly paste the code or attach (zip) the related files in the forum.


Ruksar Moosa Sait

Attachment: BlazorEventTemplate_d6cb66db.zip

Live Chat Icon For mobile
Up arrow icon