From ce0cea40fe9d17f6d4a9f2d906c805323da7f87e Mon Sep 17 00:00:00 2001
From: Nevo David <me@nevos.io>
Date: Mon, 6 Jan 2025 02:18:15 +0700
Subject: [PATCH] feat: media component

---
 .../src/components/media/media.component.tsx         | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/apps/frontend/src/components/media/media.component.tsx b/apps/frontend/src/components/media/media.component.tsx
index da8540bbd..bc4772ce6 100644
--- a/apps/frontend/src/components/media/media.component.tsx
+++ b/apps/frontend/src/components/media/media.component.tsx
@@ -45,7 +45,7 @@ export const Pagination: FC<{
   }, [totalPages]);
 
   return (
-    <ul className="flex flex-row items-center gap-1">
+    <ul className="flex flex-row items-center gap-1 justify-center mt-[15px]">
       <li className={clsx(current === 0 && 'opacity-20 pointer-events-none')}>
         <div
           className="cursor-pointer inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 h-10 px-4 py-2 gap-1 pl-2.5 text-gray-400 hover:text-white border-[#1F1F1F] hover:bg-forth"
@@ -421,14 +421,10 @@ export const MediaBox: FC<{
                     )}
                   </div>
                 ))}
-              {(pages || 0) > 1 && (
-                <Pagination
-                  current={page}
-                  totalPages={pages}
-                  setPage={setPage}
-                />
-              )}
             </div>
+            {(pages || 0) > 1 && (
+              <Pagination current={page} totalPages={pages} setPage={setPage} />
+            )}
           </div>
         </DropFiles>
       </div>