cancel
Showing results for 
Search instead for 
Did you mean: 

CSS LESS variable not overriding

CSS LESS variable not overriding

Although many of the variables I have updated in my <theme>/web/css/source/_extend.less file work correctly I have now noticed that I can't override one very specific variable.

 

I noticed that the active dots on the fotorama mobile version of the product gallery are still orange, and not black as per my defined color, and I dont understand why. I've checked the original gallery.less file and the dot color is defined as @active__color.

 

In my _extend.less file this @active__color is defined as black. I referred to the reference page here https://github.com/magento/magento2/blob/2.3/lib/web/css/source/lib/variables/_colors.less 

and see that the orange color is defined as 

@theme__color__secondary: @color-orange-red1;

and then
@active__color: @theme__color__secondary;

so I changed both @active__color and @theme__color__secondary to black, but it still comes up as orange.

 

Where am I going wrong?

1 REPLY 1

Re: CSS LESS variable not overriding

If your query is not solved we can offer 30 minutes call with our experts to solve your problem. We would not charge anything for our consultation.