Modifying the left barColor styling?

Asked by JC
5 years 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!

how-to javascript

Answer posted by Dan Letecky [DayPilot]
5 years 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
5 years ago.

thanks! perfect

This question is more than 1 month old and has been closed. Please create a new question if you have anything to add.