| | <!DOCTYPE html> |
| | <html lang="en"> |
| | <head> |
| | <meta charset="UTF-8"> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | <title>Admin Login | ShopSphere</title> |
| | <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> |
| | <link rel="stylesheet" href="style.css"> |
| | <script src="https://cdn.tailwindcss.com"></script> |
| | <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| | <script src="https://unpkg.com/feather-icons"></script> |
| | </head> |
| | <body class="bg-gray-100 min-h-screen flex items-center justify-center"> |
| | <div class="w-full max-w-md"> |
| | <div class="bg-white rounded-lg shadow-xl overflow-hidden"> |
| | <div class="p-8"> |
| | <div class="text-center mb-8"> |
| | <h1 class="text-3xl font-bold text-gray-900 mb-2">ShopSphere Admin</h1> |
| | <p class="text-gray-600">Enter your credentials to access the admin panel</p> |
| | </div> |
| | |
| | <form id="loginForm" class="space-y-6"> |
| | <div> |
| | <label for="username" class="block text-sm font-medium text-gray-700 mb-1">Username</label> |
| | <input type="text" id="username" required class="input-field w-full" placeholder="admin"> |
| | </div> |
| | |
| | <div> |
| | <label for="password" class="block text-sm font-medium text-gray-700 mb-1">Password</label> |
| | <input type="password" id="password" required class="input-field w-full" placeholder="••••••••"> |
| | </div> |
| | |
| | <div class="flex items-center justify-between"> |
| | <div class="flex items-center"> |
| | <input id="remember-me" name="remember-me" type="checkbox" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500 border-gray-300 rounded"> |
| | <label for="remember-me" class="ml-2 block text-sm text-gray-900">Remember me</label> |
| | </div> |
| | </div> |
| | |
| | <div> |
| | <button type="submit" class="w-full bg-indigo-600 hover:bg-indigo-700 text-white py-3 px-4 rounded-md font-medium transition duration-300"> |
| | Sign in |
| | </button> |
| | </div> |
| | </form> |
| | </div> |
| | <div class="px-8 py-4 bg-gray-50 border-t border-gray-200 text-center"> |
| | <p class="text-sm text-gray-600"> |
| | Forgot your password? <a href="#" class="text-indigo-600 hover:text-indigo-500 font-medium">Reset password</a> |
| | </p> |
| | </div> |
| | </div> |
| | </div> |
| |
|
| | <script src="script.js"></script> |
| | <script> |
| | feather.replace(); |
| | |
| | document.getElementById('loginForm').addEventListener('submit', function(e) { |
| | e.preventDefault(); |
| | const username = document.getElementById('username').value; |
| | const password = document.getElementById('password').value; |
| | |
| | if (adminLogin(username, password)) { |
| | window.location.href = '/admin-dashboard.html'; |
| | } else { |
| | alert('Invalid credentials. Please try again.'); |
| | } |
| | }); |
| | </script> |
| | </body> |
| | </html> |