Hide/Remove color swatches for products that don't come in that color.

[scoutkysek]

I updated my company's website theme which had not been done in 7 years. I've got mostly everything worked out except for one product page's variants. One of our products come in 6 sizes, but not every size comes in every color. I'm using Taiga theme, and I may reach out to them for assistance. Maybe it's an If/Then code that could solve this. I haven't been trained in coding, but I've done okay with it from YouTube tutorials and instructions on this forum. 

Is there a way to totally remove the color swatches when a certain size is selected? I.E., when I click size 25, all the swatches show (it's available in all the colors), and when I click size 150, only two swatches show (because those are the only colors that size is available in). 

    

[BiDeal-Discount]

Hi @scoutkysek 

can you share your store url & password (if applicable) ?

[Guleria]

Hello @scoutkysek ,

Yes it's possible you need to use css to hide them based on the dynamic class or attributes.

Please share the product URL so I can check.

Regards
Guleria

[scoutkysek]

https://kysek.com/products/ice-chest

[Guleria]

Use this css in reset.css or any other related css file

[data-cross-unavailable=true] .product-form__input input[type=radio].disabled+label
{ 
    display: none;
}