Conditional text color

#1

Is it possible to change text color conditionally in a table or in a text display? For example, color the text red if the value is negative.

#2

Hi Bruce,

Yes you can. You can do this by editing the HTML. You can choose a CSS class, based on a model variable.

For example, suppose you had a variable in you model colorChoice, with values 1, 2, 3, or 4.

Edit the HTML of the page you want to adjust.

<style type="text/css">
   .value-1 { color: grey }
   .value-2 { color: purple }
   .value-3 { color: blue }
   .value-4 { color: orange }
 </style>

Then find the div tag surrounding your text and add a data-f-class attribute.

 <div data-f-class="colorChoice">
   Content colored by variable colorChoice
 </div>

This will set the CSS class to “value-1”, “value-2”, etc depending on the variable colorChoice. The text will be appropriate colored.

More in our docs here:
https://forio.com/epicenter/docs/public/how_to/flow_conditional/

WILL

#3

Thank you Will. How do I specify the value threshold for a continuous variable?
For example, less than 1 red, or greater than 1 blue?

#4

Hi – make a model variable which provides a discrete value indicating the color you wish to choose. For example:

Check for Less Than One = IF(Other Variable < 1, 1, 0)

#5

Thank you Will. I am trying to use this with a checkbox - to color the checkbox label based on the value of a variable. It works, but I get a “i” between the label and checkbox. I am not using any help text. How can I get rid of the “i”? Here is the code I am using:

textlabel
#6

Never mind - figured it out