How to hide the menu button in favor of a custom close icon on desktop?

[ddai]

I have coding to have the hamburger enabled on desktop. I have a custom .svg to have my menu text saying "menu" rather than the hamburger icon. I am running into something I cant figure out or find other forums with something similar. When I click the menu button, the close "X" shows on top (or under) the menu svg. Is there a way where the menu button hides and allows only the X to show, OR, a way where the menu button still hides, but I can upload another custom .svg that says close..? The link to my website is ysamani.com Thanks for all help and guidance. Really love how helpful the Shopify community is. 

[GemPages · Accepted solution]

Hello @ddai 

It's GemPages support team and glad to support you today.

I would like to give you a solution to support you.

1. Go to Online Store -> Theme -> Edit code.

2. Open your assets/base.css

3. Paste add the code at the end of this file:

    .menu-opening > summary > span > svg[standalone="no"]{
       display: none !important;
    }

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

[ddai]

Thank you ! This worked.