Dawn theme Image banner button customization

Store Design
, , , ,
1

I’m using the Dawn theme in that I want to customize the hero section image banner button, I want to remove the border on button and want to make the button glassy touch like the header on scroll. Please anyone help me to customize those.

website: https://coffeebyrsa.com/

image
image315×595 45.5 KB

2

Hey @Sivadarshan

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </ body> tag
<style>
.banner__buttons a:after {
    box-shadow: unset !important;
}
</style>

If you require any other help, feel free to reach out to me. If I managed to help you then a Like would be truly appreciated.

Best,
Moeed

3

Hi @Sivadarshan,

Kindly provide your store URL please and if it is password protected, please share the password as well.

Thanks!

4

@Sivadarshan please add this css to the very end of your base.css file and check,
Shopify Admin → Online Store ->Theme → Edit code → base.css

.banner__box .button{
background-color: #fffc !important;
    backdrop-filter: blur(10px);
    box-shadow: unset !important;
color: #8a5e3b;
}

.banner__box .button--secondary:after{box-shadow: unset !important;}

it should look like below

image
image1366×768 243 KB

5

image
image641×362 70 KB

It’s looking good now, but the text isn’t very visible. Can you make the text bold? @Sivadarshan