Unit week view styling

Scheduler
#1

We are using the week_unit functionality, nothing fancy, as described here Units View Scheduler Docs.

However, when there are many units especially, the days really blend into each other (see attached screenshot). Is there a way to make the divider between days darker to separate the days visually,

weekview
weekview2920×768 110 KB

#2

Hello,

You can adjust the thickness and color of the borders using CSS:

.dhx_scale_time_slot {
    border: 2px solid red;
}

.dhx_scale_bar {
    border: 2px solid red;
}

Example: DHTMLX Snippet Tool

#3

This doesn’t do what I want though, just a single line to divide each day.

#4

Hello,

In that case, you can try using more specific selectors:

.dhx_second_scale_bar {
    border-left: 2px solid #b0bcc6;
    border-right: 2px solid #b0bcc6;
}

.dhx_second_cal_header .dhx_scale_bar[aria-label="Unit A"] {
    border-left: 2px solid #b0bcc6;
}

.dhx_second_cal_header .dhx_scale_bar[aria-label="Unit D"] {
    border-right: 2px solid #b0bcc6;
}

.dhx_cal_data > .dhx_scale_holder:nth-child(4n + 1 of .dhx_scale_holder[data-column-index]) {
    border-left: 2px solid #b0bcc6;
}

.dhx_cal_data > .dhx_scale_holder:nth-child(4n of .dhx_scale_holder[data-column-index]) {
    border-right: 2px solid #b0bcc6;
}

Example: DHTMLX Snippet Tool