101 lines
6.1 KiB
PHP
101 lines
6.1 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>AI Resume Builder - Login</title>
|
|
<meta name="description" content="Log in or sign up to create your professional resume with the help of AI.">
|
|
|
|
<!-- Open Graph -->
|
|
<meta property="og:title" content="AI Resume Builder">
|
|
<meta property="og:description" content="Build your perfect resume with AI-powered assistance.">
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="http://<?php echo $_SERVER['HTTP_HOST']; ?>">
|
|
<meta property="og:image" content="https://picsum.photos/seed/resume-og/1200/630">
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
|
</head>
|
|
<body>
|
|
|
|
<div class="auth-container">
|
|
<div class="auth-visual">
|
|
<!-- Alt text is handled by CSS background, but if it were an <img>:
|
|
alt="Abstract visual representing creativity and document creation." -->
|
|
</div>
|
|
<div class="auth-content">
|
|
<div class="auth-header">
|
|
<h1>AI Resume Builder</h1>
|
|
<p>Welcome back! Please login to your account.</p>
|
|
</div>
|
|
|
|
<!-- Tabs -->
|
|
<ul class="nav nav-tabs" id="authTabs" role="tablist">
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link active" id="login-tab" data-bs-toggle="tab" data-bs-target="#login" type="button" role="tab" aria-controls="login" aria-selected="true">Login</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" id="signup-tab" data-bs-toggle="tab" data-bs-target="#signup" type="button" role="tab" aria-controls="signup" aria-selected="false">Sign Up</button>
|
|
</li>
|
|
</ul>
|
|
|
|
<!-- Error Messages -->
|
|
<div id="errorContainer" class="alert alert-danger mt-3" style="display: none;"></div>
|
|
|
|
<!-- Tab Content -->
|
|
<div class="tab-content pt-4" id="authTabsContent">
|
|
<!-- Login Pane -->
|
|
<div class="tab-pane fade show active" id="login" role="tabpanel" aria-labelledby="login-tab">
|
|
<form id="loginForm">
|
|
<div class="mb-3">
|
|
<label for="loginEmail" class="form-label visually-hidden">Email address</label>
|
|
<input type="email" class="form-control" id="loginEmail" placeholder="Email address" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="loginPassword" class="form-label visually-hidden">Password</label>
|
|
<input type="password" class="form-control" id="loginPassword" placeholder="Password" required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary mt-3">Login</button>
|
|
</form>
|
|
<div class="divider">or</div>
|
|
<button class="btn btn-google" id="googleLoginBtn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-google" viewBox="0 0 16 16">
|
|
<path d="M15.545 6.558a9.42 9.42 0 0 1 .139 1.626c0 2.434-.87 4.492-2.384 5.885h.002C11.978 15.292 10.158 16 8 16A8 8 0 1 1 8 0a7.689 7.689 0 0 1 5.352 2.082l-2.284 2.284A4.347 4.347 0 0 0 8 3.166c-2.087 0-3.86 1.408-4.492 3.304a4.792 4.792 0 0 0 0 3.063h.003c.635 1.893 2.405 3.301 4.492 3.301 1.078 0 2.004-.276 2.722-.764h-.003a3.702 3.702 0 0 0 1.599-2.431H8v-3.08h7.545z"/>
|
|
</svg>
|
|
Sign in with Google
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Sign Up Pane -->
|
|
<div class="tab-pane fade" id="signup" role="tabpanel" aria-labelledby="signup-tab">
|
|
<form id="signupForm">
|
|
<div class="mb-3">
|
|
<label for="signupName" class="form-label visually-hidden">Full Name</label>
|
|
<input type="text" class="form-control" id="signupName" placeholder="Full Name" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="signupEmail" class="form-label visually-hidden">Email address</label>
|
|
<input type="email" class="form-control" id="signupEmail" placeholder="Email address" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="signupPassword" class="form-label visually-hidden">Password</label>
|
|
<input type="password" class="form-control" id="signupPassword" placeholder="Password" required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary mt-3">Create Account</button>
|
|
</form>
|
|
<div class="divider">or</div>
|
|
<button class="btn btn-google" id="googleSignupBtn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-google" viewBox="0 0 16 16">
|
|
<path d="M15.545 6.558a9.42 9.42 0 0 1 .139 1.626c0 2.434-.87 4.492-2.384 5.885h.002C11.978 15.292 10.158 16 8 16A8 8 0 1 1 8 0a7.689 7.689 0 0 1 5.352 2.082l-2.284 2.284A4.347 4.347 0 0 0 8 3.166c-2.087 0-3.86 1.408-4.492 3.304a4.792 4.792 0 0 0 0 3.063h.003c.635 1.893 2.405 3.301 4.492 3.301 1.078 0 2.004-.276 2.722-.764h-.003a3.702 3.702 0 0 0 1.599-2.431H8v-3.08h7.545z"/>
|
|
</svg>
|
|
Sign up with Google
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script type="module" src="assets/js/auth.js?v=<?php echo time(); ?>"></script>
|
|
</body>
|
|
</html> |