How to make the cart button and Quantity increase / Decrease Buttons a new color in Flow Theme

How to make the cart button and Quantity increase / Decrease Buttons a new color in Flow Theme

lemonpi
Shopify Partner
2 0 0

So far I have tried the following:

1. Make Base.CSS File 

2. Connect to Theme.liquid with {{ 'base.css' | asset_url | stylesheet_tag }}
2. added to Base.Css

.quantity__button:first-child {
color: #000000;
}
.quantity__button:last-child {
color: #000000;
}

.quantity-selector__button {
color: #000000 !important;
background-color: #FFFFFF !important;
border-color: #000000 !important;
}
.template-specific-class {
}

 

This is all in a draft so I am not changing the published code currently. Someone else was in the code and I don;t know what they did so I am just trying to fix this one thing for my friend.  Any help would be appreciated! Photos attached:

 

1. Up/Down arrows white/Invisible. Sometimes the page will glitch and they will show black for half a second... weird. 

2. Cart is not showing at all. I have not yet even tackled this issue. Something is overriding the code. I don't want to mess up the custom code... but I may just have to rebuild it from scratch if I can't figure out why this is happening. 

 

Website is somalab.us

 

Thanks all for your feedback!

 

 2.jpg1.jpg

Reply 1 (1)

BSSCommerce-TC
Shopify Partner
225 49 51

Hi @lemonpi ,

 

Let try it:

.fa.fa-minus , .fa.fa-plus {
   display: none !important;
}

.js-qty__adjust--plus , .js-qty__adjust--minus {
    background-color: black !important;
}

.js-qty__adjust--plus > span , .js-qty__adjust--minus > span {
    display: flex !important;
    color: white !important;
}

 

And this is a final result , which you want. 

BSSCommerceTC_0-1720923236994.png

 

If our suggestions are useful, please let us know by giving it a like, marking it as a solution.


MIDA: Heatmap, Record & Replay |BLOOP Referral Program, Reward |

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency