From dbea58a978833e96f0b85b3d59c05ed5a2ef654c Mon Sep 17 00:00:00 2001
From: Hyko <punk.flag8609@fastmail.com>
Date: Thu, 23 Apr 2026 18:21:21 -0400
Subject: [PATCH] refactor(auth): replace anchor navigation links with Button
 components and improve auth page styling

---
 src/features/auth/AuthPage.server.js          |  2 +-
 .../auth/pages/ForgotPasswordPage.client.js   |  1 +
 src/features/auth/pages/LoginPage.client.js   | 20 +++++++++----------
 .../auth/pages/RegisterPage.client.js         | 20 +++++++++----------
 .../auth/pages/ResetPasswordPage.client.js    |  1 +
 src/shared/components/Button.js               | 18 ++++++++---------
 6 files changed, 30 insertions(+), 32 deletions(-)

diff --git a/src/features/auth/AuthPage.server.js b/src/features/auth/AuthPage.server.js
index 4e48f27..47cb7c4 100644
--- a/src/features/auth/AuthPage.server.js
+++ b/src/features/auth/AuthPage.server.js
@@ -14,7 +14,7 @@ export default async function AuthPage({ params, searchParams }) {
   const session = await getSession();
 
   return (
-    <div className="min-h-screen flex items-center justify-center p-4 md:p-8">
+    <div className="min-h-screen flex items-center justify-center p-4 md:p-8 bg-neutral-50 dark:bg-black">
       <div className="max-w-md w-full">
         <AuthPageClient
           params={params}
diff --git a/src/features/auth/pages/ForgotPasswordPage.client.js b/src/features/auth/pages/ForgotPasswordPage.client.js
index 1f7a39d..3ccf47a 100644
--- a/src/features/auth/pages/ForgotPasswordPage.client.js
+++ b/src/features/auth/pages/ForgotPasswordPage.client.js
@@ -108,6 +108,7 @@ export default function ForgotPasswordPage({ onSubmit, onNavigate, currentUser =
         <Button
           type="submit"
           variant="primary"
+          size="lg"
           loading={isLoading}
           disabled={!!success || !!currentUser}
           className="w-full mt-2"
diff --git a/src/features/auth/pages/LoginPage.client.js b/src/features/auth/pages/LoginPage.client.js
index 8369b62..71493fa 100644
--- a/src/features/auth/pages/LoginPage.client.js
+++ b/src/features/auth/pages/LoginPage.client.js
@@ -151,6 +151,7 @@ export default function LoginPage({ onSubmit, onNavigate, onSetSessionCookie, re
         <Button
           type="button"
           variant="primary"
+          size="lg"
           loading={isLoading}
           disabled={!!success || !!currentUser}
           onClick={handleSubmit}
@@ -160,18 +161,15 @@ export default function LoginPage({ onSubmit, onNavigate, onSetSessionCookie, re
         </Button>
       </div>
 
-      <div className={`mt-6 text-center transition-opacity duration-200 ${currentUser ? 'opacity-50 pointer-events-none' : ''}`}>
-        <a
-          href="#"
-          onClick={(e) => {
-            e.preventDefault();
-            if (!currentUser) onNavigate('register');
-          }}
-          className="group flex items-center justify-center gap-2"
+      <div className={`mt-6 flex justify-center transition-opacity duration-200 ${currentUser ? 'opacity-50 pointer-events-none' : ''}`}>
+        <Button
+          type="button"
+          variant="ghost"
+          disabled={!!currentUser}
+          onClick={() => { if (!currentUser) onNavigate('register'); }}
         >
-          <span className="text-sm text-neutral-600 dark:text-neutral-400">Pas de compte ? </span>
-          <span className="text-sm text-neutral-900 group-hover:text-neutral-600 font-medium transition-colors duration-200 dark:text-white dark:group-hover:text-neutral-300">S'inscrire</span>
-        </a>
+          Pas de compte ? S'inscrire
+        </Button>
       </div>
     </Card>
   );
diff --git a/src/features/auth/pages/RegisterPage.client.js b/src/features/auth/pages/RegisterPage.client.js
index 6da7dbb..dbd745b 100644
--- a/src/features/auth/pages/RegisterPage.client.js
+++ b/src/features/auth/pages/RegisterPage.client.js
@@ -208,6 +208,7 @@ export default function RegisterPage({ onSubmit, onNavigate, currentUser = null
         <Button
           type="submit"
           variant="primary"
+          size="lg"
           loading={isLoading}
           disabled={!!success || !!currentUser || !isFormValid()}
           className="w-full mt-2"
@@ -216,18 +217,15 @@ export default function RegisterPage({ onSubmit, onNavigate, currentUser = null
         </Button>
       </form>
 
-      <div className={`mt-6 text-center transition-opacity duration-200 ${currentUser ? 'opacity-50 pointer-events-none' : ''}`}>
-        <a
-          href="#"
-          onClick={(e) => {
-            e.preventDefault();
-            if (!currentUser) onNavigate('login');
-          }}
-          className="group flex items-center justify-center gap-2"
+      <div className={`mt-6 flex justify-center transition-opacity duration-200 ${currentUser ? 'opacity-50 pointer-events-none' : ''}`}>
+        <Button
+          type="button"
+          variant="ghost"
+          disabled={!!currentUser}
+          onClick={() => { if (!currentUser) onNavigate('login'); }}
         >
-          <span className="text-sm text-neutral-600 dark:text-neutral-400">Vous avez déjà un compte ? </span>
-          <span className="text-sm text-neutral-900 group-hover:text-neutral-600 font-medium transition-colors duration-200 dark:text-white dark:group-hover:text-neutral-300">Se connecter</span>
-        </a>
+          Vous avez déjà un compte ? Se connecter
+        </Button>
       </div>
     </Card>
   );
diff --git a/src/features/auth/pages/ResetPasswordPage.client.js b/src/features/auth/pages/ResetPasswordPage.client.js
index 9ee80ff..56eb3e0 100644
--- a/src/features/auth/pages/ResetPasswordPage.client.js
+++ b/src/features/auth/pages/ResetPasswordPage.client.js
@@ -129,6 +129,7 @@ export default function ResetPasswordPage({ onSubmit, onNavigate, email, token }
         <Button
           type="submit"
           variant="primary"
+          size="lg"
           loading={isLoading}
           disabled={!!success || !isFormValid()}
           className="w-full mt-2"
diff --git a/src/shared/components/Button.js b/src/shared/components/Button.js
index 38e011b..8923864 100644
--- a/src/shared/components/Button.js
+++ b/src/shared/components/Button.js
@@ -27,29 +27,29 @@ const Button = ({
     };
 
     const sizes = {
-        sm: '',
+        sm: 'px-[10px] py-[5px] text-[12px] gap-1',
         md: 'px-[12px] py-[7px] text-[13px] gap-1.5',
-        lg: ''
+        lg: 'px-[14px] py-[9px] text-[14px] gap-2'
     };
 
     const iconOnlySizes = {
-        sm: '',
+        sm: 'p-[5px] text-[12px]',
         md: 'p-[7px] text-[13px]',
-        lg: ''
+        lg: 'p-[9px] text-[14px]'
     };
 
     const isIconOnly = icon && !children;
-    
+
     const iconSizes = {
-        sm: '',
+        sm: 'w-3.5 h-3.5',
         md: 'w-4 h-4',
-        lg: ''
+        lg: 'w-4.5 h-4.5'
     };
 
     const textSizes = {
-        sm: '',
+        sm: 'min-h-3.5',
         md: 'min-h-4',
-        lg: ''
+        lg: 'min-h-4.5'
     };
 
     const LoadingSpinner = () => (