Home › Forums › WoodMart support forum › Add a cross to Swatches instead of fading

Add a cross to Swatches instead of fading

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • January 15, 2021 at 8:47 pm #258840

    oscaregc
    Participant

    Is it possible to add a line or a cross to the swatches if they are out stock or de-activated. Now they fade a bit, but i want to emphasize that.

    January 16, 2021 at 11:12 am #258947

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS. And see if this works for you.

    .swatch-on-single.swatch-disabled {
    opacity: 1;
}

.swatch-on-single.swatch-disabled:before, .swatch-on-single.swatch-disabled:after {
    position: absolute;
    content: '';
    background: black;
    display: block;
    width: 100%;
    height: 5px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    //center the X vertically and horizontally:
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.swatch-on-single.swatch-disabled:after {
    -webkit-transform: rotate(45deg);    
    transform: rotate(45deg);
}

    Regards.
    Xtemos Studios.

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)