How can I make my Dawn theme buttons transparent?

Store Design
1

Hello,

How do I make my buttons transparent instead of the colors I chose. They look like this:

Aylin2022_0-1663801176165.png
Aylin2022_0-1663801176165.png1016×418 188 KB

But I want it look like this. I want either white frame or black frame.

Aylin2022_1-1663801233848.png
Aylin2022_1-1663801233848.png479×139 77.1 KB

Aylin2022_2-1663801251038.png

My URL is www.theava.co

Many thanks in advance!

Aylin

2

@Aylin2022 You need to add this code in the theme files. For which you need to go to Online Store > Actions (Active theme) > Edit Code > Assets, under assets add the code at the bottom of base.css file.

.banner__content .banner__buttons a {
    background-color: transparent !important;
    border: 2px solid #fff;
}
3

Thank you so much @NerdCurator ! It worked on the desktop; however, on the mobile, since it has the white back ground, you can’t see the button and what it says. How can I make it transparent on the desktop but black font color and black frame on the mobile?

4

@Aylin2022 Please add this code too below the previous code.

@media screen and (max-width: 749px){
.banner__content .banner__buttons a{border:2px solid #000;
color:#000; }
}
5

YOU DA BEST!!! THANK YOU!!! How can I change this one?

Aylin2022_0-1663807485502.png
Aylin2022_0-1663807485502.png1337×393 48.3 KB

This one did not change because it is not a banner but Rich text right? I think I am getting better on this. LOL. Truly appreciate your time and help. Many many many thanks

6

@Aylin2022 You know the drill. Add this code in the same file.

.rich-text .rich-text__buttons a{
color: #000 !important; 
background: transparent !important;
border: 2px solid #000;
}