Last Updated: 22 Jun 2022 14:48 by ADMIN
Created on: 16 Jun 2022 13:45
Category: ProgressBar
Type: Feature Request
Add Property to set color of Progress Bar

It would be nice if there was a property on the TelerikProgressBar to change the color of the bar.   You can modify it now, however its not intuitive.

Use Case:

I have a grid showing data on projects.

  I want to show the %complete of a project using a progress bar and want to conditionally change the color of the bar based on % complete and time left.


Current Process

You can modify the color of the bar by setting the Class on the bar and adding a selector for the class .k-state-selected

<TelerikProgressBar Class='bg-green' Max="1" Value="(double)value" >

  .bg-green {

    .bg-green .k-state-selected  {
    background-color: green;


=====ADMIN EDIT=====

Here is an example of the desired result in another component you can use as a reference: https://demos.telerik.com/kendo-ui/arc-gauge/colors.