menu not responsive

[acuvic]

Although the theme is listed as responsive, the navigation menu does not seem to be. Smaller screen does not give the "hamburger"(3 bar) menu. This is ok with the demo site it has only three menu items with short names that just folds into one line under the site title on smaller screens. With larger number of menu items, they all fold into multiple lines.

[budparr]

A hamburger menu does not define it as responsive, but I'm happy to make a better solution for longer menus. Do you have an example site I can look at? If not, how many menu items do you have?

[acuvic]

Thanks for your reply Bud. Here's a site that uses your theme

https://coercivecontrol.org.uk

You're right about hamburger menus. Just my stacked menu would probably fail google's mobile test due to lack of space between the lines of the menu.

Victor

On Tue, 26 Mar 2019 at 20:28, Bud Parr [email protected] wrote:

A hamburger menu does not define it as responsive, but I'm happy to make a better solution for longer menus. Do you have an example site I can look at? If not, how many menu items do you have?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/budparr/gohugo-theme-ananke/issues/166#issuecomment-476836393, or mute the thread https://github.com/notifications/unsubscribe-auth/AGkWvgVqiT8ds9hzHnp4ELPT9sabf2Zgks5vaoMDgaJpZM4cFznR .

-- 07722 358149 [email protected] [email protected] http://www.acupunctureforlife.co.uk

[mcolburn]

I also vote for adding collapsible menus to Ananke so it displays well on mobile devices.

[jan-xyz]

This theme has a responsive header menu like Ananke that folds into a single item with drop down: https://github.com/Vimux/Mainroad

This one has a side-menu that turns into a burger: https://github.com/alex-shpak/hugo-book.git

[deltreey]

someone had proposed this for bootstrap 3 @ https://github.com/twbs/bootstrap/issues/15786 Here's their fiddle: https://jsbin.com/lugosozida/edit?html,css,output

Perhaps it could be adjusted to work for our usage?

[freekvh]

I would really like it if my pretty large menu (especially the one in my native language!) would collapse into a hamburger on mobile (reduced width screens). So consider this a vote :)

Thanx for the great work.

[ctindel]

@budparr I found this open issue because like others I too thought this theme was responsive based on the website and was surprised to find that the menu doesn’t convert to hamburger style on mobile like many other Hugo themes.

Is there any work in flight on this that you know of? This theme is so nice and clean and simple, I could take a crack at it but didn’t want to duplicate work.

Just as examples these are two other sites with Hugo themes that I used that have hamburgers on mobile:

https://www.softwareinblue.com/

https://www.learningfromthelegends.com/

And my ananke site on mobile you can see the menu does not look good as it wraps around:

[budparr]

Thanks, @ctindel We definitely welcome PRs on this.

[ctindel]

OK, I didn't realize this theme was using tachyons for CSS instead of something more common like bootstrap. Tachyons itself doesn't even have a responsive website (try looking at https://tachyons.io on mobile, the menu gets cut off), not a great look for a CSS package haha.

Let me play around with it and see what I can dig up.

[ctindel]

@budparr OK I've created this PR

https://github.com/theNewDynamic/gohugo-theme-ananke/pull/638

If you want to test it out and give me some feedback. I am not a CSS expert by any means so possibly it needs some tweaking I don't know. Let me know what you think.