Change "BUY NOW" button size

Solved
Highlighted
New Member
5 0 0

I am using the "Debut" Theme... I would like to change the size fo the button label in a section I have added. I am using it as a "BUY NOW" button. Again I want to increase the size of the button (looking like its 150 x 60 px now). Also most likely leads to the change of the text within the button as well so it is more prominent.

 

I have looked at Assets>Theme.scss.liquid but have not found where this resides to edit. 

 

I appreciate any help/direction on where to look to accomplish this task.

 

Thanks... Doug

0 Likes
Navigator
338 37 37

@dsandstedt wrote:

I am using the "Debut" Theme... I would like to change the size fo the button label in a section I have added. I am using it as a "BUY NOW" button. Again I want to increase the size of the button (looking like its 150 x 60 px now). Also most likely leads to the change of the text within the button as well so it is more prominent.

 

I have looked at Assets>Theme.scss.liquid but have not found where this resides to edit. 

 

I appreciate any help/direction on where to look to accomplish this task.

 

Thanks... Doug


can you share your website url? let me check css

you are welcome to contact / donate small amount to me.
My email - suyash.patankar@gmail.com

paypal.me/suyashpatankar
0 Likes
New Member
5 0 0
Sure... Our site is
orenda-international-llc.myshopify.com
0 Likes
Navigator
338 37 37

add the following css to theme.scss file, it will change the width of the but now button on the homepage slider

 

.hero__inner .hero__btn{width: 150px;}
 
you can change width by altering the number 150 to whatever you want, add this and we check
you are welcome to contact / donate small amount to me.
My email - suyash.patankar@gmail.com

paypal.me/suyashpatankar
0 Likes
New Member
5 0 0
Ok... After adding I changed to this to include the ability to height as
well.

.hero__inner .hero__btn{width: 200px; height: 50px}

My question now is how do I increase the font size of the text within this
button? And ability to center the text within the button?

I appreciate any help I can get with this as well.

Thanks... Doug

0 Likes
Navigator
338 37 37

@dsandstedt wrote:
Ok... After adding I changed to this to include the ability to height as
well.

.hero__inner .hero__btn{width: 200px; height: 50px}

My question now is how do I increase the font size of the text within this
button? And ability to center the text within the button?

I appreciate any help I can get with this as well.

Thanks... Doug


in this particular case remove old css to add this

 

.hero__inner .hero__btn{width: 200px; height: 50px; padding-top: 14px;}

you are welcome to contact / donate small amount to me.
My email - suyash.patankar@gmail.com

paypal.me/suyashpatankar
0 Likes
New Member
5 0 0
That worked great thank you... Am I able to increase the TEXT's font size
as well?

My Best... Doug
0 Likes

Success.

Navigator
338 37 37

@dsandstedt wrote:
That worked great thank you... Am I able to increase the TEXT's font size
as well?

My Best... Doug

add this after above 3 lines and adjust as per the need

 

font-size: 20px;

you are welcome to contact / donate small amount to me.
My email - suyash.patankar@gmail.com

paypal.me/suyashpatankar
1 Like
New Member
5 0 0

Thank you... looking great.

 

Doug

0 Likes