How to change text, icon, and logo color on header when scrolling in Dawn theme

Store Design
1

I am currently using the Dawn theme and made the background of my header transparent when you first open the website and opaque when you scroll or are on a different page in the site. The text, icons, and logo are all black but that makes it difficult to see when the header is transparent. How do I change the color of the text and icons to white and change the logo to a white version when the header background is transparent, but then have them black when the header background is opaque?

1 Like
2

@sanjivp27

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

Thanks for getting back to me. The site URL is sisubracelets.us.

4

@sanjivp27

please share your layout/theme.liquid file code .

Thnaks!

5

Here’s the full zip file of the code.

1 Like
6

@sanjivp27

Please find the following code in your layout /theme.liquid file.

Replace to

you will change this code I will send CSS after your changes.

Thanks!

7

Thank you for getting back to me. I made the changes suggested. Can you please send me the CSS at your convenience?

8

Hello Dmwwebartisan, i’m facing the same issue with Dawn theme.
Can you publish the CSS, that would be really helpful !

Thx

9

Hi Dmwwebartisan, i’m facing the exact same issue with Dawn 8 theme, and am wondering, if you could share the css code? Thank you very much, best regards