From 899c58918a07be6c938a6e70ff0cb964b9e56094 Mon Sep 17 00:00:00 2001
From: Felipe Martin <me@fmartingr.com>
Date: Mon, 19 Dec 2016 16:00:02 +0100
Subject: [PATCH] Improved pagination layout

---
 assets/static/sass/_layout.sass  |  6 ++++++
 templates/macros/pagination.html | 27 ++++++++++++++++-----------
 2 files changed, 22 insertions(+), 11 deletions(-)

diff --git a/assets/static/sass/_layout.sass b/assets/static/sass/_layout.sass
index 6c68543..95e7c30 100644
--- a/assets/static/sass/_layout.sass
+++ b/assets/static/sass/_layout.sass
@@ -49,3 +49,9 @@ p:first-child
 
 .float-right
   float: right
+
+.float-left
+  float: left
+
+.clearfloat
+  clear: both
diff --git a/templates/macros/pagination.html b/templates/macros/pagination.html
index 077cc5a..815f6bd 100644
--- a/templates/macros/pagination.html
+++ b/templates/macros/pagination.html
@@ -1,15 +1,20 @@
 {% macro render_pagination(pagination) %}
   <div class="pagination">
-    {% if pagination.has_prev %}
-      <a href="{{ pagination.prev|url }}">&laquo; Previous</a>
-    {% else %}
-      <span class="disabled">&laquo; Previous</span>
-    {% endif %}
-    | {{ pagination.page }} |
-    {% if pagination.has_next %}
-      <a href="{{ pagination.next|url }}">Next &raquo;</a>
-    {% else %}
-      <span class="disabled">Next &raquo;</span>
-    {% endif %}
+    <div class="float-left">
+      {% if pagination.has_prev %}
+        <a href="{{ pagination.prev|url }}">&laquo; Newer</a>
+      {% else %}
+        <span class="disabled">&laquo; Newer</span>
+      {% endif %}
+    </div>
+    <div class="float-right">
+      {% if pagination.has_next %}
+        <a href="{{ pagination.next|url }}">Older &raquo;</a>
+      {% else %}
+        <span class="disabled">Older &raquo;</span>
+      {% endif %}
+    </div>
+    <div class="text-center">Page {{ pagination.page }}</div>
+    <div class="clearfloat"></div>
   </div>
 {% endmacro %}