Can't overwrite .green .icon CSS classes

[stefanvangastel]

I’t looks like its impossible to overwrite some green icons.

I’m using the Custom Dashboard Extension and the following CSS code within that extension:

i.green {
    color: #2a20d4!important;
}

Unlike almost every other CSS overwrite, this one won’t work. It looks like it has something to do with the order of loading CSS on some pages?

Screenshot:

[josklever]

@stefanvangastel

i.green

First I would try to replace this with i.check.green.icon

[stefanvangastel]

Thanks for the response Jos, I’m afraid that won’t help either. Tried that before and generalized it to i.green…

[josklever]

Both are needed. But two blocks higher you see that the green color is set based on another class: i.inverted.circular.green.icon.

You just need to find the classes using the inspector and set them all to the desired color.

[stefanvangastel]

Awesome, it’s working now! Thanks Jos!