Color of some buttons when hovering
- The topic ‘Color of some buttons when hovering’ is closed to new replies.
Need help? Check out our Support site, then
Hi, thank you for such a great theme.
I would like to ask how to change the color when I move the mouse on specific color.
For example the “Add to cart” button and the “social media” button at the footer.
Thank you so much!
The blog I need help with is: (visible only to logged in users)
Hi,
Thank you for using the Appetite theme! :)
To change colors of the social links, please use this custom CSS:
/* Social links: default state */
.social-list li a {
background-color: #ffffff;
color: #000000;
border-color: #000000;
}
/* Social links: hover state */
.social-list li a:hover {
background-color: #000000;
color: #ffffff;
border-color: #ffffff;
}
Here is a quick guide on how to add a custom CSS at WordPress.com: https://wordpress.com/support/custom-design/editing-css/
—
Could you please make your site public, so I can inspect the “Add to cart” button on your site? So, I can provide you a solution on how to change colors of this button?
Kind regards,
Taras
Hi, thank you for your reply.
I’ve made my site public, please check it.
Best regards,
Jim
Hello Jim,
Thank you for making your site public.
Please use this custom CSS to change colors of the “Add to cart” button:
.wc-block-grid__product-add-to-cart.wp-block-button:not(.is-style-outline) .wp-block-button__link {
background-color: red;
color: white;
}
.wc-block-grid__product .wc-block-grid__product-add-to-cart.wp-block-button .add_to_cart_button.wp-block-button__link:hover {
background-color: white;
color: red;
}
Let me know if you have any additional questions.
Kind regards,
Taras