User Group Colors as Template Accents

options
User Group Colors as Template Accents written Mar 22, 2019 18:14:21 GMT
55written posts
mavrohearned bits
offlinecurrently
mavroh
Junior Member
mavroh Avatar
As the title suggests, I'm trying to find out if there's a way that you can use the type of code used for the user profile layout template { color:#$[user.group.color]; } that automatically aligns all of the relevant things on the user profile to the color of that user's group on a template that has certain color accents that would always match the user's color, without having to change anything within the template.

So that, say, a character application would always have the color of the group of the user who posted the character application. I've tried google and proboards help forums, but I haven't found any results for this specific question, and before I clog the support forum, I thought I'd try here since there are a lot of great coders around who know stuff about color accents.


options
User Group Colors as Template Accents written Mar 22, 2019 20:21:17 GMT
pronounsno preference /o/
298written posts
offlinecurrently
k̾u̾r̾a̾ 💩
Senior Member
k̾u̾r̾a̾ 💩 Avatar
perhaps i am faint glimmer —
so if i'm understanding what you want correctly, you want the colours of a person's template to match with the colour of their group without having to manually edit the template yeah?

(if i'm not, just let me know so i can yeet this post out of existence)

go to layout templates > thread > post list and find the line of code where the message class is. add $[post.created_by.group.name] after it so it looks like this:

<div class="message $[post.created_by.group.name]">$[post.message]</div>


go to your style sheets and add classes for everything you want to have this member group colour by using a class name that looks like this:

.message.group-name h1 {
color: #00ff00;
}


"group-name" is case sensitive, "h1" can just be whatever class you want to colour change. the important thing here is that you don't have any spaces between .message and .group-name

i tested it out here
last edit on Mar 22, 2019 20:38:33 GMT by k̾u̾r̾a̾ 💩
options
User Group Colors as Template Accents written Mar 24, 2019 23:19:18 GMT
55written posts
mavrohearned bits
offlinecurrently
mavroh
Junior Member
mavroh Avatar
Hey , thanks for the response! I didn't understand your explanation at first, but I also posted this question on the discord and responded with basically the exact same explanation you gave, except she also handheld me the entire way through the process, which ultimately made me realize that this was EXACTLY what you also proposed.

I thank you both really hard for helping me with this. Coding GODS you are, the world must know!

For completions sake in case future generations should ever ask themselves the same question, I'll add Pharaoh Leap's answer as well. ALL CREDITS FOR THE FOLLOWING GO TO

SPOILER: Click to show
pharaoh leap Avatar
said:
Also, nope, you can't. ;u; Only specific variables load in specific Layout Templates. WHICH... STINKS, BUT... ALAS...
Wait, heck, this might be easier said than done. strokes chin
A'IGHT, GOT IT. This isn't the perfect reach-around, but Proboards stinks, so this'll have to do.
Go to your Layout Templates. Go to the Thread Template, and then the Post List tab.

On line 28, you'll find this: <div class="message">$[post.message]</div>

Replace the whole line with this: <div class="message"><div class="c-$[post.created_by.group.name]">$[post.message]</div></div>
In your CSS, you'll now be able to style anything within that new class c-$[post.created_by.group.name] to change colors how you want.
Let's say you're trying to change the background color of a a class named "colortop", and the character's group is is called "Group". The group's color is #ff0000. In your CSS, you can write something like this:

.c-Group .colortop { background-color:#ff0000!important; }
Since you still can't call on the $[user.group.color] variable in your CSS, you'll have to do this manually for each group, unfortunately. :'D
So if you were changing the background-color for one class for three different groups, it'd look like:

.c-GroupOne .colortop { background-color:#ff0000!important; }
.c-GroupTwo .colortop { background-color:#00ff00!important; }
.c-GroupThree .colortop { background-color:#0000ff!important; }
And... honestly, I'm not sure if that will work if your group's name has a space in it............. sweats
Actually, I don't think it would.
options
User Group Colors as Template Accents written May 5, 2019 10:25:07 GMT
3,084written posts
Kitten4uearned bits
offlinecurrently
Kitten4u
Part of the Furniture
Kitten4u Avatar
[nospaces]

[attr="class","infoBG"]
[attr="class","infoBG2"]
[attr="class","infoBack"]
[attr="class","infoTitle"][attr="class","fa fa-star-o"] threadarchived
[attr="class","infoDiv"]

[attr="class","infoBody"]

To keep the forum clean and so people know that all threads in certain areas are current and that the OP is likely to still have interest, we archive threads that haven't gotten posts for 2 weeks. This thread is being archived for that reason. If you would like this thread reopened, contact a staff member.