feat(auth): implement multi-step authentication flow with UI

This commit replaces the placeholder login page with a comprehensive, multi-step authentication system. It introduces a new `AuthPage` that orchestrates the user flow between login, signup, and OTP verification.

- **Login Form**: Supports both email and WhatsApp credentials, with input validation and API integration.
- **Signup Form**: Includes fields for full name, email, and WhatsApp, with real-time password strength validation.
- **OTP Form**: Provides a view for users to verify their account after signup.
- **UI/UX**: The entire authentication experience is restyled with a new background, Poppins font, custom brand colors, and improved form components for a polished look and feel.
- **Dependencies**: Adds `axios` for handling API requests to the backend.

BREAKING CHANGE: The `LoginPage` component has been deleted and is replaced by the new `AuthPage` component. All references to `LoginPage` must be updated.
This commit is contained in:
Emmanuel Rizky
2025-08-02 15:26:12 +07:00
parent c845ea5827
commit c9e7daf801
11 changed files with 759 additions and 74 deletions

View File

@@ -5,7 +5,21 @@ export default {
"./src/**/*.{js,ts,jsx,tsx}",
],
theme: {
extend: {},
extend: {
colors: {
'brand-green': '#4A5D23',
'brand-brown': '#8B4513',
'brand-light': '#F5F5DC',
'brand-gray': '#A9A9A9',
'brand-orange': '#D97706', // Adventure Orange
},
fontFamily: {
sans: ['Poppins', 'sans-serif'],
},
backgroundImage: {
'login-bg': "url('https://images.unsplash.com/photo-1515444744559-7be63e1600de?q=80&w=1170&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D')",
}
},
},
plugins: [],
}