Refactoring template and using bootstrap pagination style.

nikola/data/themes/base-jinja/templates/index.tmpl

@@ -1,6 +1,7 @@
 {#  -*- coding: utf-8 -*- #}
 {% import 'index_helper.tmpl' as helper with context %}
 {% import 'comments_helper.tmpl' as comments with context %}
+{% import 'pagination_helper.tmpl' as pagination with context %}
 {% extends 'base.tmpl' %}
 
 {% block extra_head %}
@@ -10,29 +11,13 @@
     {% endif %}
 {% endblock %}
 
-{% block page_navigation %}
-<div class="page-navigation">
-  {% for i, link in enumerate(page_links) %}
-    {% if abs(i - current_page) <= 3 or i == 0 or i == page_links|length - 1 %}
-      {% if i == current_page %}
-        <span class="current-page">{{ i+1 }}</span>
-      {% else %}
-        <a href="{{ page_links[i] }}">{{ i+1 }}</a>
-      {% endif %}
-    {% elif i == current_page - 4 or i == current_page + 4 %}
-      <span class="ellipsis">&#x22EF;</span>
-    {% endif %}
-  {% endfor %}
-</div>
-{% endblock %}
-
 {% block content %}
 {% block content_header %}{% endblock %}
 {% if 'main_index' in pagekind %}
     {{ front_index_header }}
 {% endif %}
 {% if page_links %}
-    {{ page_navigation() }}
+    {{ pagination.page_navigation(current_page, page_links, prevlink, nextlink) }}
 {% endif %}
 <div class="postindex">
 {% for post in posts %}

nikola/data/themes/base-jinja/templates/pagination_helper.tmpl

@@ -0,0 +1,16 @@
+{#  -*- coding: utf-8 -*- #}
+{% macro page_navigation(current_page, page_links, prevlink, nextlink) %}
+<div class="page-navigation">
+  {% for i, link in enumerate(page_links) %}
+    {% if abs(i - current_page) <= 3 or i == 0 or i == page_links|length - 1 %}
+      {% if i == current_page %}
+        <span class="current-page">{{ i+1 }}</span>
+      {% else %}
+        <a href="{{ page_links[i] }}">{{ i+1 }}</a>
+      {% endif %}
+    {% elif i == current_page - 4 or i == current_page + 4 %}
+      <span class="ellipsis">&#x22EF;</span>
+    {% endif %}
+  {% endfor %}
+</div>
+{% endmacro %}

nikola/data/themes/base/templates/index.tmpl

@@ -1,6 +1,7 @@
 ## -*- coding: utf-8 -*-
 <%namespace name="helper" file="index_helper.tmpl"/>
 <%namespace name="comments" file="comments_helper.tmpl"/>
+<%namespace name="pagination" file="pagination_helper.tmpl"/>
 <%inherit file="base.tmpl"/>
 
 <%block name="extra_head">
@@ -10,29 +11,13 @@
     % endif
 </%block>
 
-<%block name="page_navigation">
-<div class="page-navigation">
-  % for i, link in enumerate(page_links):
-    % if abs(i - current_page) <= 3 or i == 0 or i == len(page_links) - 1:
-      % if i == current_page:
-        <span class="current-page">${i+1}</span>
-      % else:
-        <a href="${page_links[i]}">${i+1}</a>
-      % endif
-    % elif i == current_page - 4 or i == current_page + 4:
-      <span class="ellipsis">&#x22EF;</span>
-    % endif
-  % endfor
-</div>
-</%block>
-
 <%block name="content">
 <%block name="content_header"></%block>
 % if 'main_index' in pagekind:
     ${front_index_header}
 % endif
 % if page_links:
-    ${page_navigation()}
+    ${pagination.page_navigation(current_page, page_links, prevlink, nextlink)}
 % endif
 <div class="postindex">
 % for post in posts:

nikola/data/themes/base/templates/pagination_helper.tmpl

@@ -0,0 +1,16 @@
+## -*- coding: utf-8 -*-
+<%def name="page_navigation(current_page, page_links, prevlink, nextlink)">
+<div class="page-navigation">
+  % for i, link in enumerate(page_links):
+    % if abs(i - current_page) <= 3 or i == 0 or i == len(page_links) - 1:
+      % if i == current_page:
+        <span class="current-page">${i+1}</span>
+      % else:
+        <a href="${page_links[i]}">${i+1}</a>
+      % endif
+    % elif i == current_page - 4 or i == current_page + 4:
+      <span class="ellipsis">&#x22EF;</span>
+    % endif
+  % endfor
+</div>
+</%def>

nikola/data/themes/bootstrap3-jinja/templates/pagination_helper.tmpl

@@ -0,0 +1,20 @@
+{#  -*- coding: utf-8 -*- #}
+{% macro page_navigation(current_page, page_links, prevlink, nextlink) %}
+<nav aria-label="Page navigation">
+  <ul class="pagination">
+  {% if prevlink %}
+    <li><a href="{{ prevlink }}" aria-label="{{ messages("Newer posts") }}"><span aria-hidden="true">&laquo;</span></a></li>
+  {% else %}
+    <li class="disabled"><a href="#" aria-label="{{ messages("Newer posts") }}"><span aria-hidden="true">&laquo;</span></a></li>
+  {% endif %}
+  {% for i, link in enumerate(page_links) %}
+    <li {{ ' class="active"' if i == current_page else '' }}><a href="{{ link }}">{{ i + 1 }}{{ ' <span class="sr-only">(current)</span>' if i == current_page else '' }}</a></li>
+  {% endfor %}
+  {% if nextlink %}
+    <li><a href="{{ nextlink }}" aria-label="{{ messages("Older posts") }}"><span aria-hidden="true">&raquo;</span></a></li>
+  {% else %}
+    <li class="disabled"><a href="#" aria-label="{{ messages("Older posts") }}"><span aria-hidden="true">&raquo;</span></a></li>
+  {% endif %}
+  </ul>
+</nav>
+{% endmacro %}

nikola/data/themes/bootstrap3/templates/pagination_helper.tmpl

@@ -0,0 +1,20 @@
+## -*- coding: utf-8 -*-
+<%def name="page_navigation(current_page, page_links, prevlink, nextlink)">
+<nav aria-label="Page navigation">
+  <ul class="pagination">
+  % if prevlink:
+    <li><a href="${prevlink}" aria-label="${messages("Newer posts")}"><span aria-hidden="true">&laquo;</span></a></li>
+  % else:
+    <li class="disabled"><a href="#" aria-label="${messages("Newer posts")}"><span aria-hidden="true">&laquo;</span></a></li>
+  % endif
+  % for i, link in enumerate(page_links):
+    <li ${' class="active"' if i == current_page else ''}><a href="${link}">${i + 1}${' <span class="sr-only">(current)</span>' if i == current_page else ''}</a></li>
+  % endfor
+  % if nextlink:
+    <li><a href="${nextlink}" aria-label="${messages("Older posts")}"><span aria-hidden="true">&raquo;</span></a></li>
+  % else:
+    <li class="disabled"><a href="#" aria-label="${messages("Older posts")}"><span aria-hidden="true">&raquo;</span></a></li>
+  % endif
+  </ul>
+</nav>
+</%def>