1.6
This commit is contained in:
Flatlogic Bot
parent
f71da413cb
commit
42d99a2401
214
login.php
214
login.php
@ -41,68 +41,192 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Login - My SaaS</title>
|
<title>Login - TAP2SKILL</title>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="stylesheet" href="assets/css/custom.css">
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Lato:wght@400;700&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--primary-color: #2A9D8F;
|
||||||
|
--secondary-color: #E9C46A;
|
||||||
|
--background-color: #F4F4F4;
|
||||||
|
--surface-color: #FFFFFF;
|
||||||
|
--text-color: #264653;
|
||||||
|
--error-color: #e74c3c;
|
||||||
|
--success-color: #2ecc71;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
background-color: var(--background-color);
|
||||||
|
color: var(--text-color);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 24px;
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background-color: var(--surface-color);
|
||||||
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||||
|
padding: 16px 0;
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--primary-color);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
nav ul {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
nav ul li {
|
||||||
|
margin-left: 32px;
|
||||||
|
}
|
||||||
|
nav ul li a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--text-color);
|
||||||
|
font-weight: 600;
|
||||||
|
transition: color 0.3s ease;
|
||||||
|
}
|
||||||
|
nav ul li a:hover {
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
flex-grow: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 80px 0;
|
||||||
|
}
|
||||||
|
.form-container {
|
||||||
|
background-color: var(--surface-color);
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
|
||||||
|
padding: 48px;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 480px;
|
||||||
|
}
|
||||||
|
.form-title {
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
font-size: 32px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
}
|
||||||
|
form input {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
padding: 16px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 16px;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
form button {
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
color: white;
|
||||||
|
padding: 16px 32px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: none;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.3s ease;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
form button:hover {
|
||||||
|
background-color: #228b80;
|
||||||
|
}
|
||||||
|
.alert-message {
|
||||||
|
color: white;
|
||||||
|
padding: 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
.alert-message.error {
|
||||||
|
background-color: var(--error-color);
|
||||||
|
}
|
||||||
|
.alert-message.success {
|
||||||
|
background-color: var(--success-color);
|
||||||
|
}
|
||||||
|
.form-footer {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 24px;
|
||||||
|
}
|
||||||
|
.form-footer a {
|
||||||
|
color: var(--primary-color);
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
background-color: var(--text-color);
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
padding: 24px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
<header>
|
||||||
<div class="container">
|
<nav class="container">
|
||||||
<a class="navbar-brand" href="index.php">My SaaS</a>
|
<a href="index.php" class="logo">TAP2SKILL</a>
|
||||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
<ul>
|
||||||
<span class="navbar-toggler-icon"></span>
|
<li><a href="index.php#about">About</a></li>
|
||||||
</button>
|
<li><a href="index.php#features">Features</a></li>
|
||||||
<div class="collapse navbar-collapse" id="navbarNav">
|
<li><a href="index.php#testimonials">Testimonials</a></li>
|
||||||
<ul class="navbar-nav ms-auto">
|
<li><a href="index.php#contact">Contact</a></li>
|
||||||
<li class="nav-item">
|
<li><a href="register.php">Register</a></li>
|
||||||
<a class="nav-link" href="index.php">Home</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="register.php">Register</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</nav>
|
||||||
</div>
|
</header>
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div class="container mt-5">
|
<main>
|
||||||
<div class="row justify-content-center">
|
<div class="form-container">
|
||||||
<div class="col-md-6">
|
<h2 class="form-title">Login</h2>
|
||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<h2 class="card-title text-center">Login</h2>
|
|
||||||
|
|
||||||
<?php if (isset($_GET['registered'])): ?>
|
<?php if (isset($_GET['registered'])): ?>
|
||||||
<div class="alert alert-success">Registration successful! Please log in.</div>
|
<div class="alert-message success">Registration successful! Please log in.</div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<?php if ($error): ?>
|
<?php if ($error): ?>
|
||||||
<div class="alert alert-danger"><?php echo htmlspecialchars($error); ?></div>
|
<div class="alert-message error"><?php echo htmlspecialchars($error); ?></div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<form action="login.php" method="post">
|
<form action="login.php" method="post">
|
||||||
<div class="mb-3">
|
<input type="email" name="email" placeholder="Email Address" required>
|
||||||
<label for="email" class="form-label">Email address</label>
|
<input type="password" name="password" placeholder="Password" required>
|
||||||
<input type="email" class="form-control" id="email" name="email" required>
|
<button type="submit">Login</button>
|
||||||
</div>
|
|
||||||
<div class="mb-3">
|
|
||||||
<label for="password" class="form-label">Password</label>
|
|
||||||
<input type="password" class="form-control" id="password" name="password" required>
|
|
||||||
</div>
|
|
||||||
<div class="d-grid">
|
|
||||||
<button type="submit" class="btn btn-primary">Login</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
<div class="form-footer">
|
||||||
<div class="card-footer text-center">
|
|
||||||
<p>Don't have an account? <a href="register.php">Register here</a>.</p>
|
<p>Don't have an account? <a href="register.php">Register here</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</main>
|
||||||
</div>
|
|
||||||
</div>
|
<footer>
|
||||||
|
<div class="container">
|
||||||
|
<p>© 2025 TAP2SKILL. All Rights Reserved.</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
213
register.php
213
register.php
@ -17,13 +17,11 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
|||||||
try {
|
try {
|
||||||
$pdo = db();
|
$pdo = db();
|
||||||
|
|
||||||
// Check for existing user
|
|
||||||
$stmt = $pdo->prepare("SELECT * FROM users WHERE username = :username OR email = :email");
|
$stmt = $pdo->prepare("SELECT * FROM users WHERE username = :username OR email = :email");
|
||||||
$stmt->execute(['username' => $username, 'email' => $email]);
|
$stmt->execute(['username' => $username, 'email' => $email]);
|
||||||
if ($stmt->fetch()) {
|
if ($stmt->fetch()) {
|
||||||
$error = 'Username or email already exists.';
|
$error = 'Username or email already exists.';
|
||||||
} else {
|
} else {
|
||||||
// Insert new user
|
|
||||||
$hashed_password = password_hash($password, PASSWORD_DEFAULT);
|
$hashed_password = password_hash($password, PASSWORD_DEFAULT);
|
||||||
$insert_stmt = $pdo->prepare("INSERT INTO users (username, email, password) VALUES (:username, :email, :password)");
|
$insert_stmt = $pdo->prepare("INSERT INTO users (username, email, password) VALUES (:username, :email, :password)");
|
||||||
$insert_stmt->execute([
|
$insert_stmt->execute([
|
||||||
@ -46,68 +44,183 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>Register - My SaaS</title>
|
<title>Register - TAP2SKILL</title>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="stylesheet" href="assets/css/custom.css">
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Lato:wght@400;700&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--primary-color: #2A9D8F;
|
||||||
|
--secondary-color: #E9C46A;
|
||||||
|
--background-color: #F4F4F4;
|
||||||
|
--surface-color: #FFFFFF;
|
||||||
|
--text-color: #264653;
|
||||||
|
--error-color: #e74c3c;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
margin: 0;
|
||||||
|
background-color: var(--background-color);
|
||||||
|
color: var(--text-color);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 24px;
|
||||||
|
}
|
||||||
|
header {
|
||||||
|
background-color: var(--surface-color);
|
||||||
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||||
|
padding: 16px 0;
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
nav {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--primary-color);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
nav ul {
|
||||||
|
list-style: none;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
nav ul li {
|
||||||
|
margin-left: 32px;
|
||||||
|
}
|
||||||
|
nav ul li a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--text-color);
|
||||||
|
font-weight: 600;
|
||||||
|
transition: color 0.3s ease;
|
||||||
|
}
|
||||||
|
nav ul li a:hover {
|
||||||
|
color: var(--primary-color);
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
flex-grow: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 80px 0;
|
||||||
|
}
|
||||||
|
.form-container {
|
||||||
|
background-color: var(--surface-color);
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
|
||||||
|
padding: 48px;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 480px;
|
||||||
|
}
|
||||||
|
.form-title {
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
font-size: 32px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
}
|
||||||
|
form input {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
padding: 16px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 16px;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
form button {
|
||||||
|
font-family: 'Poppins', sans-serif;
|
||||||
|
background-color: var(--primary-color);
|
||||||
|
color: white;
|
||||||
|
padding: 16px 32px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: none;
|
||||||
|
font-weight: 600;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background-color 0.3s ease;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
form button:hover {
|
||||||
|
background-color: #228b80;
|
||||||
|
}
|
||||||
|
.error-message {
|
||||||
|
background-color: var(--error-color);
|
||||||
|
color: white;
|
||||||
|
padding: 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
.form-footer {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 24px;
|
||||||
|
}
|
||||||
|
.form-footer a {
|
||||||
|
color: var(--primary-color);
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
background-color: var(--text-color);
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
padding: 24px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<nav class="navbar navbar-expand-lg navbar-light bg-light">
|
<header>
|
||||||
<div class="container">
|
<nav class="container">
|
||||||
<a class="navbar-brand" href="index.php">My SaaS</a>
|
<a href="index.php" class="logo">TAP2SKILL</a>
|
||||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
<ul>
|
||||||
<span class="navbar-toggler-icon"></span>
|
<li><a href="index.php#about">About</a></li>
|
||||||
</button>
|
<li><a href="index.php#features">Features</a></li>
|
||||||
<div class="collapse navbar-collapse" id="navbarNav">
|
<li><a href="index.php#testimonials">Testimonials</a></li>
|
||||||
<ul class="navbar-nav ms-auto">
|
<li><a href="index.php#contact">Contact</a></li>
|
||||||
<li class="nav-item">
|
<li><a href="login.php">Login</a></li>
|
||||||
<a class="nav-link" href="index.php">Home</a>
|
|
||||||
</li>
|
|
||||||
<li class="nav-item">
|
|
||||||
<a class="nav-link" href="login.php">Login</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</nav>
|
||||||
</div>
|
</header>
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div class="container mt-5">
|
<main>
|
||||||
<div class="row justify-content-center">
|
<div class="form-container">
|
||||||
<div class="col-md-6">
|
<h2 class="form-title">Create Account</h2>
|
||||||
<div class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<h2 class="card-title text-center">Create Account</h2>
|
|
||||||
|
|
||||||
<?php if ($error): ?>
|
<?php if ($error): ?>
|
||||||
<div class="alert alert-danger"><?php echo htmlspecialchars($error); ?></div>
|
<div class="error-message"><?php echo htmlspecialchars($error); ?></div>
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<form action="register.php" method="post">
|
<form action="register.php" method="post">
|
||||||
<div class="mb-3">
|
<input type="text" name="username" placeholder="Username" required>
|
||||||
<label for="username" class="form-label">Username</label>
|
<input type="email" name="email" placeholder="Email Address" required>
|
||||||
<input type="text" class="form-control" id="username" name="username" required>
|
<input type="password" name="password" placeholder="Password" required>
|
||||||
</div>
|
<button type="submit">Register</button>
|
||||||
<div class="mb-3">
|
|
||||||
<label for="email" class="form-label">Email address</label>
|
|
||||||
<input type="email" class="form-control" id="email" name="email" required>
|
|
||||||
</div>
|
|
||||||
<div class="mb-3">
|
|
||||||
<label for="password" class="form-label">Password</label>
|
|
||||||
<input type="password" class="form-control" id="password" name="password" required>
|
|
||||||
</div>
|
|
||||||
<div class="d-grid">
|
|
||||||
<button type="submit" class="btn btn-primary">Register</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
<div class="form-footer">
|
||||||
<div class="card-footer text-center">
|
|
||||||
<p>Already have an account? <a href="login.php">Login here</a>.</p>
|
<p>Already have an account? <a href="login.php">Login here</a>.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</main>
|
||||||
</div>
|
|
||||||
</div>
|
<footer>
|
||||||
|
<div class="container">
|
||||||
|
<p>© 2025 TAP2SKILL. All Rights Reserved.</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Loading…
x
Reference in New Issue
Block a user