search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Modifying the left barColor styling?

Asked by JC
2 months ago.

Are there any CSS (or other JavaScript) properties that allows us to modify the sidebar (barColor) a little?
Current we have:
args.e.barColor = "#c5003b";
args.e.barBackColor = "#c5003b";
args.e.backColor= args.e.tags.color;
args.e.fontColor = "#fff";

We would like to be able to modify width of the bar for starters.

Thank you!

Answer posted by Dan Letecky [DayPilot]
2 months ago.

You can control the bar width and other properties using CSS. The bar is built using two nested divs with the following CSS classes (applies to the default "calendar_default" theme):

calendar_default_event_bar
calendar_default_event_bar_inner

You can override the styles directly or you can add a custom CSS class and use it to target the event:

dp.onBeforeEventRender = args => {
  args.data.cssClass = "my_class";
};

CSS:

.calendar_default_event_bar.my_class .calendar_default_event_bar_inner {
  width: 10px;
}

Comment posted by JC
2 months ago.

thanks! perfect

New Reply
This reply is
Your name (optional):