Extending the separator to the timeheaders

Asked by Vincent
3 years ago.

I've added a separator to indicate on the scheduler which day is today. I would like to extend this separator to the time headers as well(if that time header begins on today's date)

To do this, i have added the following in the onBeforeTimeHeaderRending:
if (args.header.start == DayPilot.Date.today())
{
args.header.cssClass = "scheduler_default_timeheader_separator";
}

While this css override does let me modify the left border, it does not seem to allow me to modify the right side border. The following css will result in a missing right-side border for that TimeHeader:

.scheduler_default_timeheader_separator
{
border-left: 1px solid #000000;
border-right: 1px solid #000000;
}

What am I missing? Why is the border between wed 2 and thu 3 no longer visible?

how-to javascript

screen-shot-2020-09-02-at-3.02.28-pm.png

Answer posted by Dan Letecky [DayPilot]
3 years ago.

You shouldn't add borders to the main time header div (.scheduler_default_timeheader_cell) because it changes its dimensions (it uses the default "box-sizing: content-box" style). The borders are defined for the inner div (.scheduler_default_timeheader_cell_inner) where id doesn't affect the cell width.

However, it's better to add the line as an active area to the time header - that will work for separators with any date (not just those aligned with cell start). See an example here:

https://code.daypilot.org/97796/javascript-scheduler-show-separators-in-the-time-header

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

Extending the separator to the timeheaders

Products

Learn

Get Support

DayPilot Pro