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

feat: Add initial admin dashboard, login page, and main layout, including a new logo and updated gitignore.

Browse Source
This commit is contained in:
LNHA
2026-02-07 10:29:10 +07:00
parent 84097e6ed6
commit 09f5c12a2f
5 changed files with 95 additions and 355 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
views/auth/login.ejs
View File

@@ -1,9 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= title %> | CMS-SIMS</title>
<title>
<%= title %> | CMS-SIMS
</title>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
@@ -11,12 +14,12 @@
<!-- Custom CSS -->
<style>
:root {
--primary-color: #b8b76a;
--primary-light: #c9c88a;
--primary-dark: #9a994a;
--primary-color: #2563eb;
--primary-light: #3b82f6;
--primary-dark: #1d4ed8;
--text-on-primary: #ffffff;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
min-height: 100vh;
@@ -24,7 +27,7 @@
align-items: center;
justify-content: center;
position: relative;
background-color: #3e1e00;
background-color: #0f172a;
}
body::before {
@@ -51,7 +54,7 @@
background-color: #f6f6f6;
padding: 40px;
border-radius: 15px;
box-shadow: 0 4px 15px rgba(0,0,0,0.2);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}
.logo-container {
@@ -83,7 +86,7 @@
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
transition: all 0.5s ease;
}
@@ -103,7 +106,7 @@
.form-control:focus {
outline: none;
border-color: var(--primary-color) !important;
box-shadow: 0 0 0 2px rgba(255,106,0,0.12);
box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}
.form-label {
@@ -114,7 +117,7 @@
}
.btn-shine {
background: linear-gradient(90deg, #9a994a, #b8b76a, #c9c88a, #d9d8aa);
background: linear-gradient(90deg, #1d4ed8, #2563eb, #3b82f6, #60a5fa);
color: white;
border: none;
padding: 12px 30px;
@@ -132,7 +135,7 @@
.btn-shine:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(255,106,0,0.28);
box-shadow: 0 5px 15px rgba(37, 99, 235, 0.35);
}
.btn-shine::after {
@@ -142,14 +145,14 @@
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
transition: all 0.5s ease;
}
.btn-shine:hover::after {
left: 100%;
}
@media (max-width: 768px) {
.main-content {
padding: 15px;
@@ -161,62 +164,66 @@
}
</style>
</head>
<body>
<div class="main-content">
<!-- Flash Messages Data (Hidden) -->
<% if(typeof success_msg !== 'undefined' || typeof error_msg !== 'undefined' || typeof error !== 'undefined') { %>
<div id="flash-messages-data" style="display: none;"><%- JSON.stringify({
success_msg: typeof success_msg !== 'undefined' && success_msg ? success_msg : null,
error_msg: typeof error_msg !== 'undefined' && error_msg ? error_msg : null,
error: typeof error !== 'undefined' && error ? error : null
}) %></div>
<% } %>
<div class="login-container">
<div class="logo-container img-shine">
<img src="/images/Logo_round.jpg" alt="Logo">
</div>
<% if(typeof success_msg !=='undefined' || typeof error_msg !=='undefined' || typeof error !=='undefined' ) { %>
<div id="flash-messages-data" style="display: none;"><%- JSON.stringify({ success_msg: typeof success_msg
!=='undefined' && success_msg ? success_msg : null, error_msg: typeof error_msg !=='undefined' && error_msg ?
error_msg : null, error: typeof error !=='undefined' && error ? error : null }) %></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>
<div class="login-container">
<div class="logo-container img-shine">
<img src="/img/logo/logo-hai-learning.png" alt="Logo">
</div>
<form action="/auth/login" method="POST" class="login-form">
<div class="form-group" style="margin-bottom: 20px;">
<label for="username" class="form-label">Username</label>
<input type="text" class="form-control" id="username" name="username" required autocomplete="username" autofocus>
<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>
<form action="/auth/login" method="POST" class="login-form">
<div class="form-group" style="margin-bottom: 20px;">
<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;">
<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;">
Forgot Your Password?
</a>
</div>
<div style="text-align: center; margin-top: 30px;">
<button type="submit" class="btn-shine">
Login
</button>
</div>
</form>
</div>
<div class="form-group" style="margin-bottom: 20px;">
<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: #b8b76a; text-decoration: none; font-size: 13px;">
Forgot Your Password?
</a>
<div style="margin-top: 20px; text-align: center;">
<p style="font-size: 12px; color: #fff;">© 2024 Swiss Institute of Management and Sciences. All rights
reserved.</p>
</div>
<div style="text-align: center; margin-top: 30px;">
<button type="submit" class="btn-shine">
Login
</button>
</div>
</form>
</div>
<div style="margin-top: 20px; text-align: center;">
<p style="font-size: 12px; color: #fff;">© 2024 Swiss Institute of Management and Sciences. All rights reserved.</p>
</div>
</div>
<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<!-- Toast JS -->
<script src="/js/toast.js"></script>
<!-- Flash Handler JS -->
<script src="/js/flash-handler.js"></script>
</body>
</html>