- Complete PostgreSQL schema with migrations - Node.js/Express backend with authentication - Public website (home, about, services, jobs, apply, contact) - Admin dashboard with applicant and job management - CV upload and storage in PostgreSQL BYTEA - Docker Compose setup for deployment - Session-based authentication - Responsive design with Ryan brand colors
83 lines
4.4 KiB
HTML
83 lines
4.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Admin Login - Ryans Recruit</title>
|
|
<link rel="stylesheet" href="/css/styles.css">
|
|
</head>
|
|
<body style="background: linear-gradient(135deg, #2563EB 0%, #1E293B 100%); min-height: 100vh; display: flex; align-items: center; justify-content: center; margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;">
|
|
<div style="background: white; border-radius: 12px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); padding: 48px 40px; width: 100%; max-width: 400px;">
|
|
<h1 style="text-align: center; color: #1E293B; margin: 0 0 8px 0; font-size: 28px;">Ryans Recruit</h1>
|
|
<p style="text-align: center; color: #64748B; margin: 0 0 32px 0; font-size: 14px;">Admin Portal</p>
|
|
|
|
<!-- First Admin Notice -->
|
|
<div id="first-admin-notice" style="background: #DBEAFE; border: 1px solid #93C5FD; border-radius: 8px; padding: 12px; margin-bottom: 24px; color: #1E40AF; font-size: 14px; display: none;">
|
|
<strong>First Admin Setup:</strong> Create your admin account to get started.
|
|
</div>
|
|
|
|
<form id="login-form" style="display: flex; flex-direction: column; gap: 16px;">
|
|
<!-- Email Field -->
|
|
<div>
|
|
<label for="email" style="display: block; font-weight: 600; color: #1E293B; margin-bottom: 6px; font-size: 14px;">Email</label>
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
name="email"
|
|
required
|
|
placeholder="admin@example.com"
|
|
style="width: 100%; padding: 10px 12px; border: 1px solid #E2E8F0; border-radius: 6px; font-size: 14px; box-sizing: border-box; transition: border-color 0.2s;"
|
|
onfocus="this.style.borderColor='#2563EB'"
|
|
onblur="this.style.borderColor='#E2E8F0'"
|
|
>
|
|
</div>
|
|
|
|
<!-- Password Field -->
|
|
<div>
|
|
<label for="password" style="display: block; font-weight: 600; color: #1E293B; margin-bottom: 6px; font-size: 14px;">Password</label>
|
|
<input
|
|
type="password"
|
|
id="password"
|
|
name="password"
|
|
required
|
|
placeholder="••••••••"
|
|
style="width: 100%; padding: 10px 12px; border: 1px solid #E2E8F0; border-radius: 6px; font-size: 14px; box-sizing: border-box; transition: border-color 0.2s;"
|
|
onfocus="this.style.borderColor='#2563EB'"
|
|
onblur="this.style.borderColor='#E2E8F0'"
|
|
>
|
|
</div>
|
|
|
|
<!-- Full Name Field (Initially Hidden) -->
|
|
<div id="full-name-group" style="display: none;">
|
|
<label for="full-name" style="display: block; font-weight: 600; color: #1E293B; margin-bottom: 6px; font-size: 14px;">Full Name</label>
|
|
<input
|
|
type="text"
|
|
id="full-name"
|
|
name="full-name"
|
|
placeholder="John Doe"
|
|
style="width: 100%; padding: 10px 12px; border: 1px solid #E2E8F0; border-radius: 6px; font-size: 14px; box-sizing: border-box; transition: border-color 0.2s;"
|
|
onfocus="this.style.borderColor='#2563EB'"
|
|
onblur="this.style.borderColor='#E2E8F0'"
|
|
>
|
|
</div>
|
|
|
|
<!-- Submit Button -->
|
|
<button
|
|
type="submit"
|
|
style="background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%); color: white; padding: 12px; border: none; border-radius: 6px; font-weight: 600; font-size: 14px; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; margin-top: 8px;"
|
|
onmouseover="this.style.transform='translateY(-2px)'; this.style.boxShadow='0 8px 16px rgba(37, 99, 235, 0.3)'"
|
|
onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='none'"
|
|
>
|
|
Sign In
|
|
</button>
|
|
</form>
|
|
|
|
<p style="text-align: center; color: #64748B; font-size: 13px; margin-top: 20px;">
|
|
Back to <a href="/" style="color: #2563EB; text-decoration: none; font-weight: 500;">Main Site</a>
|
|
</p>
|
|
</div>
|
|
|
|
<script src="/js/admin.js"></script>
|
|
</body>
|
|
</html>
|