Change Text Color on Selected Variant Pills Dawn Theme

See screenshot below. The variant that is selected has white text. I need it to be black. This option doesn’t seem to be available in the theme options. Any ideas?

My site is: cwdesignshop.com

To change the color of the text do the following steps:

1- Go to your store code and look for a file called: “base.css”.

2- Add the following code at the end of the file:

.js.product-form__input input[type=radio]:checked+label {
    background-color: #33ECFF;
    color: black;
}

3- Customize the color of the background and the color of the text to your liking by changing the default values.

I hope it helped you!

Hi @Craigdwill

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css

.product-form__input input[type=radio]:checked+label {
    color: #000 !important;
}

Hope you find my answer helpful!

Best regards,

Richard | PageFly

That had no effect. Thanks anyway.

That did not work. Thanks anyway.

No suggestions have worked yet. The text remains white on the selected variant pill. The text is fine on the others (black - as I want it), but the variant pill that is selected still has white text.

Thanks

Without any problem!

If the added code did not work, we will do the following:

1- Go to the base.css file like we did before.
2- Instead of adding the code to change the color of the text, let’s remove the code responsible for making it look white.
3- Go to line number 10 and delete this code:

--color-background: var(--color-base-background-1);

6.PNG

4- The code Before vs After:

5- The color of the text will now have the color you want.

I hope you can make the change successfully!

It was line 5 for me, but it worked great. Thank you!!