Pagination tweak (#460)

We can use the nhsIcon now

Author: frankieroberto

app/components/pagination/_pagination.scss

@@ -217,7 +217,7 @@
 
 .nhsuk-pagination--numbered .nhsuk-icon {
   margin-top: 0;
-  margin-bottom: -12px;
+  margin-bottom: -10px;
   fill: nhsuk-colour("blue");
 }
 

app/components/pagination/template.njk

@@ -1,4 +1,5 @@
 {% from "../../../node_modules/nhsuk-frontend/dist/nhsuk/macros/attributes.njk" import nhsukAttributes %}
+{% from "../../../node_modules/nhsuk-frontend/dist/nhsuk/macros/icon.njk" import nhsukIcon %}
 
 {# There are 2 variants of this component, one for content pages which
 has only previous and next links including the titles of those pages,
@@ -10,16 +11,12 @@ presence of items (pages). #}
 
 {# Arrow pointing left - used by both variants #}
 {%- macro _arrowPrevious() -%}
-  <svg class="nhsuk-icon nhsuk-icon__arrow-left" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" width="34" height="34">
-    <path d="M4.1 12.3l2.7 3c.2.2.5.2.7 0 .1-.1.1-.2.1-.3v-2h11c.6 0 1-.4 1-1s-.4-1-1-1h-11V9c0-.2-.1-.4-.3-.5h-.2c-.1 0-.3.1-.4.2l-2.7 3c0 .2 0 .4.1.6z"></path>
-  </svg>
+  {{ nhsukIcon("arrow-left") }}
 {%- endmacro -%}
 
 {# Arrow pointing right - used by both variants #}
 {%- macro _arrowNext() -%}
-  <svg class="nhsuk-icon nhsuk-icon__arrow-right" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" width="34" height="34">
-    <path d="M19.6 11.66l-2.73-3A.51.51 0 0 0 16 9v2H5a1 1 0 0 0 0 2h11v2a.5.5 0 0 0 .32.46.39.39 0 0 0 .18 0 .52.52 0 0 0 .37-.16l2.73-3a.5.5 0 0 0 0-.64z"></path>
-  </svg>
+  {{ nhsukIcon("arrow-right") }}
 {%- endmacro -%}
 
 {# Numbered page - included as a link within a list item. #}