Changing the background color of my list depending on the value

So this picture we can see some data about heart beating and on this list I wanted to change the background color depending on the value that the max as. 

Ex: if the max is higher than 120 I want the list to be red on that day, and if the max is lower than 120 I wanted it to be green

Hi Tiago,

If I understood your question correctly, you can simply do an if in the class property of the container:

Let me know your thoughts,

Cheers,

Rúben

Solution

Hi tiago ruhle,

You can also configure the list item (if you want to color the line). Consider that you have two options:

1) Provide a class as Ruben G explained
2) Provide a style in properties (not best solution for reusability), and set attribute "style" with an expression like the next one:

Solution

Hey Ruben

I try it, if I do it on the container's Style Classes I don't get any result so I change it to the list's Style Classes and now everything is dark green

Hey Marco,

The second options is working :)

Thxs for the replies

Hi tiago ruhle,

Good to know you made it work! Now take in consideration (as I mentioned before) that CSS inline is not the best practice of OutSystems for static values (like the values you want to use).

All you need to do is to place the same expression, in the class property field (as Ruben mentioned). Take in consideration also this article of OutSystems and see the section "Style Classes to Simplify Customization":

https://success.outsystems.com/Documentation/Best_Practices/The_Complete_Guide_to_Creating_Components

Any question just ask!
Cheers!