What's your biggest current challenge? Have your say in Community Polls along the right column.

Re: Debut Theme - Button ADD TO CART:Where can I change the hover text color and remove the black bo

Solved

Debut Theme - Button ADD TO CART:Where can I change the hover text color and remove the black border

chumani
Explorer
57 2 16

Hi all,

where can I change für Button "Add to Cart" the hover text color to #19100c

and remove the black border (but only for add to cart button), and ONLY when I make hover, the borders dissapear (don't know if this is possible).

 

Same for READ MORE Button, that when I hover the borde dissapears...

Accepted Solution (1)

Dan-From-Ryviu
Shopify Partner
10324 2046 2118

This is an accepted solution.

Hi @chumani 

Please use this code 

.product-single__meta .btn--secondary-accent:not([disabled]):hover, .product-single__meta .btn--secondary-accent:focus {
    color: #19100c !important;
    border: unset !important;
}

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Replies 7 (7)

oscprofessional
Shopify Partner
16116 2410 3126

Hello @chumani 

Please provide your store URL, so I can review it and provide a solution.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free
chumani
Explorer
57 2 16

Dan-From-Ryviu
Shopify Partner
10324 2046 2118

This is an accepted solution.

Hi @chumani 

Please use this code 

.product-single__meta .btn--secondary-accent:not([disabled]):hover, .product-single__meta .btn--secondary-accent:focus {
    color: #19100c !important;
    border: unset !important;
}

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

chumani
Explorer
57 2 16

Thank you so much @Dan-From-Ryviu 🙏 It works perfect

Dan-From-Ryviu
Shopify Partner
10324 2046 2118

You are very welcome, @chumani 

- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

oscprofessional
Shopify Partner
16116 2410 3126

Hello @chumani 

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->theme.css>Add this code at the bottom.

button.btn.product-form__cart-submit.btn--secondary-accent:hover {
    color: #19100c !important;
}
button.btn.product-form__cart-submit.btn--secondary-accent {
    border: none;
}

 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free

PageFly-Richard
Shopify Partner
4808 1088 1758

Hi @chumani 

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Theme.css

.product-single__meta .btn--secondary-accent:not([disabled]):hover, .product-single__meta .btn--secondary-accent:focus {
    color: #19100c !important;
    border: unset !important;
}

Hope you find my answer helpful!
Best regards,
Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 


All features are available from Free plan. Live Chat Support is available 24/7.