Link active page product

Hi,

I’ve chosen large image for variations on single page product.

The swatch selected is only show with a line on border-bottom. It’s not enough to me.

How to get a full border around the circle like in printscreen ?

Thank you

Attachments:

You must be logged in to view attached files.

Hi,

Could you please send us a link to your website where we can see this?

Kind Regards

http://www.konkombre.com/product/be-brave/

Try to add the following code snippet to the Custom CSS area in Theme Settings

.product-image-summary-wrap .swatches-select .colored-swatch:after, 
.product-image-summary-wrap .swatches-select .image-swatch:after {
    content:none;
}

.product-image-summary-wrap .swatches-select .colored-swatch, 
.product-image-summary-wrap .swatches-select .image-swatch {
      box-shadow: 0 0 0 2px #dadada;
   border: 4px solid white!important;
   -webkit-transition: all .25s ease;
   transition: all .25s ease;
}

.product-image-summary-wrap .swatches-select .colored-swatch.active-swatch, 
.product-image-summary-wrap .swatches-select .image-swatch.active-swatch,
.product-image-summary-wrap .swatches-select .colored-swatch:hover, 
.product-image-summary-wrap .swatches-select .image-swatch:hover {
    box-shadow: 0 0 0px 2px black;
}

Perfect 🙂

Thank you very much !

[Author]

Posts