Skip to content

Commit

Permalink
Add additional skiplink to bypass glossary nav (#242)
Browse files Browse the repository at this point in the history
The normal skiplink skips the top level navigation, but the glossary
page also has its own sidebar inside the main element.

This commit adds a "skip to glossary content" skiplink, so users can
skip this as well.
  • Loading branch information
MatMoore authored Apr 9, 2024
1 parent 1a72171 commit f557979
Show file tree
Hide file tree
Showing 2 changed files with 5 additions and 2 deletions.
4 changes: 3 additions & 1 deletion templates/base/base.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,10 @@
<script>
document.body.className += ' js-enabled' + ('noModule' in HTMLScriptElement.prototype ? ' govuk-frontend-supported' : '');
</script>
{% block skiplinks %}
<a href="#main-content" class="govuk-skip-link" data-module="govuk-skip-link">Skip to main content</a>

{% endblock %}

{% include "base/navigation.html" %}

<div class="govuk-width-container app-width-container">
Expand Down
3 changes: 2 additions & 1 deletion templates/glossary.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ <h1 class="govuk-heading-l">Glossary</h1>
</div>
<div class="govuk-grid-row">
<div class="govuk-grid-column-one-quarter" id="sticky-sidebar">
<a href="#glossary-content" class="govuk-skip-link" data-module="govuk-skip-link">Skip to glossary content</a>
<ul class="govuk-list">
{% for parent_term in results %}
<li class="term-group">
Expand All @@ -32,7 +33,7 @@ <h1 class="govuk-heading-l">Glossary</h1>
{%endfor%}
</ul>
</div>
<div class="govuk-grid-column-three-quarters">
<div class="govuk-grid-column-three-quarters" id="glossary-content">
{% for parent_term in results %}
<div class="term-group">
<h2 class="govuk-heading-l" id="{{ parent_term }}">{{ parent_term.name }}</h2>
Expand Down

0 comments on commit f557979

Please sign in to comment.