Atc button different color

[lunalucenteskin]

Hi everyone, 

we want to use a color on the ATC button to make it a little bit more outstanding but when we do that it also automatically changes the colors of the product image navigation and the "move upwards" button, which we just want to showcase in a neutral color. Can someone help

URL is www.lunalucente.com

[Made4uo-Ribe]

Hi @lunalucenteskin 

Check this one. 

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

/* scroll-up button */
button#scroll-to-top-button {
    background: #d2c9b8;;
    border-color: white;
}
/* Next-previous image buttons */
.m-product-media--slider .swiper-button-control {
    background: #d2c9b8;
    border-color: #d2c9b8;
}

And Save.

Result:

Note: You can change the color you like. I add some comment so its easy to identify which buttons. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[lunalucenteskin]

Thanks a lot, 

However it only works on the scroll up button and not on the image slider.

[Made4uo-Ribe]

Try to add !important. 

Check this code again.

button#scroll-to-top-button, .m-product-media--slider .swiper-button-control {
    background: #d2c9b8 !important;
    border-color: white !important;
}

.m-button--icon:hover {
    box-shadow: none;
}

And Save. 

Note: I  also change the border color when it hover. the default color is black. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!