XF 1.5 Toggling CSS elements through user fields?

[Satix]

Hi! I read through this guide (https://xenforo.com/community/resources/using-custom-user-fields-to-customise-the-layout.4015/) and was wondering how I would go about using this to toggle CSS elements, or if it's even possible.

For example, how would I go about using this to do something like this:
User field: Add shadow to usernames
Normal username view: http://i.imgur.com/aG4i49V.png
Username view after the user field is checked to use shadows: http://i.imgur.com/AKQC1dq.png

Would that require custom development, or could I do it through the method in the guide?

Thanks for your time! Let me know if this doesn't make sense and I'll try to explain it better.

https://lakevalor.net

 

[Satix]

I've gathered that, to do this, I'll need to use:
<xen:if is="{$visitor.customFields.glow}">CSS for the glows</xen:if>

But I can't figure out which template I need to place this in, or what the proper way to correlate the usergroups to the new styling (if this option is enabled) is.

I messed around with username_styles.css but couldn't get it working. Can anyone help with this, please?

 

[Dalton Prock]

Maybe the EXTRA.css template? Just a suggestion honesty.

 

[DL6]

I've gathered that, to do this, I'll need to use:
<xen:if is="{$visitor.customFields.glow}">CSS for the glows</xen:if>

But I can't figure out which template I need to place this in, or what the proper way to correlate the usergroups to the new styling (if this option is enabled) is.

I messed around with username_styles.css but couldn't get it working. Can anyone help with this, please?

Try with PAGE_CONTAINER template and add:
<xen:if is="{$visitor.customFields.glow}"><style>CSS for the glows</style></xen:if>
or create a new css template and add in PAGE_CONTAINER:
<xen:if is="{$visitor.customFields.glow}"><xen:require css="template_with_the_CSS_for_the_glows.css" /></xen:if>

 

[Satix]

Try with PAGE_CONTAINER template and add:
<xen:if is="{$visitor.customFields.glow}"><style>CSS for the glows</style></xen:if>
or create a new css template and add in PAGE_CONTAINER:
<xen:if is="{$visitor.customFields.glow}"><xen:require css="template_with_the_CSS_for_the_glows.css" /></xen:if>

The first suggestion worked! Thank you so much.