fix gradients
This commit is contained in:
@@ -8,38 +8,42 @@ templ LoginPage() {
|
||||
<div class="min-h-screen flex items-center justify-center px-4">
|
||||
<div class="w-full max-w-md">
|
||||
<!-- Logo and Title -->
|
||||
<div class="text-center mb-8">
|
||||
<div class="w-16 h-16 bg-gradient-to-br from-primary to-accent rounded-2xl flex items-center justify-center mx-auto mb-4 shadow-lg shadow-primary/25">
|
||||
<i class="fas fa-database text-white text-2xl"></i>
|
||||
<div class="text-center mb-10">
|
||||
<div class="relative inline-block mb-6">
|
||||
<div class="w-20 h-20 bg-gradient-to-br from-violet-500 via-purple-500 to-fuchsia-500 rounded-3xl flex items-center justify-center shadow-2xl shadow-violet-500/30 animate-float">
|
||||
<i class="fas fa-database text-white text-3xl"></i>
|
||||
</div>
|
||||
<div class="absolute -bottom-1 -right-1 w-6 h-6 bg-emerald-400 rounded-full border-4 border-white dark:border-slate-950 animate-pulse"></div>
|
||||
</div>
|
||||
<h1 class="text-2xl font-bold text-white mb-2">ZFS Backup Admin</h1>
|
||||
<p class="text-gray-400">Sign in to manage your backups</p>
|
||||
<h1 class="text-3xl font-bold text-slate-900 dark:text-white mb-3">ZFS Backup Admin</h1>
|
||||
<p class="text-slate-500 dark:text-slate-400 font-medium">Sign in to manage your backups</p>
|
||||
</div>
|
||||
|
||||
<!-- Login Form -->
|
||||
<div class="bg-surface rounded-2xl border border-gray-700 p-8 shadow-xl">
|
||||
<div class="bg-white/90 dark:bg-slate-900/80 backdrop-blur-xl rounded-3xl border border-slate-200 dark:border-slate-700/50 p-8 shadow-xl dark:shadow-none transition-colors duration-300">
|
||||
<form id="login-form">
|
||||
@components.FormInput("username", "Username", "text", "", true)
|
||||
@components.FormInput("password", "Password", "password", "", true)
|
||||
<button
|
||||
type="submit"
|
||||
class="w-full mt-2 px-4 py-3 bg-primary hover:bg-primary-dark text-white rounded-lg transition-all flex items-center justify-center gap-2 shadow-lg shadow-primary/25"
|
||||
class="w-full mt-4 px-4 py-4 bg-gradient-to-r from-violet-600 to-fuchsia-600 hover:from-violet-500 hover:to-fuchsia-500 text-white rounded-xl transition-all duration-300 flex items-center justify-center gap-2 shadow-lg shadow-violet-500/25 hover:shadow-violet-500/40 font-semibold text-lg"
|
||||
>
|
||||
<i class="fas fa-sign-in-alt"></i>
|
||||
Sign In
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="mt-6 pt-6 border-t border-gray-700 text-center">
|
||||
<p class="text-gray-500 text-sm">
|
||||
<i class="fas fa-info-circle mr-1"></i>
|
||||
Default: <span class="text-gray-400">admin / admin123</span>
|
||||
<div class="mt-8 pt-6 border-t border-slate-200 dark:border-slate-700/50 text-center">
|
||||
<p class="text-slate-500 dark:text-slate-500 text-sm flex items-center justify-center gap-2">
|
||||
<i class="fas fa-info-circle text-violet-500 dark:text-violet-400"></i>
|
||||
Default: <span class="text-slate-700 dark:text-slate-300 font-mono bg-slate-100 dark:bg-slate-800 px-2 py-0.5 rounded">admin / admin123</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<p class="text-center text-gray-600 text-xs mt-8">
|
||||
<p class="text-center text-slate-400 dark:text-slate-600 text-xs mt-10 flex items-center justify-center gap-2">
|
||||
<i class="fas fa-shield-halved text-violet-400 dark:text-violet-500/50"></i>
|
||||
Powered by ZFS Backup System
|
||||
</p>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user