Left side hamburger menu on mobile

One thing we never got around to and caused some confusion after our work on Full height, slide out hamburger menu was that the hamburger menu, on the right side, opens a menu from the left side. For those interested in rearranging the header, this is for you:

Screenshot from 2020-09-18 12-19-27

Mobile menus appearing in the upper-left corner of the screen is not very reachable single-handedly which is why this is a standalone theme component. Options, yanno?

33 Likes

Very nice. Is it possible to extend the component and add the option for the logo to be in the middle of the bar when the menu icon is on the left? I think it’s the most logical way (speaking of ux).

4 Likes

Sure, I’ve added a theme option for you to make the logo more centered - enjoy! :slight_smile:

Screenshot from 2020-09-21 09-57-37

Screenshot from 2020-09-21 09-56-45

9 Likes

Would it be possible to customise this for the desktop version as well ?

Thanks for the theme component @featheredtoast

1 Like

I’d consider desktop out of scope for this particular theme component.

You could certainly do something similar for desktop if you were looking to reposition elements as adopting the same techniques I used here for desktop certainly wouldn’t be too difficult in a separate theme if you’ve got something in mind you’d like to do.

2 Likes

Thank you for the reply :slight_smile: I lack the skills to build one myself, but probably should be teaching myself those :wink:

It can be enabled only on tablet? Because that UX fits really good with tablets but not so much with mobile (a lot of people use their smartphones with one hand).

Lately this component has a bug, when I activate it, everything is misaligned, how can I fix it?
image

1 Like

This does not work. Since the hamburger button is already on the top-left corner on desktop, can we make it too on mobile UI in the core code? If not, what is the reason blocking this kind of unification of design.

1 Like

As we’ve had a couple of reports that this theme component isn’t currently working, I’ve added the broken tag. :+1:

1 Like

As stated in OP:

menus on are on same side on mobile for single hand usability.

Thanks for pointing out something I have definitely missed reading. I understand. But can we make it configurable?
The idea is that some users with relatively small-sized mobile phones (e…g. Pixel 7) may not have the reach ability issue and menu popping up from left is very unnatural. If at least something must appear at some corner, why couldn’t it be configured to be menu button (currently is site logo linking to homepage)?

Any news on when/if this will be fixed?