Skip to content

Add global navigation

Sarah German requested to merge 8-global-nav-vue into main

What does this MR do and why?

Adds the global nav to the Hugo site. More specifically:

  • Adds Vue components for the global navigation.
  • Modifies grid column widths to accommodate the left sidebar.
  • Minor adjustments to spacing around the table of contents.

This does not include:

  • Mobile version for the menu
  • "Skip to main content" button for keyboard users (#70 (closed))

We'll do these in follow-up MRs.

Screenshots, screen recordings, or links to review app

Before After After (collapsed)
image image image

How to set up and validate locally

Clone this project to a different directory than your other GitLab projects (gitlab, gitlab-runner, etc). It will modify source .md files in those directories on build. As part of setup, we will clone separate copies of these projects into the same directory as gitlab-docs-hugo.

  1. Clone this project and check out this branch.
  2. Install dependencies: make setup
  3. Clone Docs content: make clone-docs-projects
  4. Start the preview server: make view
  5. Browse the site at http://localhost:1313. The global navigation appears on all regular content pages.

Merge request acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Sarah German

Merge request reports