hikaya-io / hakawati

A collection of UI components
GNU General Public License v3.0
2 stars 1 forks source link

Refactor and create new NavBar component #201

Closed andrewtpham closed 3 years ago

andrewtpham commented 3 years ago

Is your feature request related to a problem? Please describe.

We would like the top nav bar menu to incorporate the side bar menu from element-UI when the screen size gets smaller.

Here is the NavBar component looks at full desktop screen: image

THEN when it gets to 989px width, the collapse menu icon appears:

Screen Shot 2021-02-26 at 12 08 09 PM

WHEN you click the collapse menu icon, it looks like this:

Screen Shot 2021-02-26 at 12 08 15 PM

AND this is what happens when you click on a sub-menu item: image

Now we would like to incorporate the side bar menu from element-UI at this point. When a sub-menu item is clicked, the entire navbar menu will expand so all menu items will be displayed, Currently, the popup menu appears over the main navbar menu its. The sidebar menu looks like this:

image

so we would like for small screens that the navbar component changes from horizontal to vertical mode and enable collapsible so you can easily see the sub menu items.

https://element.eleme.io/#/en-US/component/menu#side-bar