Customize SHOP NOW Button in Brooklyn Theme (2020)

Solved
Highlighted
Excursionist
17 0 4

Hey, I need help customizing my "shop now" button in the Brooklyn Theme on my homepage slideshow. I'd like to put a white border and make it transparent as well, then when hovering onto it, it changes to a solid color. I've been working on this for a while and can't figure it out.

https://screenshot.click/01-10-ir1er-nzvc3.jpg 

Thanks!

1 Like
Highlighted
Tourist
10 0 0

I would like an answer as well

 

0 Likes
Highlighted
Trailblazer
192 33 58

When we can't see your website we can't help.

0 Likes
Highlighted
Tourist
10 0 0

my website is www.jewelerscolek.com

0 Likes
Highlighted
Trailblazer
192 33 58

This is an accepted solution.

my website iswww.jewelerscolek.com

You can add this at bottom of theme.scss file.

Find this file under assets of your theme.

a.btn.hero__cta {
    background: transparent !important;
    border: 5px solid #fff;
    color: #fff !important;
    font-size: 16px !important;
    padding: 8px 12px !important;
}
a.btn.hero__cta:hover {
    background:#fff !important;
    color:red !important;
}
2 Likes
Highlighted
Tourist
10 0 0

Can you create a code that allows me to lower the shop now button

0 Likes
Highlighted
Tourist
10 0 0

Thank you Dayton it was greatly appreciated. 

0 Likes
Excursionist
17 0 4

Thank you so  much Dayton


@Dayton wrote:

my website iswww.jewelerscolek.com

You can add this at bottom of theme.scss file.

Find this file under assets of your theme.

a.btn.hero__cta {
    background: transparent !important;
    border: 5px solid #fff;
    color: #fff !important;
    font-size: 16px !important;
    padding: 8px 12px !important;
}
a.btn.hero__cta:hover {
    background:#fff !important;
    color:red !important;
}

 

0 Likes
Highlighted
Trailblazer
192 33 58
a.btn.hero__cta {
    margin-bottom:-35% !important:
}

Put at bottom of theme.scss file.

0 Likes
Highlighted
Tourist
10 0 0

Dayton it went off the page

 

0 Likes