Change color of Add to card outline and text in Venture

Solved
Highlighted
Tourist
12 1 3

Ughhhh I'm struggling to just change two elements on my product pages. the Add to cart button. I'm trying to make the text and outline to be black and then make the "More payments options" be black text. Any help would be much appreciated. I like having the yellow background button so I can't just change it the color config. Also struggling with when the button highlight. I want it to go to a darker shade of gry. 

 

 

when more payment options shows upwhen more payment options shows up

0 Likes
This will have to be done via the code editor. Do you feel comfortable doing that?
Developer for Crafty Party Box
0 Likes
Highlighted
Tourist
12 1 3

Yeah, I'm pretty comfortable with it. Every time I mess around with it I always just ended changing the color of the button itself and not the outline or text. 

0 Likes
Highlighted
What are you trying now?
Developer for Crafty Party Box
0 Likes
Highlighted
Tourist
12 1 3

To the theme.css.liquid

 

#AddToCart-product-template{
  background-color: rgb(0,0,0);
}
0 Likes
Highlighted

Success.

You’ll have to target the other buttons and use ‘border: black’ and ‘colour: black’ to change the border colour and text colour. For hover states you use the selector followed by ‘:hover’ and then you can set the border colour.

Not at my laptop right now so this is the best I can do. If you still need help when I can back I can get to it I can help more. Hopefully the above is enough 🙂
Developer for Crafty Party Box
1 Like
Highlighted

Success.

Tourist
12 1 3

Alright, so this is what I came up with and I'm pretty happy with it. Thanks for you help mate! 

 

#AddToCart-product-template{
  border-top-color: rgb(0,0,0);
  border-bottom-color: rgb(0,0,0);
  border-left-color: rgb(0,0,0);
  border-right-color: rgb(0,0,0);
}

#AddToCartText-product-template{
	color: rgb(0,0,0);
}

.shopify-payment-button{
  .shopify-payment-button__more-options{
 	color:rgb(0,0,0);   
  }
}
0 Likes
Highlighted
Great! Glad I could help 🙂
Developer for Crafty Party Box
0 Likes