From 4f2ae2f60d359b2e68bccb429ac3abc8a7509809 Mon Sep 17 00:00:00 2001
From: Jonas Platte <jplatte+git@posteo.de>
Date: Wed, 12 Oct 2022 19:25:25 +0200
Subject: [PATCH] Restyle pagination

---
 sass/_pagination.scss              | 18 +++++++++++++++---
 templates/includes/pagination.html | 17 +++++++++++------
 2 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/sass/_pagination.scss b/sass/_pagination.scss
index c31d1547c..37de16da7 100644
--- a/sass/_pagination.scss
+++ b/sass/_pagination.scss
@@ -1,5 +1,17 @@
 .pagination {
-    flex-direction: row;
-    justify-content: space-between;
-    margin-bottom: 1.5rem;
+    display: flex;
+    align-items: center;
+    margin: 1rem 0;
+    font-size: 120%;
+
+    >div {
+        flex: 1;
+    }
+
+    a {
+        padding: .5rem;
+        display: block;
+        width: 100%;
+        text-align: center;
+    }
 }
diff --git a/templates/includes/pagination.html b/templates/includes/pagination.html
index 2b4c5f5c9..0a63d0544 100644
--- a/templates/includes/pagination.html
+++ b/templates/includes/pagination.html
@@ -1,8 +1,13 @@
 <nav class="pagination">
-    {% if paginator.previous %}
-    <a class="w-button button-dark" href="{{ paginator.previous }}">‹ Previous</a>
-    {% endif %}
-    {% if paginator.next %}
-    <a class="w-button button-dark" href="{{ paginator.next }}">Next ›</a>
-    {% endif %}
+    <div class="prev">
+        {% if paginator.previous %}
+        <a href="{{ paginator.previous }}">‹ Previous</a>
+        {% endif %}
+    </div>
+    <span class="page-number">{{ paginator.current_index }} / {{ paginator.number_pagers }}</span>
+    <div class="prev">
+        {% if paginator.next %}
+        <a href="{{ paginator.next }}">Next ›</a>
+        {% endif %}
+    </div>
 </nav>