XF 2.0 Using Color Property for background color behind background image

[Vilandra]

Hi

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

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:

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

This doesn't:

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!

 

[DL6]

Try with this:

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

 

[Brad Padgett]

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.

 

[Vilandra]

Try with this:

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

You're a star! That worked! Thank you!

And thank you Brad for the info as well!