Hamburger menu on mobile

Hi,

Any clue on how to reduce my hamburger menu on mobile?

Right now when clicking on the hamburger the overlay takes the whole screen and I'd like for it to take half of the screen.

The desktop hamburger menu overlay only takes 1/3 of the page for example when opened.

Thanks!

https://wolverine-polygon-atzy.squarespace.com/config/

password: jewellery21

1 hour ago, inham said:

Hi,

Any clue on how to reduce my hamburger menu on mobile?

Right now when clicking on the hamburger the overlay takes the whole screen and I'd like for it to take half of the screen.

The desktop hamburger menu overlay only takes 1/3 of the page for example when opened.

Thanks!

https://wolverine-polygon-atzy.squarespace.com/config/

password: jewellery21

Have you solved it yet? Currently it seems fine 

On the desktop it does but not on mobile. I'd like the same on mobile.

Can you see it?

On 11/3/2021 at 7:59 PM, inham said:

On the desktop it does but not on mobile. I'd like the same on mobile.

Can you see it?

I see desktop show fullscreen now. Do you still need help or you changed your mind?

Hi,

I have gone live with the website and whenever I clicked on the burger menu on desktop the overlay menu would open on the left of my page but a massive column would appear on the right which looked really awful. So i had to go full screen but I still want to have it as 1/4 of the screen.

i was using this code:

better-burger {

width: 20%;

min-width: 200px;

left: 0;

right: unset;

transform: translate(-100%,0%);

}

(I've attached a picture)

And then I want to replicate it on mobile and not have it take the whole screen.

Actually, on mobile what I want to achieve is not go through at all "menu" = folder and land directly on my pages = collection, handmade and custom made.

Is there any way to achieve that?

Thanks!