Spaces:
Runtime error
Runtime error
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta content="width=device-width, initial-scale=1.0" name="viewport" /> | |
| <title>Admin Login - SWIFT QUERY</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap" rel="stylesheet" /> | |
| <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined" rel="stylesheet" /> | |
| <script src="https://cdn.tailwindcss.com?plugins=forms,typography"></script> | |
| <script> | |
| tailwind.config = { | |
| darkMode: "class", | |
| theme: { | |
| extend: { | |
| colors: { | |
| primary: "#e67e22", | |
| "background-light": "#fef3e9", | |
| "background-dark": "#3c2a1a", | |
| }, | |
| fontFamily: { | |
| display: ["Lora", "serif"], | |
| }, | |
| borderRadius: { | |
| DEFAULT: "1rem", | |
| }, | |
| }, | |
| }, | |
| }; | |
| </script> | |
| <style> | |
| .glass-effect { | |
| backdrop-filter: blur(10px); | |
| -webkit-backdrop-filter: blur(10px) | |
| } | |
| .bg-gradient-warm { | |
| background-image: linear-gradient(to right, #f8a65c, #d97706) | |
| } | |
| .bg-gradient-warm:hover { | |
| background-image: linear-gradient(to right, #f9b170, #e67e22) | |
| } | |
| body { | |
| background-image: url(https://images.unsplash.com/photo-1576091160550-2173dba999ef?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D); | |
| background-size: cover; | |
| background-position: center | |
| } | |
| </style> | |
| </head> | |
| <body | |
| class="font-display bg-background-light dark:bg-background-dark text-slate-700 dark:text-slate-300 min-h-screen flex flex-col items-center justify-between p-4"> | |
| <header | |
| class="w-full max-w-7xl mx-auto p-4 glass-effect bg-white/30 dark:bg-black/20 rounded-xl border border-white/20 dark:border-white/10 shadow-lg"> | |
| <nav class="flex justify-between items-center"> | |
| <div class="flex items-center gap-3"> | |
| <div class="bg-white/40 dark:bg-white/20 p-2 rounded-lg"> | |
| <img alt="SWIFT QUERY logo" class="h-6 w-6" | |
| src="https://lh3.googleusercontent.com/aida-public/AB6AXuAo-0VjrEABAroA7y5_lx9DaLNKygExss7Nm-JDYOskVgALV9qdaAPI5i-PZTURZZgEjLr4rtqVCuuFvo2lxrhcPFo5rzzmjEBkaHow8xuV6nOcIWrotNl5ObyyAPl_SXiJf_z6PYLVARd_eU5xPHZZkkrOyx-HUjixqFKF3U_Mso6NjNK16mUpN9HcmNHUPFD1ZbvGwtvyAahfGscP0U9TG7sOTE9543xi7_Fsj819eadeslFzYJzPsdXDFzBMNa_8dNSvC_ka-HY" /> | |
| </div> | |
| <span class="font-semibold text-slate-800 dark:text-white text-lg">Swift Query</span> | |
| </div> | |
| <div> | |
| <a href="/" class="text-slate-800 dark:text-white font-medium hover:text-primary transition-colors">Back to | |
| Home</a> | |
| </div> | |
| </nav> | |
| </header> | |
| <main class="flex-grow flex items-center justify-center w-full"> | |
| <div | |
| class="w-full max-w-md mx-auto p-8 glass-effect bg-white/40 dark:bg-black/30 rounded-2xl border border-white/30 dark:border-white/10 shadow-2xl"> | |
| <div class="text-center mb-8"> | |
| <h1 class="text-3xl font-bold text-slate-900 dark:text-white">Admin Login</h1> | |
| <p class="text-slate-700 dark:text-slate-300 mt-2">Access the admin dashboard.</p> | |
| </div> | |
| <form action="{{ url_for('admin.login') }}" class="space-y-6" method="POST"> | |
| <div> | |
| <div class="relative"> | |
| <span | |
| class="material-icons-outlined absolute left-4 top-1/2 -translate-y-1/2 text-slate-500 dark:text-slate-400">person_outline</span> | |
| <input | |
| class="w-full pl-12 pr-4 py-3 rounded-lg bg-white/50 dark:bg-black/20 border border-white/30 dark:border-white/10 focus:ring-2 focus:ring-primary focus:border-primary transition-all placeholder-slate-500 dark:placeholder-slate-400 text-slate-800 dark:text-white shadow-sm" | |
| id="username" name="username" placeholder="Username" required="" type="text" /> | |
| </div> | |
| </div> | |
| <div> | |
| <div class="relative"> | |
| <span | |
| class="material-icons-outlined absolute left-4 top-1/2 -translate-y-1/2 text-slate-500 dark:text-slate-400">lock_outline</span> | |
| <input | |
| class="w-full pl-12 pr-12 py-3 rounded-lg bg-white/50 dark:bg-black/20 border border-white/30 dark:border-white/10 focus:ring-2 focus:ring-primary focus:border-primary transition-all placeholder-slate-500 dark:placeholder-slate-400 text-slate-800 dark:text-white shadow-sm" | |
| id="password" name="password" placeholder="Password" required="" type="password" /> | |
| <button class="absolute right-4 top-1/2 -translate-y-1/2 text-slate-500 dark:text-slate-400" type="button"> | |
| <span class="material-icons-outlined">visibility_off</span> | |
| </button> | |
| </div> | |
| </div> | |
| <div> | |
| <button | |
| class="w-full bg-gradient-warm text-white font-bold py-3 px-4 rounded-full shadow-lg hover:shadow-xl transition-all text-lg focus:outline-none focus:ring-4 focus:ring-orange-300 dark:focus:ring-orange-800" | |
| type="submit"> | |
| Login | |
| </button> | |
| </div> | |
| </form> | |
| {% with messages = get_flashed_messages() %} | |
| {% if messages %} | |
| <ul class="text-red-500"> | |
| {% for message in messages %} | |
| <li>{{ message }}</li> | |
| {% endfor %} | |
| </ul> | |
| {% endif %} | |
| {% endwith %} | |
| </div> | |
| </main> | |
| <footer | |
| class="w-full max-w-7xl mx-auto p-4 text-center glass-effect bg-white/20 dark:bg-black/20 rounded-xl border border-white/20 dark:border-white/10 shadow-lg"> | |
| <p class="text-sm text-slate-800 dark:text-slate-200">Copyright © 2025 SWIFT QUERY. All rights reserved.</p> | |
| </footer> | |
| </body> | |
| </html> |