Why are all the buttons on my website turning completely black?

[JonathanDun]

Hi,

I have a problem. All the buttons on my website turned completely black. No text is showing.

https://jonathandunsky.com/en-il/products/ten-years-gone

This happened after I added this code:
.product-form__submit {
background: #000000 !important;
color: #ffffff !important;
}

To assets/base.css

Even when I removed the code, the buttons remain black. How can I fix this?

[suyash1]

@JonathanDun - it looks ok, which buttons are giving the issues?

[Moeed]

Hey @JonathanDun

Follow these Steps:

1. Go to Online Store
2. Edit Code
3. Find theme.liquid file
4. Add the following code in the bottom of the file above tag

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[websensepro]

Hi, @JonathanDun .

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

Go to the online store theme and go to base.css file paste the code mentiond below.

a.button.button--primary {
    color: white;
}

.collection__view-all a:not(.link) {
    color: white;
}

.product-form__submit {
    background: #000000;
    color: white;
}

Result:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

[JonathanDun]

I don’t see it like that. Where you see the Buy With PayPal button, I see a full black rectangle. Before I saw a black rectangle with white Buy Now text. I’ve never seen my website with a yellow PayPal button.

[suyash1]

@JonathanDun - it changes as per geo location and whether you have logged in or not

[JonathanDun]

The Buy Now button is still full black. I don’t see it as a yellow PayPal button.

[JonathanDun]

I’ve logged out and I still see it as a black rectangle with not visible text.

Do you have any idea how the code I added (copied in my earlier post) could have done this, and why it still does after I removed it?

[suyash1]

@JonathanDun - add this css to the very end of your base.css file and check

button.shopify-payment-button__button--unbranded{color: #fff;}

[websensepro]

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

Go to the online store theme and go to base.css file paste the code mentiond below.

.shopify-cleanslate .beR_IRWWHmzzPFJUoa9p {
    background: black !important;
    border-color: black !important;
}

.shopify-cleanslate .h7OYsWHrW5495r9beh2n span {
    color: white;
}

.shopify-cleanslate .kqsiVA9Jf8LJAbxw8Bau * {
    filter: sepia(1);
}

Result:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

[JonathanDun]

Thank you so much.

[ZestardTech]

Hello There,

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

.product-form__buttons button {
background: #ffff;
}

[suyash1]

@JonathanDun - welcome, do let me know if you need any more updates, you have my email below.