Add to cart button change - Dawn theme

[MaBa]

Hi, I would like to change the size of the add to cart button and to align it to the left.  How can I do it?

[PageFly-Richard · Accepted solution]

Hi @MaBa 

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can try with this code.

Follow this:

Go to Online Store->Theme->Edit code->base.css ->paste bellow code in bottom of file

.quick-add {

    width: 100px !important;

}

Hope that my solution works for you.

Best regards,

Richard | PageFly

[PageFly-Richard · Accepted solution]

Try this code:
.quick-add__submit {
background: gold;
}

[PageFly-Richard]

Hi @MaBa 

Can you share with me the page url

[MaBa]

https://571d01.myshopify.com/

[PageFly-Richard · Accepted solution]

Hi @MaBa 

I’m Richard Nguyen from PageFly- Free Landing Page Builder

You can try with this code.

Follow this:

Go to Online Store->Theme->Edit code->base.css ->paste bellow code in bottom of file

.quick-add {

    width: 100px !important;

}

Hope that my solution works for you.

Best regards,

Richard | PageFly

[MaBa]

Hi again, thx for you help. I tried to change the color of of the button in this way:

.quick-add {
width: 130px !important;
color: gold !important;
}

but it didnt work. Any suggestion?

[PageFly-Richard · Accepted solution]

Try this code:
.quick-add__submit {
background: gold;
}

[MaBa]

I have another question...what if I want to center the button? 

Thanks in advance!

[PageFly-Richard]

@MaBa 

Please share the password page, now I can't login to your site

[MaBa]

siahaw

[PageFly-Richard · Accepted solution]

@MaBa You can try this code:

.card__content {
justify-content: center !important;
}

[MaBa]

You are a star!

[PageFly-Richard]

I'm glad to help you @MaBa 😉

[MaBa]

i have another ticket open but I got no answer, would u be able to help there as well?

https://community.shopify.com/c/shopify-discussions/customise-image-and-text/m-p/1777512#M318500

[hussain-ahamd]

Hi MaBa,

If you meant the product page, you can try the following code.

product-form.product-form {
max-width: 142px;
}

Please go to Online Store->Theme->Edit code->base.css -> and paste it on the bottom.