Page navigation

Set out key sections of page, allowing a user to traverse long pages quickly and easily.

<!-- COMPONENT: Page navigation -->
<nav class="in-page-nav pull-right bg-mint-75-light">
    <header>
        <div class="row column">
            <h1>On this page</h1>
        </div>
    </header>
    <ul>
        <li><a href="#course-overview">Course overview</a></li>
        <li><a href="#course-structure">Course structure</a></li>
        <li><a href="#learning-assessment">Learning &amp; assessment</a></li>
        <li><a href="#pro-accreditations">Professional accreditations</a></li>
        <li><a href="#case-study">Case study</a></li>
        <li><a href="#entry-requirements">Entry requirements</a></li>
        <li><a href="#fees-funding">Fees &amp; Funding</a></li>
        <li><a href="#unistats">Unistats</a></li>
        <li><a href="#application-information">Application information</a></li>
        <li><a href="#course-enquiries">Course enquiries</a></li>
    </ul>
</nav>
<!-- End component: Page navigation -->
  • Handle: @page-navigation
  • Preview:
  • Filesystem Path: components/common-components/navigation/page-navigation/page-navigation.hbs
  • Referenced by (1): @page-nav