XF 2.0 Using Color Property for background color behind background image

Vilandra

Active member
Hi :)

In XF1, I used the color property as the background color of a background image within a div tag like this:

Code:
style="background: @dimmedTextColor url('http://path to image');"

And in XF2 I'm trying to do the same thing, but I'm having trouble using the color property. It will let me use a hex code, however.

This works:

Code:
style="height: 180px; background: #000000 url('http://path to image') no-repeat top right;"

This doesn't:

Code:
style="height: 180px; background: @xf-paletteColor5 url('http://path to image') no-repeat top right;"

Can anyone help? The correct background color is actually set in the style properties, but that is not the one that is displayed.

Thanks!

:)
 
Try with this:
Code:
style="height: 180px; background: {{ property('paletteColor5') }} url('http://path to image') no-repeat top right;"
 
You probably already know this but just in case I wanted to add that you need to make sure it's a .png image for the background as .jpg doesn't support transparency. Just wanted to add that in just in case you didn't know.
 
Top Bottom