Conditional css

In List Managemt I am suing a CSS Class cbListFieldCont.cbUserListFC_cb_unreadmessages for my cb_unreadmessagews column which is a Query field:

SELECT COUNT(*) FROM `#__uddeim` WHERE `toid`='[user_id]' AND `toread`='0';

How do I change the CSS class based on the value of the COUNT(*).

e.g.

COUNT(*) = 0 - 5 --> span.cbListFieldCont.cbUserListFC_cb_unreadmessages { color: green;}
COUNT(*) = 6 - 10 --> span.cbListFieldCont.cbUserListFC_cb_unreadmessages { color: yellow;}
COUNT(*) > 10 --> span.cbListFieldCont.cbUserListFC_cb_unreadmessages { color: red;}


Anyone please?

I recommend using the Userlist Value Layout usage for the field. Edit the field within CB > Field Management. Then under Parameters > Layouts set Userlist Value Layout to something like the following.

Let me try this and get back to you. Thanks!

It's working. But why does it affect the online status symbol? See attached image.

I don't see an option to submit image?

It's working. But why does it affect the online status symbol? See attached image.

Shouldn't affect anything except the field you edited. You should be able to straight copy and paste what I've provided.

I don't see an option to submit image?

You need to do a full reply and add an attachment. Quick reply doesn't display the editor functions as it's just a quick reply.

I change date class from text-danger to text-high and the problem went away.