Navigation

Desktop

Scenarios

Advisor

Given: An adviser logs in to their manage portal
When: Successfully logged in and enterred their portal
Then: Navigation menu bar should be presented under the header

Given: An advisor in their manage portal and wants to navigate to a page
When: They hover over a menu item in the navigation bar
Then: A drop down list of sub-menu links should be displayed

Given: An advisor is viewing sub-menu items in the navigation bar dropdown
When: They navigate outside the hovered menu item
Then: Dropdown list should collapse

Member

Given: A member logs in to their manage portal
When: Successfully logged in and landed on homepage
Then: Navigation menu bar should be presented under the header

Given: A member in their manage portal and wants to navigate to a page
When: They hover over a menu item in the navigation bar
Then: A drop down list of sub-menu links should be displayed

Given: An advisor is viewing sub-menu items in the navigation bar dropdown
When: They navigate outside the hovered menu item
Then: Dropdown list should collapse

Advisor Manage Portal

Hover over menu item

Drop down list of sub-menu items displayed

Navigates Outside the menu item

Drop down list collapses

Hover over sub-menu items

Hovered link 's background highlighted to grey

Hovered link's text color does not change

Current 'Active' menu item

Shaded grey

Member Manage Portal

Hover over menu item

Drop down list of sub-menu items displayed

Navigates Outside the menu item

Drop down list collapses

Hover over sub-menu items

Hovered link 's background highlighted to grey

Hovered link's text color does not change

Current 'Active' menu item

Shaded grey

UI

Min width of drop-down menus is width of header

Mobile

Scenarios

Advisor

Given: An advisor is viewing sub-menu items in the navigation bar dropdown
When: They tap outside the dropdown list
Then: Dropdown list should collapse

Given: A member logs in to their manage portal
When: Successfully logged in and landed on homepage
Then: Menu icon should be presented to the right in the header

Given: An advisor in their manage portal and wants to navigate to a page
When: They tap the menu icon in the navigation bar
Then: A drop down list of sub-menu links should be displayed

Member

Given: A member logs in to their manage portal
When: Successfully logged in and landed on homepage
Then: Menu icon should be presented to the right in the header

Given: An advisor in their manage portal and wants to navigate to a page
When: They tap the menu icon in the navigation bar
Then: A drop down list of sub-menu links should be displayed

Given: An advisor is viewing sub-menu items in the navigation bar dropdown
When: They tap outside the dropdown list
Then: Dropdown list should collapse

Member Navigation

Taps menu icon

Menu drop down displaying links

'MENU' text

Clickable

Taps links in drop drop down menu

Currently active link drops down displaying sub-menu links

Sub-menus should collapse when another sub-menu is expanded

Taps anywhere outside navigation menu

Navigation menu collapses

Default view

After logging in on mobile view, mobile menu should be minimised

Navigation should have 'logout' and 'contact us' menu items

UI

Header height, logo size etc. scales down in mobile view

Compatibility

refer to "PC & Mobile Browsers.mm"