| | <!DOCTYPE html> |
| | <html lang="en"> |
| | <head> |
| | <meta charset="UTF-8"> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | <title>Register | EduSphere</title> |
| | <link rel="stylesheet" href="style.css"> |
| | <script src="https://cdn.tailwindcss.com"></script> |
| | <script src="https://unpkg.com/feather-icons"></script> |
| | <script src="components/navbar.js"></script> |
| | </head> |
| | <body class="bg-gray-50"> |
| | <custom-navbar></custom-navbar> |
| | |
| | <main class="container mx-auto px-4 py-12"> |
| | <div class="max-w-md mx-auto bg-white rounded-xl shadow-md overflow-hidden p-8"> |
| | <div class="text-center mb-8"> |
| | <h1 class="text-3xl font-bold text-primary">Create Account</h1> |
| | <p class="text-gray-600 mt-2">Join our learning community</p> |
| | </div> |
| | |
| | <form class="space-y-6"> |
| | <div> |
| | <label for="fullname" class="block text-sm font-medium text-gray-700 mb-1">Full Name</label> |
| | <input type="text" id="fullname" name="fullname" required |
| | class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> |
| | </div> |
| | |
| | <div> |
| | <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email Address</label> |
| | <input type="email" id="email" name="email" required |
| | class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> |
| | </div> |
| | |
| | <div> |
| | <label for="password" class="block text-sm font-medium text-gray-700 mb-1">Password</label> |
| | <input type="password" id="password" name="password" required |
| | class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> |
| | </div> |
| | |
| | <div> |
| | <label for="confirm-password" class="block text-sm font-medium text-gray-700 mb-1">Confirm Password</label> |
| | <input type="password" id="confirm-password" name="confirm-password" required |
| | class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"> |
| | </div> |
| | |
| | <div class="flex items-center"> |
| | <input type="checkbox" id="terms" name="terms" required |
| | class="h-4 w-4 text-primary focus:ring-primary border-gray-300 rounded"> |
| | <label for="terms" class="ml-2 block text-sm text-gray-700"> |
| | I agree to the <a href="#" class="text-primary hover:text-secondary">Terms of Service</a> and <a href="#" class="text-primary hover:text-secondary">Privacy Policy</a> |
| | </label> |
| | </div> |
| | |
| | <button type="submit" |
| | class="w-full bg-primary hover:bg-secondary text-white py-3 px-4 rounded-lg font-medium transition-all"> |
| | Create Account |
| | </button> |
| | |
| | <div class="text-center text-sm text-gray-600 mt-4"> |
| | Already have an account? <a href="/login.html" class="text-primary hover:text-secondary font-medium">Login</a> |
| | </div> |
| | </form> |
| | </div> |
| | </main> |
| |
|
| | <script> |
| | feather.replace(); |
| | </script> |
| | </body> |
| | </html> |
