init
This commit is contained in:
98
public/modules/auth/login.html
Normal file
98
public/modules/auth/login.html
Normal file
@@ -0,0 +1,98 @@
|
||||
<!-- Auth Module - Login/Register Screen -->
|
||||
<div id="authModule" class="auth-module hidden">
|
||||
<!-- Login Screen -->
|
||||
<div id="loginScreen" class="fixed inset-0 z-50 flex items-center justify-center">
|
||||
<div class="absolute inset-0 bg-gradient-to-br from-slate-900 via-blue-900 to-slate-900 dark:from-slate-950 dark:via-blue-950 dark:to-slate-950"></div>
|
||||
|
||||
<div class="relative w-full max-w-md px-4 sm:px-0">
|
||||
<div class="glass-panel glass-panel-light dark:glass-panel-dark rounded-2xl shadow-2xl p-8">
|
||||
<!-- Header -->
|
||||
<div class="text-center mb-8">
|
||||
<div class="inline-flex items-center justify-center w-16 h-16 bg-gradient-to-br from-blue-600 to-blue-700 rounded-2xl mb-4 shadow-lg shadow-blue-600/30">
|
||||
<i data-lucide="database" class="w-8 h-8 text-white"></i>
|
||||
</div>
|
||||
<h1 class="text-2xl sm:text-3xl font-bold text-slate-900 dark:text-white">PostgreSQL SensoLab</h1>
|
||||
<p class="text-slate-500 dark:text-slate-400 mt-2 text-sm sm:text-base">Управление базой данных</p>
|
||||
</div>
|
||||
|
||||
<!-- Tab Navigation -->
|
||||
<div class="flex gap-2 mb-8 bg-slate-100 dark:bg-slate-800 p-1 rounded-lg">
|
||||
<button class="auth-tab-btn active flex-1 py-2 px-4 rounded-md font-medium transition-all text-sm sm:text-base" data-tab="login">
|
||||
Вход
|
||||
</button>
|
||||
<button class="auth-tab-btn flex-1 py-2 px-4 rounded-md font-medium transition-all text-sm sm:text-base" data-tab="register">
|
||||
Регистрация
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Login Form -->
|
||||
<form id="loginForm" class="auth-form space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">
|
||||
Email или логин
|
||||
</label>
|
||||
<input type="text" id="loginEmail" class="input-field" placeholder="admin@example.com" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">
|
||||
Пароль
|
||||
</label>
|
||||
<input type="password" id="loginPassword" class="input-field" placeholder="••••••••" required>
|
||||
</div>
|
||||
<button type="submit" class="w-full btn btn-primary mt-6">
|
||||
<span class="login-text">Войти</span>
|
||||
<div class="login-loader hidden" style="width: 20px; height: 20px; border: 2px solid rgba(255,255,255,0.3); border-top: 2px solid white; border-radius: 50%; animation: spin 1s linear infinite;"></div>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<!-- Register Form -->
|
||||
<form id="registerForm" class="auth-form hidden space-y-4">
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">
|
||||
Полное имя
|
||||
</label>
|
||||
<input type="text" id="registerName" class="input-field" placeholder="Иван Петров" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">
|
||||
Email
|
||||
</label>
|
||||
<input type="email" id="registerEmail" class="input-field" placeholder="admin@example.com" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">
|
||||
Пароль
|
||||
</label>
|
||||
<input type="password" id="registerPassword" class="input-field" placeholder="••••••••" required>
|
||||
</div>
|
||||
<div>
|
||||
<label class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">
|
||||
Подтверждение пароля
|
||||
</label>
|
||||
<input type="password" id="registerPasswordConfirm" class="input-field" placeholder="••••••••" required>
|
||||
</div>
|
||||
<button type="submit" class="w-full btn btn-primary mt-6">
|
||||
<span class="register-text">Создать аккаунт</span>
|
||||
<div class="register-loader hidden" style="width: 20px; height: 20px; border: 2px solid rgba(255,255,255,0.3); border-top: 2px solid white; border-radius: 50%; animation: spin 1s linear infinite;"></div>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<!-- Error Message -->
|
||||
<div id="authError" class="mt-4 p-4 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg text-red-600 dark:text-red-400 text-sm hidden flex items-center gap-2">
|
||||
<i data-lucide="alert-circle" class="w-4 h-4"></i>
|
||||
<span id="authErrorText"></span>
|
||||
</div>
|
||||
|
||||
<!-- Demo Info -->
|
||||
<div class="mt-6 p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg text-blue-600 dark:text-blue-400 text-xs sm:text-sm">
|
||||
<p class="font-semibold mb-2 flex items-center gap-2">
|
||||
<i data-lucide="info" class="w-4 h-4"></i>
|
||||
Демо учетные данные:
|
||||
</p>
|
||||
<p>Email: <code class="bg-white/50 dark:bg-slate-900 px-2 py-1 rounded text-xs">admin@example.com</code></p>
|
||||
<p>Пароль: <code class="bg-white/50 dark:bg-slate-900 px-2 py-1 rounded text-xs">admin123</code></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user