fix: pagination theming (#114)

liftedinit · Dec 4, 2024 · 935c277 · 935c277
1 parent 4fa85a8
commit 935c277
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 13 deletions.
diff --git a/components/bank/components/historyBox.tsx b/components/bank/components/historyBox.tsx
@@ -172,7 +172,7 @@ export function HistoryBox({
             <button
               onClick={() => setCurrentPage(prev => Math.max(1, prev - 1))}
               disabled={currentPage === 1 || isLoading}
-              className="p-2 hover:bg-[#FFFFFF1A] rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+              className="p-2 hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
             >
               ‹
             </button>
@@ -192,23 +192,27 @@ export function HistoryBox({
                     className={`w-8 h-8 flex items-center justify-center rounded-lg transition-colors
                       ${
                         currentPage === pageNum
-                          ? 'bg-[#FFFFFF1A] text-white'
-                          : 'hover:bg-[#FFFFFF1A]'
+                          ? 'bg-[#0000001A] dark:bg-[#FFFFFF1A] text-black dark:text-white'
+                          : 'hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white'
                       }`}
                   >
                     {pageNum}
                   </button>
                 );
               } else if (pageNum === currentPage - 2 || pageNum === currentPage + 2) {
-                return <span key={pageNum}>...</span>;
+                return (
+                  <span className="text-black dark:text-white" key={pageNum}>
+                    ...
+                  </span>
+                );
               }
               return null;
             })}
 
             <button
               onClick={() => setCurrentPage(prev => Math.min(totalPages, prev + 1))}
               disabled={currentPage === totalPages || isLoading}
-              className="p-2 hover:bg-[#FFFFFF1A] rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+              className="p-2 hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
             >
               ›
             </button>

diff --git a/components/factory/components/MyDenoms.tsx b/components/factory/components/MyDenoms.tsx
@@ -253,7 +253,7 @@ export default function MyDenoms({
                     setCurrentPage(prev => Math.max(1, prev - 1));
                   }}
                   disabled={currentPage === 1 || isLoading}
-                  className="p-2 hover:bg-[#FFFFFF1A] rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+                  className="p-2 hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
                   aria-label="Previous page"
                 >
                   ‹
@@ -273,8 +273,8 @@ export default function MyDenoms({
                           e.stopPropagation();
                           setCurrentPage(pageNum);
                         }}
-                        className={`w-8 h-8 flex items-center justify-center rounded-lg transition-colors
-                          ${currentPage === pageNum ? 'bg-[#FFFFFF1A] text-white' : 'hover:bg-[#FFFFFF1A]'}`}
+                        className={`w-8 h-8 flex items-center justify-center rounded-lg transition-colors text-black dark:text-white 
+                          ${currentPage === pageNum ? 'bg-[#0000001A] dark:bg-[#FFFFFF1A]' : 'hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A]'}`}
                         aria-label={`Page ${pageNum}`}
                         aria-current={currentPage === pageNum ? 'page' : undefined}
                       >
@@ -297,7 +297,7 @@ export default function MyDenoms({
                     setCurrentPage(prev => Math.min(totalPages, prev + 1));
                   }}
                   disabled={currentPage === totalPages || isLoading}
-                  className="p-2 hover:bg-[#FFFFFF1A] rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+                  className="p-2 hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
                   aria-label="Next page"
                 >
                   ›

diff --git a/components/groups/components/myGroups.tsx b/components/groups/components/myGroups.tsx
@@ -215,7 +215,7 @@ export function YourGroups({
                       setCurrentPage(prev => Math.max(1, prev - 1));
                     }}
                     disabled={currentPage === 1 || isLoading}
-                    className="p-2 hover:bg-[#FFFFFF1A] rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+                    className="p-2 hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
                     aria-label="Previous page"
                   >
                     ‹
@@ -235,8 +235,8 @@ export function YourGroups({
                             e.stopPropagation();
                             setCurrentPage(pageNum);
                           }}
-                          className={`w-8 h-8 flex items-center justify-center rounded-lg transition-colors
-                    ${currentPage === pageNum ? 'bg-[#FFFFFF1A] text-white' : 'hover:bg-[#FFFFFF1A]'}`}
+                          className={`w-8 h-8 flex items-center justify-center rounded-lg transition-colors text-black dark:text-white
+                            ${currentPage === pageNum ? 'bg-[#0000001A] dark:bg-[#FFFFFF1A]' : 'hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A]'}`}
                           aria-label={`Page ${pageNum}`}
                           aria-current={currentPage === pageNum ? 'page' : undefined}
                         >
@@ -259,7 +259,7 @@ export function YourGroups({
                       setCurrentPage(prev => Math.min(totalPages, prev + 1));
                     }}
                     disabled={currentPage === totalPages || isLoading}
-                    className="p-2 hover:bg-[#FFFFFF1A] rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+                    className="p-2 hover:bg-[#0000001A] dark:hover:bg-[#FFFFFF1A] text-black dark:text-white rounded-lg transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
                     aria-label="Next page"
                   >
                     ›