Update previous/next navigation to match GOV.UK

The pagination pattern on GOV.UK changed in:
https://github.com/alphagov/static/pull/1051

We should update ours to match because:
- consistency
- the new icons looks better
This commit is contained in:
Chris Hill-Scott
2018-01-08 15:48:25 +00:00
parent 24d73a2471
commit 17ea920be4
2 changed files with 62 additions and 68 deletions

View File

@@ -4,7 +4,12 @@
{% if previous_page %}
<li class="previous-page">
<a href="{{previous_page['url']}}" rel="previous" >
<span class="pagination-part-title">{{previous_page['title']}}</span>
<span class="pagination-part-title">
<svg class="pagination-icon" xmlns="http://www.w3.org/2000/svg" height="13" width="17" viewBox="0 0 17 13">
<path fill="currentColor" d="m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z"/>
</svg>
{{previous_page['title']}}
</span>
<span class="pagination-label">{{previous_page['label']}}</span>
</a>
</li>
@@ -12,7 +17,12 @@
{% if next_page %}
<li class="next-page">
<a href="{{next_page['url']}}" rel="next">
<span class="pagination-part-title">{{next_page['title']}}</span>
<span class="pagination-part-title">
{{next_page['title']}}
<svg class="pagination-icon" xmlns="http://www.w3.org/2000/svg" height="13" width="17" viewBox="0 0 17 13">
<path fill="currentColor" d="m10.107-0.0078125-1.4136 1.414 4.2926 4.293h-12.986v2h12.896l-4.1855 3.9766 1.377 1.4492 6.7441-6.4062-6.7246-6.7266z"/>
</svg>
</span>
<span class="pagination-label">{{next_page['label']}}</span>
</a>
</li>