Gradient color background

[compania123]

Hi there,
on our project test.palimeovocie.sk we addedd this code to our element css:
$el {
–leftColor: #fd746c;
–rightColor: #292423;
background-image:
linear-gradient(
90deg,
var(–leftColor) 0%,
var(–leftColor) 50%,
var(–rightColor) 50%,
var(–rightColor) 50%
);
}
Unfortunetlly it doesnt work. What we wanted to do is to put a gradient color over image in background.

Thanks
Michael

[tristup]

Hi Michael,

Thanks for reaching out.
Although the custom CSS issue is not in the scope of Theme Support, still I would like to guide you as it might be an issue with placing the code with the correct selector or correct place.

I have investigated the code in your page and found it has been directly implemented to the section, but if you want to implement it to the color part of the section you need to add x-bg-layer-upper-color or x-bg-layer-lower-color selector just after the $el, and it should look like the following.

$el .x-bg-layer-upper-color
{
    /** your code is here **/
}

or

 $el .x-bg-layer-lower-color
{
    /** your code is here **/
}

Hope it helps.
Thanks

[compania123]

Thanks a lot. It helps.

[tristup]

Hi Michael,

Glad that we are able to help you.

Thanks