@x-govuk/govuk-prototype-components/src/govuk-prototype-kit/templates/sub-navigation.html

Common and experimental components that are not yet part of the GOV.UK Design System

{% extends "layouts/main.html" %}

{% block pageTitle %}
  Sub navigation page template – {{ serviceName }} – GOV.UK Prototype Components
{% endblock %}

{% block beforeContent %}
  {{ govukBackLink({
    href: "javascript:window.history.back()"
  }) }}
{% endblock %}

{% block content %}
  <div class="govuk-grid-row">
    <div class="govuk-grid-column-one-third">
      {{ xGovukSubNavigation({
        visuallyHiddenTitle: "Section navigation",
        items: [{
          text: "Page 1",
          href: "#"
        }, {
          text: "Page 2",
          href: "#"
        }, {
          text: "Page 3",
          href: "#",
          parent: true,
          children: [{
            text: "First child of page 3",
            href: "#",
            current: true
          }, {
            text: "Second child of page 3",
            href: "#"
          }]
        }]
      }) }}
    </div>
    <div class="govuk-grid-column-two-thirds">
      <h1 class="govuk-heading-l">
        Heading goes here
      </h1>

      <p>Content goes here.</p>
    </div>
  </div>
{% endblock %}