From 99fbe827c921f9ac80f9d4ab1d71a49650069bfa Mon Sep 17 00:00:00 2001
From: Commander1024 <commander@commander1024.de>
Date: Sun, 16 Aug 2020 11:56:13 +0200
Subject: [PATCH] Changed pagination template to show disabled nav elements.

---
 lostplaces/lostplaces_app/static/main.css          |  2 ++
 .../templates/partials/nav/pagination.html         | 14 ++++++++++++++
 2 files changed, 16 insertions(+)

diff --git a/lostplaces/lostplaces_app/static/main.css b/lostplaces/lostplaces_app/static/main.css
index 782faa4..8f90181 100644
--- a/lostplaces/lostplaces_app/static/main.css
+++ b/lostplaces/lostplaces_app/static/main.css
@@ -264,6 +264,8 @@ body {
     flex-direction: row; }
   .LP-Pagination .LP-Pagination__Item {
     margin: 0 4px; }
+    .LP-Pagination .LP-Pagination__Item--disabled {
+      color: #b6b6b6; }
     .LP-Pagination .LP-Pagination__Item--current .LP-Link {
       background-color: #D7CEC7;
       border-radius: 2px; }
diff --git a/lostplaces/lostplaces_app/templates/partials/nav/pagination.html b/lostplaces/lostplaces_app/templates/partials/nav/pagination.html
index 8f2efc0..5b62df2 100644
--- a/lostplaces/lostplaces_app/templates/partials/nav/pagination.html
+++ b/lostplaces/lostplaces_app/templates/partials/nav/pagination.html
@@ -8,6 +8,13 @@
                 <li class="LP-Pagination__Item LP-Pagination__Item--previous">
                     <a href="?page={{ page_obj.previous_page_number }}" class="LP-Link"><span class="LP-Pagination__Previous">previous</span></a>
                 </li>
+            {% else %}
+                <li class="LP-Pagination__Item LP-Pagination__Item--first LP-Pagination__Item--disabled">
+                    <span class="LP-Pagination__First">first</span>
+                </li>
+                <li class="LP-Pagination__Item LP-Pagination__Item--previous LP-Pagination__Item--disabled">
+                    <span class="LP-Pagination__Previous">previous</span>
+                </li>
             {% endif %}
             {% for i in page_obj.paginator %}
                 {% if i.number == page_obj.number %}
@@ -25,6 +32,13 @@
                 <li class="LP-Pagination__Item LP-Pagination__Item--last">
                     <a href="?page={{ page_obj.paginator.num_pages }}" class="LP-Link"><span class="LP-Pagination__Last">last</span></a>
                 </li>
+            {% else %}
+                <li class="LP-Pagination__Item LP-Pagination__Item--next LP-Pagination__Item--disabled">
+                    <span class="LP-Pagination__Next">next</span>
+                </li>
+                <li class="LP-Pagination__Item LP-Pagination__Item--last LP-Pagination__Item--disabled">
+                    <span class="LP-Pagination__Last">last</span>
+                </li>
             {% endif %}
         </ul>
     </div>