search

carbon-design-system / carbon-for-ibm-dotcom-design-kit

A versioned, comprehensive kit of the Carbon for IBM.com visual assets.
https://www.ibm.com/standards/carbon/
Apache License 2.0
4 stars 1 forks source link

Masthead: mobile menu should be full-width and cover L0 #26

Closed larahanlon2 closed 4 years ago

larahanlon2 commented 4 years ago

Because we're using Carbon UI header, the [hamburger] menu doesn't behave/appear the same as ibm.com masthead specs.

Current implementation:

Screen Shot 2019-12-06 at 11 30 47 AM

In the original design,mobile menu should slide over the entire screen, covering the L0. The platform name would appear at the top of the menu list. Like so:

Screen Shot 2019-12-06 at 11 16 59 AM

The platform name is used as a title and navigational link. The close-icon is used to bring the user back to the previous page view and show L0 again. Like so:

Screen Shot 2019-12-06 at 11 20 27 AM

This model allows the user to focus more on menu navigation. It prevents them from tapping on IBM logo, Search or Login which is distracting them from the main task at hand.

larahanlon2 commented 4 years ago

Deleting/closing this because I opened it in the wrong repo. Moved here.