How to set color of user-title depending on text in it?

Hi guys,

I’ve just installed my Discourse forum, absolutely loving it. The only thing I miss now is that users can’t directly see who is an admin, moderator or developer. I have set the Title (user-title) for these users, but it’s small text one can easily skip over.

So I decided to add some CSS to the user-title class, making it look like this:

The CSS I used:

background: #F55;
border-radius: 3px;
color: #FFF !important;
font-size: 12px!important;
padding-left: 7px;

I’m wondering now if it’s possible with JavaScript to change the background color depending on the text that’s inside the <span class="user-title"></span>. This way I could add different colors depending on the “rank”/title.

Any help would be greatly appreciated :smiley:

In our forum we have different text colors (not background color) for member names according to what Group they are in. i.e.
Admins = red
Team Leaders = blue
Advisors = green
Mentors = orange

Maybe similar would be doable for you?

.names span.Administrators a {
    color: #DC2E17;

Oh that works too. I didn’t even see that usernames just have their groups added to them as class, that makes things easier.



This topic was automatically closed after 3407 days. New replies are no longer allowed.