Mobile Navigation Slide direction [Supply Theme]

Highlighted
New Member
5 0 0

Hello Everyone,

In my website (supply theme), navigation menu in mobile view slides from down to up after the hamburger icon is toggled however i'm trying to change the sliding direction to the opposite (up to down). How can i achieve this ?

Thanks.

0 Likes
Highlighted
New Member
5 0 0

Bump.. please can anyone help ?

0 Likes
Highlighted
Trailblazer
265 68 75

Hi, @Basik 

Thanks and Welcome to the Shopify community!
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.nav-bar {
    top: auto;
    bottom: 110%;
}
 
If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
Highlighted
New Member
5 0 0

Hi @Vikas_Chovatiya 

It worked ! Thanks you for awesome help. I have one issue now, it would be great if you can help me. Currently my mobile menu width is 60% however when the menu is closed it closes with width 100%. How can i fix this ?

0 Likes
Highlighted
Trailblazer
265 68 75

Hi @Basik 

Please share your website link.
So I can show it

If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
Highlighted
New Member
5 0 0

Hi @Vikas_Chovatiya 

https://basik-kw.com (password is 123).

0 Likes
Highlighted
Trailblazer
265 68 75

Hi @Basik 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.show-nav .nav-bar{    width: 100%;}
If helpful then please Like and Accept Solution.
-Want to modify or custom changes on store Hire me.
- Feel free to contact me on vikaschovatiya02@gmail.com regarding any help
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
Highlighted
New Member
5 0 0

Dear @Vikas_Chovatiya 

 

just to clarify; im happy with the menu width being 60% but when you try to hide the menu (it goes from down to up), the transition effect for a second shows full menu width closing. Will this code you shared help me or is it a different case ?

0 Likes