DAWN THEME: transparent logo not inverted on hover

[TheMythGaming]

Hello. I have a transparent header but logo is not inverted on hover. Works alright when you scroll. Thank you!

themythwys.com

[Moeed]

Hey @TheMythGaming 

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

{% if template.name != "index" %} 
<style>
header * {
    color: black !important;
}
.header__submenu .header__menu-item {
    color: black !important;
}
</style>
{% endif %}
<style>
.header-wrapper:hover .header__heading-logo {
    filter: invert(0) !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Dan-From-Ryviu · Accepted solution]

Hi @TheMythGaming 

You can add more of this code to do that. 

.header-wrapper:hover .header__heading-logo { filter: invert(0); }

[TheMythGaming]

@Dan-From-Ryviu Thank you! It worked. Sorry but one more thing, the cart icon is also not inverted on hover. Please help. Thank you!

[Dan-From-Ryviu]

Please add this code

.header-wrapper:hover .header__icon--cart .icon { color: #000 !important; }

[TheMythGaming]

@Dan-From-RyviuYou're really good! Thank you!

[Dan-From-Ryviu]

Very welcome! 

[TheMythGaming]

@Dan-From-Ryviu Sorry again but can you help me with this? The cart icon turns to black when I open the menu on mobile version. Thank you! 

 

[Dan-From-Ryviu]

Please up this code 

.header-wrapper:hover .header__icon--cart .icon { color: #000 !important; }

To this 

@media (min-width: 750px) {
.header-wrapper:hover .header__icon--cart .icon { color: #000 !important; }
}

[TheMythGaming]

@Dan-From-RyviuNice! Thank you again. 😄

[TheMythGaming]

@Dan-From-Ryviu Hello! Sorry but I have encountered a problem again. When I go to product page, The menu is white. Help please. Thank you!

 

[TheMythGaming]

@Dan-From-Ryviuplease help!

[Dan-From-Ryviu]

Give me collab request code of your store so I can correct your customized CSS code to solve it. 

[TheMythGaming]

I sent you a DM. Thank you!