Details
-
Task
-
Status: Closed
-
Minor
-
Resolution: Deferred
-
4.0
-
None
-
MOODLE_400_STABLE
Description
Develop templates for secondary navigation.
Using the Moodle 4.0 Navigation prototype – (Replace with final Figma link) and the example navigation node, create the base templates and any applicable renderers for the new primary navigation.
User stories
| Story | Acceptance Criteria / Confirmation |
|---|---|
| As a teacher, I want to easily find the menu item, so that I can move between courses and activities | I should be able to easily see my list of courses in a predictable place and be able to jump from one course to another at speed |
| As any user, I want to see an overview of all of my courses, so that I can navigate around the site | I can navigate to a dashboard of sorts that contains the courses I am currently enrolled in or have access to |
| As any user, I want to easily navigate to an enrolled course, so that I can view my content | I can easily find my desired course to review its content |
| As any user, I want to quickly navigate to the site home page, so that I can find other relevant content | I am able to navigate to the sites home easily & quickly |
| As a site admin, I want to modify my Moodle instances’ settings, so that I can deliver a better experience for my users | Links to the site administration settings still appear in easily locatable locations for site administrators |
Acceptance criteria
- New files and sub directories created in logical locations, example located below
- Frontend matches the designs
- UI elements are accessible
- Follows WCAG AA
- LTR & RTL compatibility
- Navigation items should appear as tabs within the site header
- Active element needs to have an indicator below the active tab
- Hover styling that indicates the potential tab item that’ll be navigated to
- Dynamic “More” menu which will accommodate navigation elements when the viewport width reduces width
- Navigation elements should render within a navigation drawer on the left side of the viewport on a mobile sized device
Example file location
/lib/templates
/navigation
/primary
/navigation_node.mustache
Example navigation_node that the primary navigation view may return
[
|
navigation_node: object {
|
"text": string |
"key": string |
"display": boolean |
"isactive": boolean |
"children": [ |
navigation_view_node()
|
{ "text": string "key": string "display": boolean "active": boolean "children": [navigation_view_node: object,...] } |
]
|
},
|
navigation_view_node: object {}
|
, etc…
|
]
|
Attachments
Issue Links
- is child of
-
MDL-70208 Implement frontend functionality for primary navigation
-
- Closed
-