AFK time range is shown in red and lunchtime in yellow on top of the white background.
timeranges2.png (12.04 KiB) Viewed 810 times
I want to customize it this way, I need the time ranges to be in white and other areas to be greyed out, like this. The highlighted area has no time range for Susan, Keith and Michael so it should be in grey.
timeranges.png (260.29 KiB) Viewed 810 times
I tried to change background canvas and foreground canvas colours but not able to get to the required state. is this possible to do?
Sounds like you should just set background-color to foreground canvas and style your timeranges to be white. Can you please post the code of your implementation?
Yes, I tried that, but column lines will not be visible, as the foreground canvas z-index is 2 and background canvas z-index is 1. https://www.bryntum.com/examples/scheduler/resourcetimeranges/
In this example, please add the new button code in the tbar.
{
type : 'button',
text : 'Change Timerange CSS',
onAction : () => {
document.getElementsByClassName("b-sch-foreground-canvas")[0].style.backgroundColor = "#f5f5f5";
let ranges = document.getElementsByClassName("b-sch-resourcetimerange");
for(let r of ranges){r.style.background = "white";}
}
}
The time ranges are not so visible if we add semi-transparent colour, and we actually wanted to display like this with clear column lines on the time ranges.
timerange-issue2.png (191.41 KiB) Viewed 792 times
