XF 2.2 Alternating color for each post/thread..

[jayhawku]

Is it possible to alternate the colors between each post so there is a little bit of differentiation? Less necessary would be to alternate colors between threads on the main forum view. Here is an example of the posts:



This has been asked a handful of times at least in the past but trying to implement the previous code attempts completely breaks my site. Whether I'm an idiot or the newer version doesn't work with older code. Thanks for any help!

 

[Mr Lucky]

Add to extra.less template


For messages

.block--messages .message:nth-child(even) {background-color: #add8e6!important}
.block--messages .message:nth-child(odd) {background-color: #ffffe0!important}

For thread list:

.structItem--thread:nth-child(even) {background-color:#add8e6!important}
.structItem--thread:nth-child(odd) {background-color: #ffffe0!important}

May or may not need the !important

This does work on current version default theme

 

[jayhawku]

Awesome! Looks to work great. Now I just need to find the color codes after some tedious testing!

Thanks again.

 

[Mr Lucky]

Awesome! Looks to work great. Now I just need to find the color codes after some tedious testing!

Thanks again.

You're welcome. Did you try it without the !important? - if it works without then have it like that.

It can also work well to use the xenforo color variables

So for example instead of background-color: #add8e6 you'd put background-color:@xf-paletteColor1

See style properties > basic colors



So e.g. when you change that color in style properties it changes every instance of that color on the site.

 

[jayhawku]

You're welcome. Did you try it without the !important? - if it works without then have it like that.

It can also work well to use the xenforo color variables

So for example instead of background-color: #add8e6 you'd put background-color:@xf-paletteColor1

See style properties > basic colors

View attachment 296164

So e.g. when you change that color in style properties it changes every instance of that color on the site.

Will definite try the XF color variables thing. Out walking my dog now.

As a novice, why not leave the important in if it worked? Sorry, just trying to learn.

Thanks again for all the help!

 

[Mr Lucky]

Will definite try the XF color variables thing. Out walking my dog now.

As a novice, why not leave the important in if it worked? Sorry, just trying to learn.

The !important is just there to override in case there is something doing the same but taking priority. If there isn't it will work without.

It will make very little difference just that I think it's good practice (cleaner code) to avoid having to use it.