Changing Background Color on Shopping Cart Page to White in Version 7.0 Pacific Family

Site URL: https://www.thehouseofredvelvet.com/cart

I have tried many codes, and I still cannot change the background color of the cart to white. Any ideas? Thank you.

Also, curious if I can change the look to the little rectangular " Cart button" whether its the icon or colors. Would prefer it white if it can't completely change.

#1. Add to Design > Custom CSS

body#cart #page, body#cart #siteWrapper {
    background-color: red;
}

#2. Continue shopping button or checkout button?

12 hours ago, tuanphan said:

#1. Add to Design > Custom CSS

body#cart #page, body#cart #siteWrapper {
    background-color: red;
}

#2. Continue shopping button or checkout button?

Thank you so much! I made it white, but can I add something for the text? Because that was white, and needs to be black.

2. I mean the little cart button that appears in the bottom corner after you add something to the cart. So it takes you to the cart page and then to checkout. 

On 9/1/2022 at 4:52 AM, thehouseofredvelvet said:

Thank you so much! I made it white, but can I add something for the text? Because that was white, and needs to be black.

2. I mean the little cart button that appears in the bottom corner after you add something to the cart. So it takes you to the cart page and then to checkout. 

#1. Do you still need help or fixed?

#2. Use this code

button.cart-checkout-button {
    color: green !important;
    border-color: green !important;
    background-color: #f1f2f3 !important;
}

On 9/3/2022 at 2:31 AM, tuanphan said:

#1. Do you still need help or fixed?

#2. Use this code

button.cart-checkout-button {
    color: green !important;
    border-color: green !important;
    background-color: #f1f2f3 !important;
}

 

Hi, Unfortunately the text is still white so you can't see it. See here: https://www.thehouseofredvelvet.com/cart

You may just have to add a randome item to see that you will only see the photo of the item but not it's description. Thank you for your help. Almost there!

.cart-row, .cart-subtotal {
    color: black;
}

Try the code above. 

17 hours ago, izzyswebsite said:

.cart-row, .cart-subtotal {
    color: black;
}

Try the code above. 

Thank you so much. It got some of it, but not all of it. -the title of the item and "Shopping Cart" is missing. See screenshots.

.cart-row, .cart-subtotal, .cart-title, .cart-row-title{

color: black;

}

This should do it. Sorry about that.

3 hours ago, izzyswebsite said:

 

.cart-row, .cart-subtotal, .cart-title, .cart-row-title{

color: black;

}

This should do it. Sorry about that.

All ok! It got the Shopping Cart, but not the title of the item. 

Maybe add !important after black. 

16 hours ago, izzyswebsite said:

Maybe add !important after black. 

 

 

 

 

That did it. Thank you!

Do you know the answer to my other question above? When you put something in the cart, it makes a rectangular cart button that sits at the bottom of the page on mobile or at top on desktop (as pictured). It doesn't look that great to me. Do you know how to change it to a cart icon, or maybe change the style/colors of the button?

Thank you. 

On 9/7/2022 at 4:24 AM, thehouseofredvelvet said:

That did it. Thank you!

Do you know the answer to my other question above? When you put something in the cart, it makes a rectangular cart button that sits at the bottom of the page on mobile or at top on desktop (as pictured). It doesn't look that great to me. Do you know how to change it to a cart icon, or maybe change the style/colors of the button?

 

Thank you. 

You mean Checkout Button? Change its style?

7 hours ago, tuanphan said:

You mean Checkout Button? Change its style?

No. I mean the little tan button that says "Cart" in the upper right hand corner in that photo.

13 hours ago, thehouseofredvelvet said:

No. I mean the little tan button that says "Cart" in the upper right hand corner in that photo.

You can add this to Design > Custom CSS

/* cart */
a.custom-cart-button {
    background-color: red;
    color: violet !important;
}

12 hours ago, tuanphan said:

You can add this to Design > Custom CSS

/* cart */
a.custom-cart-button {
    background-color: red;
    color: violet !important;
}

 

Thank you so much. ❤️