How can I modify mobile navigation menu width and arrow icons?

[slatty]

Hi,

I wanted to know if it’s possible for me to make the mobile nav menu full screen instead of 3/4 like the example below. 

i would also like to change the icon to an arrow like below (and add line dividers if possible) as opposed to how Shopify standard is. Is this possible?

my store url: webse.co.uk

my theme: dawn 

mine: 

how I want it to look:

[KetanKumar]

@slatty 

oh sorry for that issue can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/component-menu-drawer.css ->paste below code at the bottom of the file.

.menu-drawer {width: 100% !important;}

[slatty]

Amazing thank you @KetanKumar !

Do you know how I can change the arrow & add lines between each item?

[KetanKumar]

@slatty 

can you please add this code 

.js .menu-drawer__menu li {
border-bottom: 1px solid #fff;
}

[slatty]

Amazing thanks @KetanKumar !

Do you know how I can change the arrows to a more appealing icon please?

[KetanKumar]

@slatty 

It can be done by doing some code customization. please send me a personal message and we can discuss what you'd like

[slatty]

I have just tried to message you but it won't let me. Please could you send me a message & I will reply. Thanks @KetanKumar 

[KetanKumar · Accepted solution]

@slatty 

yes, sure i will send message and let you know 

[varun111]

Hey, could you please provide the solution here?