From 87da78286c951105626092415bec0714839ca335 Mon Sep 17 00:00:00 2001
From: Corban-Lee <corbz.jones@gmail.com>
Date: Thu, 24 Apr 2025 12:41:59 +0100
Subject: [PATCH] feat: added footer with pagination to feed table

---
 src/client/public/css/main.css   | 14 ++++++++++++++
 src/client/views/guild/feeds.ejs | 25 +++++++++++++++++++++++++
 2 files changed, 39 insertions(+)

diff --git a/src/client/public/css/main.css b/src/client/public/css/main.css
index fff18cf..de7e10b 100644
--- a/src/client/public/css/main.css
+++ b/src/client/public/css/main.css
@@ -45,6 +45,20 @@
     @apply border-none bg-gray-50 dark:bg-neutral-800;
 }
 
+.cj-table-footer {
+    @apply px-6 py-4 gap-3 flex justify-between items-center border-t
+    border-gray-200 dark:border-neutral-700;
+}
+
+.cj-table-paging-btn {
+    @apply py-2 px-3 inline-flex items-center gap-x-2 text-sm font-medium
+        rounded-lg border border-gray-200 bg-white text-gray-800
+        shadow-xs hover:bg-gray-50 focus:outline-hidden focus:bg-gray-50
+        disabled:opacity-50 disabled:pointer-events-none dark:bg-neutral-800
+        dark:border-neutral-700 dark:text-white dark:hover:bg-neutral-700
+        dark:focus:bg-neutral-700;
+}
+
 .cj-table-checkbox {
     @apply form-checkbox shrink-0 disabled:opacity-50 rounded-sm 
         text-blue-600 focus:ring-blue-500 border-gray-300
diff --git a/src/client/views/guild/feeds.ejs b/src/client/views/guild/feeds.ejs
index 6ec10ab..44e482e 100644
--- a/src/client/views/guild/feeds.ejs
+++ b/src/client/views/guild/feeds.ejs
@@ -101,6 +101,31 @@
                         </table>
                      </div>
 
+                     <div class="cj-table-footer">
+                        <div class="max-w-sm space-y-3">
+                            select
+                        </div>
+                        <div class="sm:inline-flex items-center gap-x-2" data-hs-datatable-info="">
+                            <p class="text-sm text-gray dark:text-neutral-400">
+                                <span data-hs-datatable-info-from=""></span>
+                                to
+                                <span data-hs-datatable-info-to=""></span>
+                                of
+                                <span data-hs-datatable-info-length=""></span>
+                            </p>
+                        </div>
+                        <div class="inline-flex gap-x-2" data-hs-datatable-paging="">
+                            <button type="button" class="cj-table-paging-btn" data-hs-datatable-paging-prev="">
+                                <svg class="shrink-0 size-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
+                                Prev
+                            </button>
+                            <div class="flex items-center space-x-1 " data-hs-datatable-paging-pages=""></div>
+                            <button type="button" class="cj-table-paging-btn" data-hs-datatable-paging-next="">
+                                Next
+                                <svg class="shrink-0 size-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
+                            </button>
+                        </div>
+                     </div>
                 </div>
             </div>
         </div>