Colors of Gantt Task bars

[Patrick]

The colors for the taskbar overall and completed are too close to one another such that some of the user cannot tell the percent complete. Can anyone tell me the styles to use to color of the overall bar and completed portion.

I have tried (with primary colors as a test.

div.k-task-template {
    background-color: red !important;

}
k-task.k-task-complete {
    background-color: yellow !important;
}

any help would be appreciated.

[Ivo]

Hi Patrick,

Here's a sample code that changes the background color of the Gantt task bars:

.k-task-single {
  background-color: red;
}

.k-task-single .k-task-complete {
  background-color: yellow;
}

You can see the code in action in this Stackblitz example.

Please note that for the styles to take effect, the encapsulation of the component must be set to 'ViewEncapsulation.None'.

Alternatively, place the styles in the global styles.css file.

Let us know in case additional information is needed.

Regards,
Ivo
Progress Telerik