1
+ <?php
2
+
3
+ require_once 'db.php ' ;
4
+ include 'logged.php ' ; // This line makes it impossible to log in to the account page.
5
+ $ message = '' ;
6
+
7
+ if ($ _SERVER ["REQUEST_METHOD " ] == "POST " ) {
8
+ $ username = $ _POST ['username ' ];
9
+ $ password = $ _POST ['password ' ];
10
+
11
+ $ stmt = $ conn ->prepare ("SELECT * FROM users WHERE username = ? " );
12
+ $ stmt ->bind_param ("s " , $ username );
13
+ $ stmt ->execute ();
14
+
15
+ $ result = $ stmt ->get_result ();
16
+
17
+ if ($ result ->num_rows == 1 ) {
18
+ $ row = $ result ->fetch_assoc ();
19
+
20
+ if (password_verify ($ password , $ row ['password ' ])) {
21
+ $ token = bin2hex (random_bytes (32 ));
22
+
23
+ $ update_stmt = $ conn ->prepare ("UPDATE users SET token = ? WHERE id = ? " );
24
+ $ update_stmt ->bind_param ("si " , $ token , $ row ['id ' ]);
25
+ $ update_stmt ->execute ();
26
+
27
+ setcookie ('token ' , $ token , time () + (86400 * 30 ), '/ ' );
28
+ header ("Location: /dashboard.php " ); // Menu that can only be accessed in your account
29
+ exit ();
30
+ } else {
31
+ $ message = "Invalid user name or password. " ;
32
+ }
33
+ } else {
34
+ $ message = "Invalid user name or password. " ;
35
+ }
36
+
37
+ $ stmt ->close ();
38
+ $ update_stmt ->close ();
39
+ }
40
+
41
+ ?>
42
+
43
+ <!DOCTYPE html>
44
+ <html lang="ru">
45
+
46
+ <head>
47
+ <meta charset="UTF-8">
48
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
49
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
50
+ <title>Login - Test</title>
51
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/
[email protected] /dist/css/bootstrap.min.css">
52
+ <style>
53
+ * {
54
+ margin: 0;
55
+ padding: 0;
56
+ box-sizing: border-box;
57
+ font-family: Arial, sans-serif;
58
+ }
59
+
60
+ body {
61
+ background-color: #121212;
62
+ color: #ffffff;
63
+ display: flex;
64
+ justify-content: center;
65
+ align-items: center;
66
+ height: 100vh;
67
+ position: relative;
68
+ overflow: hidden;
69
+ padding: 1rem;
70
+ }
71
+
72
+ .background-text {
73
+ position: absolute;
74
+ top: 50%;
75
+ left: 50%;
76
+ transform: translate(-50%, -50%);
77
+ font-size: 10rem;
78
+ color: rgba(255, 255, 255, 0.05);
79
+ white-space: nowrap;
80
+ z-index: 0;
81
+ }
82
+
83
+ .login-container {
84
+ background-color: #1e1e1e;
85
+ padding: 2rem;
86
+ border-radius: 10px;
87
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
88
+ text-align: center;
89
+ width: 100%;
90
+ max-width: 400px;
91
+ z-index: 1;
92
+ position: relative;
93
+ }
94
+
95
+ form {
96
+ display: flex;
97
+ flex-direction: column;
98
+ }
99
+
100
+ .group {
101
+ display: flex;
102
+ align-items: center;
103
+ position: relative;
104
+ margin-bottom: 1rem;
105
+ }
106
+
107
+ .group input {
108
+ width: 100%;
109
+ padding-left: 45px;
110
+ background-color: #2c2c2c;
111
+ color: #ffffff;
112
+ border: none;
113
+ border-radius: 5px;
114
+ padding: 0.75rem;
115
+ padding-left: 45px;
116
+ }
117
+
118
+ .group input::placeholder {
119
+ color: #9e9e9e;
120
+ }
121
+
122
+ .group .icon {
123
+ position: absolute;
124
+ left: 0.75rem;
125
+ fill: none;
126
+ width: 1.5rem;
127
+ height: 1.5rem;
128
+ color: #ffffff;
129
+ top: 50%;
130
+ transform: translateY(-50%);
131
+ }
132
+
133
+ button {
134
+ padding: 0.75rem;
135
+ border: none;
136
+ border-radius: 5px;
137
+ background-color: #ff3b3b;
138
+ color: #ffffff;
139
+ font-size: 1rem;
140
+ cursor: pointer;
141
+ transition: background-color 0.3s ease;
142
+ }
143
+
144
+ button:hover {
145
+ background-color: #ff1c1c;
146
+ }
147
+
148
+ .boton-elegante {
149
+ padding: 15px 30px;
150
+ border: 2px solid #2c2c2c;
151
+ background-color: #1a1a1a;
152
+ color: #ffffff;
153
+ font-size: 1.2rem;
154
+ cursor: pointer;
155
+ border-radius: 30px;
156
+ transition: all 0.4s ease;
157
+ outline: none;
158
+ position: relative;
159
+ overflow: hidden;
160
+ font-weight: bold;
161
+ }
162
+
163
+ .boton-elegante::after {
164
+ content: "";
165
+ position: absolute;
166
+ top: 0;
167
+ left: 0;
168
+ width: 100%;
169
+ height: 100%;
170
+ background: radial-gradient(circle,
171
+ rgba(255, 255, 255, 0.25) 0%,
172
+ rgba(255, 255, 255, 0) 70%);
173
+ transform: scale(0);
174
+ transition: transform 0.5s ease;
175
+ }
176
+
177
+ .boton-elegante:hover::after {
178
+ transform: scale(4);
179
+ }
180
+
181
+ .boton-elegante:hover {
182
+ border-color: #666666;
183
+ background: #292929;
184
+ }
185
+
186
+ @media (max-width: 768px) {
187
+
188
+ .login-container {
189
+ width: 90%;
190
+ padding: 1.5rem;
191
+ }
192
+ }
193
+ </style>
194
+ </head>
195
+
196
+ <body>
197
+ <div class="background-text">Example</div>
198
+ <div class="login-container">
199
+ <form action="" method="post">
200
+ <?php if (!empty ($ message )): ?>
201
+ <div class="alert alert-danger mt-3" role="alert">
202
+ <?php echo $ message ; ?>
203
+ </div>
204
+ <?php endif ; ?>
205
+ <div class="group">
206
+ <svg stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"
207
+ class="icon">
208
+ <path
209
+ d="M12 12c2.485 0 4.5-2.015 4.5-4.5S14.485 3 12 3 7.5 5.015 7.5 7.5 9.515 12 12 12zm0 1.5c-3.315 0-6 2.685-6 6H18c0-3.315-2.685-6-6-6z"
210
+ stroke-linejoin="round" stroke-linecap="round"></path>
211
+ </svg>
212
+ <input type="text" id="username" name="username" placeholder="username" required>
213
+ </div>
214
+
215
+ <div class="group">
216
+ <svg stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"
217
+ class="icon">
218
+ <path
219
+ d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z"
220
+ stroke-linejoin="round" stroke-linecap="round"></path>
221
+ </svg>
222
+ <input type="password" id="password" name="password" placeholder="password" required>
223
+ </div>
224
+
225
+ <button type="submit" class="boton-elegante">Login</button>
226
+ </form>
227
+ <p class="text-center mt-3">No account?<a href="register.php">Register</a>.</p>
228
+ </div>
229
+ </body>
230
+
231
+ </html>
0 commit comments