some buttom are rounded but some are not

KhaledAlshaikh
Tourist
3 0 2

I used this article to round the corners on the buttons but some are not rounded 

KhaledAlshaikh_0-1626173780612.png

I used:

.btn{border-radius: 30px;}

to round the corners on my buttons but it only rounded out "Check out" but not "Update Cart"

in the article I found they said to use:

.shopify-payment-button__button{    border-radius: 30px;}

  But that didn't fix the issue.

dmwwebartisan
Shopify Partner
7353 1739 2324

@KhaledAlshaikh 

Please share your store URL.

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
Pallavi
Shopify Expert
2235 369 484

Hello There,

Please share your store URL and Password.
So that I will check and let you know the exact solution here.

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
dmwwebartisan
Shopify Partner
7353 1739 2324

@KhaledAlshaikh 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

 

.shopify-payment-button__button{border-radius: 5px !important;}
.btn{border-radius: 5px !important;}

 

Hope this works,

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
Pallavi
Shopify Expert
2235 369 484

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >timber.scss.css and paste this at the bottom of the file:

button.btn--secondary.update-cart {
border-radius: 5px!important;
margin-top: 5%!important;
}
button.btn.cart__checkout.rale-checkout--invisible {
margin-top: 5%!important;
}
Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
0 Likes
KhaledAlshaikh
Tourist
3 0 2

Awesome it worked!

but another issue arises,

KhaledAlshaikh_0-1626174814062.png

 it looks fine here but when I press the agree to terms and conditions button this happens:

KhaledAlshaikh_1-1626174860009.png

The checkout button rises a bit, it didn't do that before.

 

0 Likes