Issue with mobile hamburger menu

[filials]

Hello! I am using the dawn theme. The desktop version of the website is coming along nicely (thank you to those that have helped me in the past). The mobile version translates nicely although there is one issue I’m not sure how to fix. For some reason the hamburger menu looks like this on mobile, where the x to close it out is overlayed on top when it’s not open:

website: c-tama.com
theme: dawn

[dinesh_kumar]

@filials you haven’t added the class “icon icon-close” to the close svg icon. just add these classes to the close svg icon it will work

[Moeed]

Hey @filials

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>
.header__icon--menu[aria-expanded="false"] svg#svg {
    display: none !important;
}
</style>

RESULT:

     

---

Hope that helps! If it did, a Like and Marking it as Solution goes a long way and helps others find the fix faster too.

Best,
Moeed

[Custom-Cursor]

Hey @filials

hope you are doing well!

This usually happens when custom CSS or JavaScript is affecting the menu toggle, Have you recently made any code changes to the Dawn theme?

[devcoders]

Hi @filials

I checked your website, and everything seems to be working fine now. Has your issue been resolved?

Best regards,
Devcoder