Re: Change Variant Pill Color - Craft Theme

How can I change the variant pill color in Craft 2.0 theme?

AHBEessentials
Excursionist
23 0 5

Can anyone tell me how to change the variant pill colors or what code I can use? I want background to be #f2f2f2 and outline and text to be black. I am using Craft 2.0 theme. 

ahbeessentials.com

 

Thank you!

Replies 11 (11)

suyash1
Shopify Partner
9974 1240 1578

@AHBEessentials - can you please share the page link where you have these variant pills?

Amazing chess game | To build shopify pages use PAGEFLY | Contact me - [email protected] , My timezone is GMT+5:30.
AHBEessentials
Excursionist
23 0 5
AHBEessentials
Excursionist
23 0 5
suyash1
Shopify Partner
9974 1240 1578

@AHBEessentials - add this css to the very end of your base.css file and check

.product-form__input input[type=radio]+label{background-color: #f2f2f2; color: #000;}
Amazing chess game | To build shopify pages use PAGEFLY | Contact me - [email protected] , My timezone is GMT+5:30.
AHBEessentials
Excursionist
23 0 5
That didn’t work
suyash1
Shopify Partner
9974 1240 1578

@AHBEessentials - where did you add it?

Amazing chess game | To build shopify pages use PAGEFLY | Contact me - [email protected] , My timezone is GMT+5:30.
AHBEessentials
Excursionist
23 0 5
Where you said to. At the bottom of base.css file.
suyash1
Shopify Partner
9974 1240 1578

not able to see it

Amazing chess game | To build shopify pages use PAGEFLY | Contact me - [email protected] , My timezone is GMT+5:30.
AHBEessentials
Excursionist
23 0 5
I did it on a copy of my theme. That code didn’t work so I erased it.

Craigdwill
Tourist
10 0 4

Has anyone solved this problem yet? I need to change the text color on a selected pill variant. All the pills are fine, but when one is selected, the text turns white, and it's hard to read.  I'd like it black. Screenshot attached and URL below. I've tried all the code on this page, but none of it has worked so far.

I'm on Dawn Theme, though.

 

Screenshot 2023-07-05 at 12.42.05 PM.png

https://cwdesignshop.com/

 

 

AHBEessentials
Excursionist
23 0 5
Nope. This code didn’t work.