XF 2.3 Change row color of thread with certain prefix

[beerForo]

I'd like to change the row color of a thread with a certain prefix. An add-on does it for stickies, same idea but for a prefix id. Thanks for any help!

 

[beerForo]

PS. This is for
What's New
New Posts
Forum View
and other lists.

 

[beerForo]

Anyone know how this would be done?

 

[Jeremy P]

The rows have a class of .is-prefix{id} so you can use that to target them for whatever CSS you want.

 

[beerForo]

Oh cool! Could you provide an example, not even sure how to target a row. Thank you!

 

[Jeremy P]

.structItem.structItem--thread.is-prefix1
{
    background-color: yellow;
}

 

[beerForo]

Sweet! It works! Can I ask how to target dark and light modes or is that too much to ask?

 

[Jeremy P]

The same technique described here applies:

XF 2.3 Post in thread 'Custom prefixes'

Jul 1, 2024

You'll typically want to use the .m-colorScheme mixin to target color schemes (light/dark):

.some-class
{
    // normal rules (default color scheme -- light in the default style)

    .m-colorScheme({{ $xf.style.getAlternateStyleType() }},
    {
        // alternate rules (alternate color scheme -- dark in the default style)
    });
}

However you can target specific variations if you want:

.some-class
{
    // normal rules (system or implicit default variation)

    :root[data-variation="alternate"] &
    {
        // alternate rules (explicit alternate variation -- will...

• Jeremy P

• 
• 

 

[beerForo]

Brilliant! I'm using it with @Siropu's Ads Manger for promo threads that have a dedicated prefix, now they are highlighted!

Not sure I am coding it right but it works for light and dark.

.structItem.structItem--thread.is-prefixA
{
    background-color: #AAAAAA;
}
.m-colorScheme(dark,
    {
    .structItem.structItem--thread.is-prefixA
    {
    background-color: #BBBBBB;
    }
    }
);