Files
WhatIDo/public/login.html
T

42 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Вход — Админ-панель</title>
<style>
*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#f5f5f5;--card:#fff;--border:#e5e5e5;--accent:#2563eb;--text:#171717;--muted:#737373;--radius:12px}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100dvh;display:flex;align-items:center;justify-content:center}
.login{max-width:320px;width:100%;text-align:center;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px 32px}
.login .brand{display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:24px}
.login .brand .logo{height:48px;width:auto;min-width:48px;background:var(--bg);border:1px solid var(--border);display:none;align-items:center;justify-content:center;overflow:hidden}
.login .brand .logo img{max-width:100%;max-height:100%;object-fit:contain}
.login h1{font-size:1.3rem;font-weight:600;margin:0}
.login input{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);padding:14px 16px;font-size:.95rem;outline:none;margin-bottom:12px;text-align:center}
.login input:focus{border-color:var(--accent)}
.login button{width:100%;background:var(--accent);color:#fff;border:none;border-radius:var(--radius);padding:14px;font-size:1rem;font-weight:600;cursor:pointer}
.login button:hover{opacity:.85}
.login .err{color:#ef4444;font-size:.85rem;margin-top:8px;display:none}
.login .back{margin-top:16px}
.login .back a{color:var(--muted);text-decoration:none;font-size:.8rem}
.login .back a:hover{color:var(--text)}
</style>
</head>
<body>
<div class="login">
<div class="brand">
<div class="logo" id="loginLogo"></div>
<h1 id="loginTitle">Админ-панель</h1>
</div>
<input type="text" id="userInput" placeholder="Логин" autocomplete="username" autofocus>
<input type="password" id="pwdInput" placeholder="Пароль" autocomplete="current-password">
<input type="text" id="hpWebsite" tabindex="-1" autocomplete="off" style="display:none" value="">
<button type="button" id="loginBtn">Войти</button>
<div class="err" id="loginErr">Неверный логин или пароль</div>
<div class="back"><a href="/">На главную</a></div>
</div>
<script src="js/login.js"></script>
</body>
</html>