Responsive nav menu with hamburger menu

[jrnorrisjr]

The example in DS only shows icons and not the dropdown menus for nav items in the header that move to the hamburger menu when the browser is resized. Can you expand the DS example code to show how the dropdown menus work when moved from the header to the hamburger menu?

[smlombardi]

They would work the same as the menus on the current design system site (resize it to see). It's basically automatically handled by Bootstrap's CSS; the menus just fall under their header and expand.

See also http://getbootstrap.com/components/#navbar

[jrnorrisjr]

Hi Steve, I still think this is an issue. The DS demo does not work when the brower is resized and the header icons are moved below the icons in the hamburger menu. You can try it yourself: https://designsystem.pitneycloud.com/#/push/icon As you can see in the attached screenshot, clicking on the icons that were moved into the hamburger menu do nothing even though they indicate it is selected. I did see them working on the DS website itself but that does not use the hamburger menu. Jim

…

On Sun, Jun 25, 2017 at 5:54 PM, Steve Lombardi ***@***.***> wrote: Closed #31 <#31>. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#31 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AHv2UX8_QScvR9aDOwbP_GkpASCMO3E7ks5sHtcegaJpZM4ODlyI> .

[smlombardi]

I don't get it, it works for me. Here, the sample header is set to iPhone 7 size. Click "settings" opens the settings menu.

This is from https://designsystem.pitneycloud.com/#/web/patterns/demo/header

We did not optimize the push menus.

[jrnorrisjr]

Yes but try the demo of the one that has the hamburger menu. There are no sub-menus when the icons move into the hamburger menu. In the example code for the demo it is dynamically adding the header icons but the example code just adds the icons and no dropdowns.

[smlombardi]

I know. we never did that one. we assumed people would use the header sample above, and combine it.