Grid widget variance color

Apliqo UX
1

Hi,

image
image992Ă—212 29.8 KB

I need to change color of the variance in the grid widget. But it needs to be changed just for this specified widget not for all the widgets. Is it possible to do that?

UX version is 2.5.2.2

Thanks in advance

Ali,

2

Hi @acandan ,

What exactly are you trying to change here?

  • Cell background color?
  • Number (font) color?
  • Cell (bar) chart’s color?
  • Add a border like fiili / butce?

In any case, you can define a new class in the custom css folder and call in this widget from settings.

3

You could use conditional formatting for the column.
With specific class name attached e.g “custom-variance-color”
add following to the apq-c3-custom\css\custom-style.css

grid-table .handsontable .custom-variance-color > div > div.progress.apq-c3-absolute-values > div.progress-bar.progress-bar-success{
    background-color: #c7178c !important  
}
grid-table .handsontable .custom-variance-color > div > div.progress.apq-c3-absolute-values > div.progress-bar.progress-bar-danger{
    background-color: #17c72f !important  
}

Add the following to the Widget Advanced Options

"table":{
   "columnFormat": { 
      "Some Column Name": [
        { 
          "className": "custom-variance-color"
        }
      ]
   }
}

Screen Shot 2021-04-17 at 12.38.54 pm

Notice the success progress-bar is now pink change the css for desired outcome.
You could even apply conditions to only have the class custom-variance-color to be loaded if the cell value is above eg.2,000
Good luck,
Ilia Shapiro

1 Like