Fix pagination buttons styling

AKSW · Jan 3, 2024 · 6ea824b · 6ea824b
1 parent a01993c
commit 6ea824b
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 15 deletions.
diff --git a/bibliography/bibliography.css b/bibliography/bibliography.css
@@ -160,8 +160,6 @@ header {
   border-radius: 2px;
 }
 
-
-
 #search {
   display: flex;
   justify-content: center;
@@ -296,6 +294,11 @@ header {
   transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
 }
 
+.current-page-button {
+  font-size: 1.1em !important; 
+  padding: 5px 8px !important; 
+}
+
 .modal {
   display: none; /* Hidden by default */
   position: fixed; /* Stay in place */

diff --git a/bibliography/bibliography.js b/bibliography/bibliography.js
@@ -506,20 +506,22 @@ function createIndicator(id) {
 
 // Displays pagination buttons
 function displayPaginationButtons(container, totalPublications) {
-  let totalPages = Math.ceil(totalPublications / PUBLICATIONS_PER_PAGE);
+  if (totalPublications > 0) {
+    let totalPages = Math.ceil(totalPublications / PUBLICATIONS_PER_PAGE);
 
-  // Create a div for pagination buttons
-  let paginationDiv = document.createElement("div");
-  paginationDiv.style.textAlign = "center"; // Center the buttons
+    // Create a div for pagination buttons
+    let paginationDiv = document.createElement("div");
+    paginationDiv.style.textAlign = "center"; // Center the buttons
 
-  appendPageButton(paginationDiv, 1, currentPage > 2); // First page
-  appendPageButton(paginationDiv, currentPage - 1, currentPage > 1); // Previous page
-  appendCurrentPageButton(paginationDiv, currentPage); // Current page
-  appendPageButton(paginationDiv, currentPage + 1, currentPage < totalPages); // Next page
-  appendPageButton(paginationDiv, totalPages, currentPage < totalPages - 1); // Last page
+    appendPageButton(paginationDiv, 1, currentPage > 2); // First page
+    appendPageButton(paginationDiv, currentPage - 1, currentPage > 1); // Previous page
+    appendCurrentPageButton(paginationDiv, currentPage); // Current page
+    appendPageButton(paginationDiv, currentPage + 1, currentPage < totalPages); // Next page
+    appendPageButton(paginationDiv, totalPages, currentPage < totalPages - 1); // Last page
 
-  // Append the pagination div to the container
-  container.appendChild(paginationDiv);
+    // Append the pagination div to the container
+    container.appendChild(paginationDiv);
+  }
 }
 
 // Appends a page button to a div
@@ -546,6 +548,6 @@ function createPageButton(page) {
 function appendCurrentPageButton(div, page) {
   let currentPageButton = document.createElement("button");
   currentPageButton.textContent = page;
-  currentPageButton.className = "btn btn-primary mr-2 page-button"; // Added 'pagination-button' class
+  currentPageButton.className = "btn btn-primary mr-2 page-button current-page-button"; // Added 'pagination-button' and 'current-page-button' classes
   div.appendChild(currentPageButton);
-}
+}