mistpe commited on
Commit
c2a1150
·
verified ·
1 Parent(s): 406a65a

Update app/templates/admin/login.html

Browse files
Files changed (1) hide show
  1. app/templates/admin/login.html +174 -174
app/templates/admin/login.html CHANGED
@@ -1,175 +1,175 @@
1
- {% extends "base.html" %}
2
-
3
- {% block title %}管理员登录 - 个人博客{% endblock %}
4
-
5
- {% block content %}
6
- <div class="login-container" style="
7
- min-height: calc(100vh - 8rem);
8
- display: flex;
9
- align-items: center;
10
- justify-content: center;
11
- padding: 2rem;
12
- background: linear-gradient(135deg, #FEEEDA 0%, #B3CFEF 100%);
13
- ">
14
- <div class="login-form" style="
15
- width: 100%;
16
- max-width: 420px;
17
- background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.8));
18
- backdrop-filter: blur(10px);
19
- padding: 3rem;
20
- border-radius: 24px;
21
- box-shadow: 0 8px 32px rgba(99, 145, 197, 0.15);
22
- border: 1px solid rgba(99, 145, 197, 0.2);
23
- ">
24
- <div class="form-header" style="
25
- text-align: center;
26
- margin-bottom: 2.5rem;
27
- ">
28
- <div class="logo-container" style="
29
- margin-bottom: 1.5rem;
30
- ">
31
- <i class="fas fa-feather" style="
32
- font-size: 3rem;
33
- background: linear-gradient(135deg, #6391C5, #C5CDFD);
34
- -webkit-background-clip: text;
35
- -webkit-text-fill-color: transparent;
36
- "></i>
37
- </div>
38
- <h2 style="
39
- font-size: 1.75rem;
40
- font-weight: 600;
41
- color: #6391C5;
42
- margin-bottom: 0.5rem;
43
- ">管理员登录</h2>
44
- <p style="
45
- color: #6391C5;
46
- font-size: 0.9375rem;
47
- ">请输入您的管理员账号密码</p>
48
- </div>
49
-
50
- <form method="POST" style="display: flex; flex-direction: column; gap: 1.5rem;">
51
- {% with messages = get_flashed_messages() %}
52
- {% if messages %}
53
- <div style="
54
- background: rgba(99, 145, 197, 0.1);
55
- border: 1px solid #B3CFEF;
56
- padding: 1rem;
57
- border-radius: 12px;
58
- color: #6391C5;
59
- font-size: 0.875rem;
60
- text-align: center;
61
- ">
62
- {{ messages[0] }}
63
- </div>
64
- {% endif %}
65
- {% endwith %}
66
-
67
- <div class="form-group" style="position: relative;">
68
- <div style="
69
- position: absolute;
70
- left: 1rem;
71
- top: 50%;
72
- transform: translateY(-50%);
73
- color: #6391C5;
74
- ">
75
- <i class="fas fa-user"></i>
76
- </div>
77
- <input type="text" name="username" placeholder="用户名" required style="
78
- width: 100%;
79
- padding: 1rem 1rem 1rem 2.75rem;
80
- border: 2px solid #B3CFEF;
81
- border-radius: 12px;
82
- font-size: 1rem;
83
- transition: all 0.3s ease;
84
- color: #6391C5;
85
- background: rgba(255, 255, 255, 0.7);
86
- ">
87
- </div>
88
-
89
- <div class="form-group" style="position: relative;">
90
- <div style="
91
- position: absolute;
92
- left: 1rem;
93
- top: 50%;
94
- transform: translateY(-50%);
95
- color: #6391C5;
96
- ">
97
- <i class="fas fa-lock"></i>
98
- </div>
99
- <input type="password" name="password" placeholder="密码" required style="
100
- width: 100%;
101
- padding: 1rem 1rem 1rem 2.75rem;
102
- border: 2px solid #B3CFEF;
103
- border-radius: 12px;
104
- font-size: 1rem;
105
- transition: all 0.3s ease;
106
- color: #6391C5;
107
- background: rgba(255, 255, 255, 0.7);
108
- ">
109
- </div>
110
-
111
- <button type="submit" style="
112
- width: 100%;
113
- padding: 1rem;
114
- background: linear-gradient(135deg, #6391C5, #C5CDFD);
115
- color: white;
116
- border: none;
117
- border-radius: 12px;
118
- font-size: 1rem;
119
- font-weight: 500;
120
- cursor: pointer;
121
- transition: all 0.3s ease;
122
- margin-top: 1rem;
123
- ">登录</button>
124
-
125
- <div style="
126
- text-align: center;
127
- margin-top: 1.5rem;
128
- font-size: 0.875rem;
129
- ">
130
- <a href="{{ url_for('main.index') }}" style="
131
- color: #6391C5;
132
- text-decoration: none;
133
- transition: color 0.3s ease;
134
- ">
135
- <i class="fas fa-arrow-left" style="margin-right: 0.5rem;"></i>返回首页
136
- </a>
137
- </div>
138
- </form>
139
- </div>
140
- </div>
141
-
142
- <script>
143
- document.querySelectorAll('input').forEach(input => {
144
- input.addEventListener('focus', () => {
145
- input.style.borderColor = '#6391C5';
146
- input.style.background = 'rgba(255, 255, 255, 0.9)';
147
- input.style.boxShadow = '0 0 0 4px rgba(99, 145, 197, 0.1)';
148
- });
149
-
150
- input.addEventListener('blur', () => {
151
- input.style.borderColor = '#B3CFEF';
152
- input.style.background = 'rgba(255, 255, 255, 0.7)';
153
- input.style.boxShadow = 'none';
154
- });
155
- });
156
-
157
- document.querySelector('button[type="submit"]').addEventListener('mouseenter', function() {
158
- this.style.transform = 'translateY(-2px)';
159
- this.style.boxShadow = '0 4px 12px rgba(99, 145, 197, 0.2)';
160
- });
161
-
162
- document.querySelector('button[type="submit"]').addEventListener('mouseleave', function() {
163
- this.style.transform = 'none';
164
- this.style.boxShadow = 'none';
165
- });
166
-
167
- document.querySelector('a').addEventListener('mouseenter', function() {
168
- this.style.color = '#C5CDFD';
169
- });
170
-
171
- document.querySelector('a').addEventListener('mouseleave', function() {
172
- this.style.color = '#6391C5';
173
- });
174
- </script>
175
  {% endblock %}
 
1
+ {% extends "base.html" %}
2
+
3
+ {% block title %}管理员登录 - Wisdom Hub{% endblock %}
4
+
5
+ {% block content %}
6
+ <div class="login-container" style="
7
+ min-height: calc(100vh - 8rem);
8
+ display: flex;
9
+ align-items: center;
10
+ justify-content: center;
11
+ padding: 2rem;
12
+ background: linear-gradient(135deg, #FEEEDA 0%, #B3CFEF 100%);
13
+ ">
14
+ <div class="login-form" style="
15
+ width: 100%;
16
+ max-width: 420px;
17
+ background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.8));
18
+ backdrop-filter: blur(10px);
19
+ padding: 3rem;
20
+ border-radius: 24px;
21
+ box-shadow: 0 8px 32px rgba(99, 145, 197, 0.15);
22
+ border: 1px solid rgba(99, 145, 197, 0.2);
23
+ ">
24
+ <div class="form-header" style="
25
+ text-align: center;
26
+ margin-bottom: 2.5rem;
27
+ ">
28
+ <div class="logo-container" style="
29
+ margin-bottom: 1.5rem;
30
+ ">
31
+ <i class="fas fa-feather" style="
32
+ font-size: 3rem;
33
+ background: linear-gradient(135deg, #6391C5, #C5CDFD);
34
+ -webkit-background-clip: text;
35
+ -webkit-text-fill-color: transparent;
36
+ "></i>
37
+ </div>
38
+ <h2 style="
39
+ font-size: 1.75rem;
40
+ font-weight: 600;
41
+ color: #6391C5;
42
+ margin-bottom: 0.5rem;
43
+ ">管理员登录</h2>
44
+ <p style="
45
+ color: #6391C5;
46
+ font-size: 0.9375rem;
47
+ ">请输入您的管理员账号密码</p>
48
+ </div>
49
+
50
+ <form method="POST" style="display: flex; flex-direction: column; gap: 1.5rem;">
51
+ {% with messages = get_flashed_messages() %}
52
+ {% if messages %}
53
+ <div style="
54
+ background: rgba(99, 145, 197, 0.1);
55
+ border: 1px solid #B3CFEF;
56
+ padding: 1rem;
57
+ border-radius: 12px;
58
+ color: #6391C5;
59
+ font-size: 0.875rem;
60
+ text-align: center;
61
+ ">
62
+ {{ messages[0] }}
63
+ </div>
64
+ {% endif %}
65
+ {% endwith %}
66
+
67
+ <div class="form-group" style="position: relative;">
68
+ <div style="
69
+ position: absolute;
70
+ left: 1rem;
71
+ top: 50%;
72
+ transform: translateY(-50%);
73
+ color: #6391C5;
74
+ ">
75
+ <i class="fas fa-user"></i>
76
+ </div>
77
+ <input type="text" name="username" placeholder="用户名" required style="
78
+ width: 100%;
79
+ padding: 1rem 1rem 1rem 2.75rem;
80
+ border: 2px solid #B3CFEF;
81
+ border-radius: 12px;
82
+ font-size: 1rem;
83
+ transition: all 0.3s ease;
84
+ color: #6391C5;
85
+ background: rgba(255, 255, 255, 0.7);
86
+ ">
87
+ </div>
88
+
89
+ <div class="form-group" style="position: relative;">
90
+ <div style="
91
+ position: absolute;
92
+ left: 1rem;
93
+ top: 50%;
94
+ transform: translateY(-50%);
95
+ color: #6391C5;
96
+ ">
97
+ <i class="fas fa-lock"></i>
98
+ </div>
99
+ <input type="password" name="password" placeholder="密码" required style="
100
+ width: 100%;
101
+ padding: 1rem 1rem 1rem 2.75rem;
102
+ border: 2px solid #B3CFEF;
103
+ border-radius: 12px;
104
+ font-size: 1rem;
105
+ transition: all 0.3s ease;
106
+ color: #6391C5;
107
+ background: rgba(255, 255, 255, 0.7);
108
+ ">
109
+ </div>
110
+
111
+ <button type="submit" style="
112
+ width: 100%;
113
+ padding: 1rem;
114
+ background: linear-gradient(135deg, #6391C5, #C5CDFD);
115
+ color: white;
116
+ border: none;
117
+ border-radius: 12px;
118
+ font-size: 1rem;
119
+ font-weight: 500;
120
+ cursor: pointer;
121
+ transition: all 0.3s ease;
122
+ margin-top: 1rem;
123
+ ">登录</button>
124
+
125
+ <div style="
126
+ text-align: center;
127
+ margin-top: 1.5rem;
128
+ font-size: 0.875rem;
129
+ ">
130
+ <a href="{{ url_for('main.index') }}" style="
131
+ color: #6391C5;
132
+ text-decoration: none;
133
+ transition: color 0.3s ease;
134
+ ">
135
+ <i class="fas fa-arrow-left" style="margin-right: 0.5rem;"></i>返回首页
136
+ </a>
137
+ </div>
138
+ </form>
139
+ </div>
140
+ </div>
141
+
142
+ <script>
143
+ document.querySelectorAll('input').forEach(input => {
144
+ input.addEventListener('focus', () => {
145
+ input.style.borderColor = '#6391C5';
146
+ input.style.background = 'rgba(255, 255, 255, 0.9)';
147
+ input.style.boxShadow = '0 0 0 4px rgba(99, 145, 197, 0.1)';
148
+ });
149
+
150
+ input.addEventListener('blur', () => {
151
+ input.style.borderColor = '#B3CFEF';
152
+ input.style.background = 'rgba(255, 255, 255, 0.7)';
153
+ input.style.boxShadow = 'none';
154
+ });
155
+ });
156
+
157
+ document.querySelector('button[type="submit"]').addEventListener('mouseenter', function() {
158
+ this.style.transform = 'translateY(-2px)';
159
+ this.style.boxShadow = '0 4px 12px rgba(99, 145, 197, 0.2)';
160
+ });
161
+
162
+ document.querySelector('button[type="submit"]').addEventListener('mouseleave', function() {
163
+ this.style.transform = 'none';
164
+ this.style.boxShadow = 'none';
165
+ });
166
+
167
+ document.querySelector('a').addEventListener('mouseenter', function() {
168
+ this.style.color = '#C5CDFD';
169
+ });
170
+
171
+ document.querySelector('a').addEventListener('mouseleave', function() {
172
+ this.style.color = '#6391C5';
173
+ });
174
+ </script>
175
  {% endblock %}