Cart drawer theme issue

Shopify Discussion

Topic summary

A user is experiencing styling inconsistencies in their Shopify cart drawer compared to their product page. Specifically:

Issues identified:

  • The cart popup’s “View Cart” button should display white text on a black background (currently not matching)
  • The “Buy Now” button text is invisible and needs to be black

Solution provided:

First attempt adjusting button styles directly in the Cart Drawer settings within the theme editor.

If that doesn’t work, add custom CSS to theme.css or base.css:

.cart-drawer .view-cart-button {
  background-color: black !important;
  color: white !important;
}
.cart-drawer .buy-now-button {
  color: black !important;
}

A screenshot was shared illustrating the current problematic appearance. The helper advised taking a backup before implementing changes.

Status: Solution proposed, awaiting implementation/confirmation.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

URL: https://kashco-interiors.myshopify.com/

password: kashco

How can I fix my cart drawer to be same please as my product page ?

  1. The cart popup should have "view cart’ in white text with black background
  2. Buy now text is not visible (should be black)
2

Please view below what is happening thanks.

Screenshot 2025-03-06 150541.png
Screenshot 2025-03-06 150541.png880×762 68.7 KB

3

Hi

Hope this will help

At Cart Drawer Settings - Inside the theme editor, click on your Cart Drawer and look for button styles and adjust Button Styles

If not able to do that, then below css example can help (At theme.css or base.css)

/* Fix View Cart Button */
.cart-drawer .view-cart-button {
  background-color: black !important;
  color: white !important;
}

/* Fix Buy Now Button */
.cart-drawer .buy-now-button {
  color: black !important;
}

and save.

Kindly take a backup before doing any changes.

1 Like