Changing Add To Cart Button on product Page

Retired Boards Appdev Merchandising

Topic summary

Issue: Color changes to the “Add to cart” and cart-notification buttons work on desktop but not on mobile after editing base.css in the Craft 12.0.0 theme.

Context: The poster added CSS to target .product-form__buttons .product-form__submit and #cart-notification-button to set background and text colors. The update behaves as intended on desktop only.

Recent activity: A helper asked for the store URL and password (if applicable) to investigate. The store URL was provided: www.thedreamoffical.com. No password was shared.

Artifacts: A CSS code snippet is central to understanding the change and where it was applied (base.css).

Status and next steps: No resolution yet. The thread is awaiting review of the live store to diagnose why mobile styles aren’t applying and to advise on adjustments so changes reflect on both desktop and mobile.

Summarized with AI on January 12. AI used: gpt-5.
1

Hi there

I’m using Craft 12.0.0 theme and i added the following code to base.css

}

.product-form__buttons .product-form__submit{

background: #0F512B !important;
color: #FFFFFF !Important;
}
#cart-notification-button {
background: #FFFFFF !important;
color: #0F512B !Important;
}

Essentially wanting to change my add to cart button colour and the button colour for my dropdown when a product has been added to cart.
This has been updated successfully and as intended.
however, the changes are only reflected when i access my store using desktop, the changes are not reflected when using mobile.

any ideas how i can update my code so that the colour changes are reflected when using both desktop and mobile?

many thanks for your time :slightly_smiling_face:

Asim

2

Hey @AsimTalim

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

Best Regards,
Moeed

3

Hey Moeed,

thanks for getting back to me.

www.thedreamoffical.com

anything else please let me know

Asim :slightly_smiling_face: