toannt/uldp-degree-mangement-system
1
0
Fork 0
forked from UKSOURCE/cms.hailearning.edu.vn
Code Pull Requests Activity

feat: implement user authentication with database integration

Browse Source
This commit is contained in:
Wini_Fy
2026-02-09 16:36:50 +07:00
parent a2785955b3
commit 2ddf43c139
7 changed files with 1276 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
views/auth/login.ejs
View File

@@ -11,35 +11,18 @@
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Global CSS Variables -->
<link rel="stylesheet" href="/assets/css/variables.css">
<!-- Custom CSS -->
<style>
:root {
--primary-color: #0a2347;
--primary-light: #0a2347;
--primary-dark: #0a2347;
--text-on-primary: #ffffff;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-family: var(--font-family);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
position: relative;
background-color: #0f172a;
}
body::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('/images/bg-login.jpg') center/cover no-repeat fixed;
opacity: 0.4;
z-index: 0;
background-color: var(--primary-color);
}
.main-content {
@@ -51,27 +34,21 @@
}
.login-container {
background-color: #f6f6f6;
padding: 40px;
border-radius: 15px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
background-color: var(--bg-card);
padding: 30px;
border-radius: var(--border-radius-lg);
box-shadow: var(--shadow-lg);
}
.logo-container {
text-align: center;
margin-bottom: 30px;
display: flex;
justify-content: center;
padding: 6px;
margin-bottom: 10px;
}
.logo-container img {
width: 120px;
height: 120px;
border-radius: 50%;
object-fit: cover;
background-color: var(--primary-color);
padding: 10px;
width: 100px;
height: auto;
margin-bottom: 5px;
}
.img-shine {
@@ -117,7 +94,7 @@
}
.btn-shine {
background: #0a2347;
background: var(--primary-color);
color: white;
border: none;
padding: 12px 30px;
@@ -134,8 +111,8 @@
}
.btn-shine:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(37, 99, 235, 0.35);
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(10, 35, 71, 0.2);
}
.btn-shine::after {
@@ -179,34 +156,42 @@
<img src="/img/logo/logo-hai-learning.png" alt="Logo">
</div>
<div style="text-align: center; margin-bottom: 30px;">
<h4 style="color: var(--primary-color); font-weight: 600; margin-bottom: 10px;">CMS Management System</h4>
<p style="color: var(--text-color); font-size: 14px;">Welcome to Content Management System</p>
<div style="text-align: center; margin-bottom: 20px;">
<h4 style="color: var(--primary-color); font-weight: 600; margin-bottom: 5px;">CMS Management System</h4>
<p style="color: var(--text-color); font-size: 13px;">Welcome to Content Management System</p>
</div>
<form action="/auth/login" method="POST" class="login-form">
<div class="form-group" style="margin-bottom: 20px;">
<div class="form-group" style="margin-bottom: 12px;">
<label for="username" class="form-label">Username</label>
<input type="text" class="form-control" id="username" name="username" required autocomplete="username"
autofocus>
</div>
<div class="form-group" style="margin-bottom: 20px;">
<div class="form-group" style="margin-bottom: 12px;">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" required
autocomplete="current-password">
<a href="/auth/forgot-password"
style="display: block; text-align: right; margin-top: 8px; color: #2563eb; text-decoration: none; font-size: 13px;">
style="display: block; text-align: right; margin-top: 8px; color: #2563eb; text-decoration: none; font-size: 13px; font-weight: 600;">
Forgot Your Password?
</a>
</div>
<div style="text-align: center; margin-top: 30px;">
<div style="text-align: center; margin-top: 20px;">
<button type="submit" class="btn-shine">
Login
</button>
</div>
<div style="text-align: center; margin-top: 20px;">
<span style="font-size: 14px; color: #666;">Don't have an account?</span>
<a href="/auth/register"
style="color: var(--primary-color); font-weight: 600; text-decoration: none; margin-left: 5px;">
Create Account
</a>
</div>
</form>
</div>