Improve accessibility (#597)

layout/_partials/header/brand.njk

@@ -28,7 +28,7 @@
   </div>
 
   <div class="site-nav-right">
-    <div class="toggle popup-trigger">
+    <div class="toggle popup-trigger" aria-label="{{ __('menu.search') }}" role="button">
       {%- if theme.algolia_search.enable or theme.local_search.enable %}
         <i class="fa fa-search fa-fw fa-lg"></i>
       {%- endif %}

layout/_partials/pagination.njk

@@ -1,12 +1,5 @@
 {%- if page.prev or page.next %}
   <nav class="pagination">
-    {{
+    {{ next_paginator() }}
-      paginator({
-        prev_text: '<i class="fa fa-angle-left" aria-label="' + __('accessibility.prev_page') + '"></i>',
-        next_text: '<i class="fa fa-angle-right" aria-label="' + __('accessibility.next_page') + '"></i>',
-        mid_size : 1,
-        escape   : false
-      })
-    }}
   </nav>
 {%- endif %}

scripts/helpers/next-paginator.js

@@ -0,0 +1,18 @@
+/* global hexo */
+
+'use strict';
+
+hexo.extend.helper.register('next_paginator', function() {
+  const prev = this.__('accessibility.prev_page');
+  const next = this.__('accessibility.next_page');
+  let paginator = this.paginator({
+    prev_text: '<i class="fa fa-angle-left"></i>',
+    next_text: '<i class="fa fa-angle-right"></i>',
+    mid_size : 1,
+    escape   : false
+  });
+  paginator = paginator
+    .replace('rel="prev"', `rel="prev" title="${prev}" aria-label="${prev}"`)
+    .replace('rel="next"', `rel="next" title="${next}" aria-label="${next}"`);
+  return paginator;
+});