Magnifier box opacity

[agallagherParticipant]

Hi,

I am trying to set the opacity of the box that contains the search icon so that it becomes transparent. However, I am unable to make this work.

When I go into ‘Theme Options’ and click on background in the preview box in the bottom right, it allows me to specify a hex code, but does not allow me to specify an opacity. It also does not allow me to use an rgba command instead.

I have also tried using custom CSS to make the change, but I am unable to find the class where the white background colour is being set, and every command I have tried has not been able to override this.

Is there a setting somewhere in the backend that I am missing that allows me to set the opacity of the icon box background?

If not, are you able to provide the code that I need to override this default colour?

Thanks in advance

[Ernest MarcinkoKeymaster]

Hi!

I believe the best possible solution in this case is to force a transparent background by custom CSS. To make the icon background transparent use this:

.promagnifier {
    background: transparent !important;
}

Also, note, that transparent in this case means, that the underlying layer gets displayed. If the color of the main container is not transparent, then it will still be colorized. If you wish, you can make that transparent as well:

.probox {
    background: transparent !important;
}

I hope this helps!

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[Author]

Posts