• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Style conditional

Ryan Kent

Well-known member
#1
I'd like to be able to selectively modify CSS for a style without having to modify the EXTRA.css within that style. I know that may sound strange. I use the Flexile style for my site. It is the parent, and several color choices are the child styles. I only have updates within the parent style. There are zero template edits, including EXTRA.css within the children. If possible, I'd like to keep it that way.

I am trying to create a conditional based on style. I think I am close but it is not working. Does anyone happen to know the correct conditional for style? The best I could come up with is:

Code:
/* Fixed issue in Flexile Brown style where links in messages are difficult to distinguish */
<xen:if is="{$style.style_id}==14">
.messageText a:link {
font-weight: bold; !important;
}
</xen:if>
 

Jake Bunce

XenForo moderator
Staff member
#4
Oh is that in one of the CSS templates? Yeah that won't work. The $visitor record isn't available to the CSS templates in my testing.

I don't have a solution for you. I would just edit the templates in the child styles.
 

Vilandra

Active member
#6
I'm still completely lost with how to make alterations to the XF templates, so I don't pretend to know what I'm talking about here. But is it possible to put the conditional in the template to choose a separate CSS class element for each style? So your extra.css would have:

.messageText1
a:link { font-weight: bold; !important; }

.messageText2
a:link { font-weight: italic; !important; }

one for each style?
 

Brogan

XenForo moderator
Staff member
#7
If you add the code to EXTRA.css in each style then it will work exactly like that.

Conditionals aren't required.