XF 2.1 Possible to add coloured outlines to avatars according to certain costumed user field?

[gogo]

It could be location, gender, etc.



It should be applicable to avatar of any shapes.

 

[sbj]

Not without custom development.

 

[gogo]

Not without custom development.

I think the outline can be added with css?

How to Add Border to Image in CSS

Learn about how to add border to an image, how to add styling to it and how to specify each corner and have circle borders. Practice all with examples.

www.w3docs.com

But I don't know how to integrate the conditions and effect together...

 

[Masetrix]

I think the outline can be added with css?

How to Add Border to Image in CSS

Learn about how to add border to an image, how to add styling to it and how to specify each corner and have circle borders. Practice all with examples.

www.w3docs.com

But I don't know how to integrate the conditions and effect together...

a begining:
in extra.less add:

 .avatar {border:2px solid red;}

 

[gogo]

a begining:
in extra.less add:

 .avatar {border:2px solid red;}

So simple. And the outline is there!

THANKS!



Next thing would be how the colour of the border changes according to the value of different custom user field.

 

[gogo]

Is there anything like

<XF: is=custom_user_field[gender]==male, avatar.border.color=blue else = red

(Sorry I know nothing about coding, but I did read some codings here)

 

[Vercingetorix]

a begining:
in extra.less add:

 .avatar {border:2px solid red;}

Works perfectly! Thank you!