Changing button background color in Motion Theme

[roampro]

Store Link: https://roampro.store

[codewiser]

Hello @roampro

Step 1: Go to Online Store → Theme → Edit code.
Step 2: Search file theme.scss
Step 3: Paste the below code at bottom of the file → Save

.slideshow-wrapper .slideshow__slide .hero__link .animation-contents .btn {
    background: skyblue !important;
}

[roampro]

Hello Codewiser. This fixed the background issue, but I’ve just noticed that it broke some other code I had there. I had code embedded in that button so that it will extend to the right and display an arrow in front of the text. The extending function still works, but the arrow doesn’t appear anymore. Here is the other code I had for the button:

.btn,
.rte .btn,
.shopify-payment-button .shopify-payment-button__button–unbranded,
.spr-container .spr-button,
.spr-container .spr-summary-actions a {
border-radius: 100px !important;
}
.variant-input-wrap input[type=“radio”]:checked + label {
box-shadow: 0 0 0 2px #8b52ff;
background: #8b52ff;
color: #fff;
}

[codewiser]

Please remove above code which I sent on my previous reply and paste these new code.

.slideshow-wrapper .slideshow__slide .hero__link .animation-contents .btn{background-color: dodgerblue !important;}

Let me know if you need any help

[roampro]

Thanks, that solved it!