Change button hover colours and delete border

Store Design
1

Hi! I am having trouble with the button design:

I want all my buttons to be this colour: #BB7C49, and the text to be this: #FFFCF3

and on hover I want the opposite, thus, the buttons to be this colour: #FFFCF3 and the text to be this: #BB7C49

What do I need to add to the code to resolve this? I am using the Dawn theme. Thanks for any help!

1 Like
2

@sirensiren

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

3

Hi @Sirensiren

This is PageFly - Advanced Page Builder. I would love to give you some recommendations

-Go to Online Store->Theme->Edit code

-Asset-> base.css paste the below code at the bottom of the file.

.button{

background:#BB7C49 !important;

color:#FFFCF3 !important

}

.button:hover{

background:#FFFCF3 !important;

color: #BB7C49 !important

}

Best Regards;

PageFly

4

Hi! Thank you so much for your help! It kinda solved the problem, but a weird border appeared on both buttons of my homepage, the one on hover and the other not. I am attaching a video. Any idea why this is happening?

5

you can add more

.button:before,.button:after{display:none !important}

6

Hello! Is there a way to keep the border but set to a custom colour?