File size: 2,276 Bytes
d3a7520 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 | <!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>登录</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #f0f2f5 0%, #e4e8f0 100%);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.card {
background: #fff;
border-radius: 14px;
box-shadow: 0 6px 32px rgba(0, 0, 0, 0.10);
padding: 44px 40px;
width: 100%;
max-width: 400px;
}
h1 { font-size: 1.5rem; font-weight: 700; color: #111827; margin-bottom: 6px; }
p.sub { font-size: 0.875rem; color: #6b7280; margin-bottom: 30px; }
label { display: block; font-size: 0.8rem; font-weight: 600; color: #374151; margin-bottom: 6px; }
input[type=text], input[type=password] {
width: 100%;
padding: 11px 14px;
border: 1.5px solid #e5e7eb;
border-radius: 8px;
font-size: 0.95rem;
outline: none;
transition: border-color 0.15s;
margin-bottom: 20px;
color: #111827;
}
input:focus { border-color: #4f6ef7; box-shadow: 0 0 0 3px rgba(79,110,247,0.12); }
button {
width: 100%;
padding: 12px;
background: linear-gradient(135deg, #4f6ef7 0%, #3b5bdb 100%);
color: #fff;
border: none;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: opacity 0.15s;
}
button:hover { opacity: 0.88; }
.error {
background: #fef2f2;
border: 1.5px solid #fecaca;
border-radius: 8px;
padding: 10px 14px;
font-size: 0.875rem;
color: #dc2626;
margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="card">
<h1>欢迎回来</h1>
<p class="sub">请先登录后继续</p>
__ERROR_BLOCK__
<form method="post" action="/login">
<label for="u">用户名</label>
<input id="u" type="text" name="username" autocomplete="username" required autofocus>
<label for="p">密码</label>
<input id="p" type="password" name="password" autocomplete="current-password" required>
<button type="submit">登录</button>
</form>
</div>
</body>
</html>
|