frist good
This commit is contained in:
parent
11336c0d33
commit
b2bd22e909
@ -1,26 +1,49 @@
|
||||
/* E-Waste Reclaimer Custom Styles */
|
||||
|
||||
:root {
|
||||
--primary-color: #28a745;
|
||||
--secondary-color: #6c757d;
|
||||
--light-gray: #f8f9fa;
|
||||
--dark-color: #343a40;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
background-color: #28a745;
|
||||
border-color: #28a745;
|
||||
main {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.btn-success:hover {
|
||||
.navbar-brand {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: var(--primary-color);
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background-color: #218838;
|
||||
border-color: #1e7e34;
|
||||
}
|
||||
|
||||
.text-success {
|
||||
color: #28a745 !important;
|
||||
color: var(--primary-color) !important;
|
||||
}
|
||||
|
||||
.card {
|
||||
transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
|
||||
.hero-section {
|
||||
background: linear-gradient(to right, rgba(40, 167, 69, 0.1), rgba(248, 249, 250, 0.1)), var(--light-gray);
|
||||
border-bottom: 5px solid var(--primary-color);
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
|
||||
.card-icon i {
|
||||
color: var(--primary-color);
|
||||
}
|
||||
.bg-dark {
|
||||
background-color: var(--dark-color) !important;
|
||||
}
|
||||
footer {
|
||||
background-color: var(--dark-color);
|
||||
}
|
||||
@ -14,49 +14,66 @@ require_once 'db/config.php';
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Dashboard - E-Waste Reclaimer</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container">
|
||||
<div class="logo">
|
||||
<h1><a href="index.php">E-Waste Reclaimer</a></h1>
|
||||
</div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.php">Find a Center</a></li>
|
||||
<li><a href="dashboard.php">Dashboard</a></li>
|
||||
<li><a href="logout.php">Logout</a></li>
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.php"><i class="fas fa-recycle me-2"></i>E-Waste Reclaimer</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">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="index.php">Find a Center</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="dashboard.php">Dashboard</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="logout.php">Logout</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="container page-main">
|
||||
<section>
|
||||
<h2>Welcome, <?php echo htmlspecialchars($_SESSION['user_name']); ?>!</h2>
|
||||
<p>This is your dashboard. From here you will be able to submit e-waste, track your points, and see your submission history.</p>
|
||||
<main class="container my-5">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h1>Welcome, <?php echo htmlspecialchars($_SESSION['user_name']); ?>!</h1>
|
||||
</div>
|
||||
|
||||
<div class="dashboard-stats">
|
||||
<div class="stat-card">
|
||||
<h3>Your Points</h3>
|
||||
<p class="points-total">0</p>
|
||||
<p>Keep recycling to earn more!</p>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<h3>Submissions</h3>
|
||||
<p class="submissions-total">0</p>
|
||||
<a href="#" class="btn btn-secondary">Submit New E-Waste</a>
|
||||
<p class="lead mb-5">This is your dashboard. From here you can submit e-waste, track your points, and view your submission history.</p>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-4">
|
||||
<div class="card text-center h-100 shadow-sm">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Your Points</h5>
|
||||
<p class="display-4 text-success fw-bold">0</p>
|
||||
<p class="card-text">Keep recycling to earn more!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb-4">
|
||||
<div class="card text-center h-100 shadow-sm">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Your Submissions</h5>
|
||||
<p class="display-4 fw-bold">0</p>
|
||||
<a href="#" class="btn btn-primary">Submit New E-Waste</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</div>
|
||||
<footer class="bg-dark text-white text-center p-3 mt-auto">
|
||||
<p class="mb-0">© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
82
index.php
82
index.php
@ -9,40 +9,52 @@ require_once 'db/config.php';
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>E-Waste Reclaimer</title>
|
||||
<meta name="description" content="A platform to help you recycle your e-waste responsibly.">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container">
|
||||
<div class="logo">
|
||||
<h1><a href="index.php">E-Waste Reclaimer</a></h1>
|
||||
</div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.php">Find a Center</a></li>
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.php"><i class="fas fa-recycle me-2"></i>E-Waste Reclaimer</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">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="index.php">Find a Center</a>
|
||||
</li>
|
||||
<?php if (isset($_SESSION['loggedin']) && $_SESSION['loggedin'] === true): ?>
|
||||
<li><a href="dashboard.php">Dashboard</a></li>
|
||||
<li><a href="logout.php">Logout</a></li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="dashboard.php">Dashboard</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="logout.php">Logout</a>
|
||||
</li>
|
||||
<?php else: ?>
|
||||
<li><a href="login.php">Login</a></li>
|
||||
<li><a href="register.php">Register</a></li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="login.php">Login</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="register.php">Register</a>
|
||||
</li>
|
||||
<?php endif; ?>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="container page-main">
|
||||
<section class="hero">
|
||||
<h2>Welcome to E-Waste Reclaimer</h2>
|
||||
<p>Your partner in responsible electronics recycling. Find a center near you and help us build a sustainable future.</p>
|
||||
<a href="#centers-list" class="btn btn-primary">Find a Center</a>
|
||||
</section>
|
||||
<main class="container my-5">
|
||||
<div class="bg-light p-5 rounded-3 text-center shadow-sm hero-section">
|
||||
<h1 class="display-4">Welcome to E-Waste Reclaimer</h1>
|
||||
<p class="lead">Your partner in responsible electronics recycling. Find a center near you and help us build a sustainable future.</p>
|
||||
<a href="#centers-list" class="btn btn-primary btn-lg">Find a Recycling Center</a>
|
||||
</div>
|
||||
|
||||
<section id="centers-list" class="centers-section">
|
||||
<h2>Recycling Centers</h2>
|
||||
<div class="card-container">
|
||||
<section id="centers-list" class="py-5">
|
||||
<h2 class="text-center mb-4">Recycling Centers</h2>
|
||||
<div class="row">
|
||||
<?php
|
||||
try {
|
||||
$pdo = db();
|
||||
@ -70,24 +82,30 @@ require_once 'db/config.php';
|
||||
|
||||
if (!empty($centers)):
|
||||
foreach ($centers as $center): ?>
|
||||
<div class="card">
|
||||
<div class="card-icon"><i class="fas fa-recycle"></i></div>
|
||||
<h3><?php echo htmlspecialchars($center['name']); ?></h3>
|
||||
<p><i class="fas fa-map-marker-alt"></i> <?php echo htmlspecialchars($center['address']); ?></p>
|
||||
<p><i class="fas fa-envelope"></i> <?php echo htmlspecialchars($center['contact']); ?></p>
|
||||
<div class="col-md-4 mb-4">
|
||||
<div class="card h-100 shadow-sm">
|
||||
<div class="card-body text-center">
|
||||
<div class="card-icon mb-3"><i class="fas fa-recycle fa-3x text-success"></i></div>
|
||||
<h5 class="card-title"><?php echo htmlspecialchars($center['name']); ?></h5>
|
||||
<p class="card-text"><i class="fas fa-map-marker-alt me-2"></i><?php echo htmlspecialchars($center['address']); ?></p>
|
||||
<p class="card-text"><i class="fas fa-envelope me-2"></i><?php echo htmlspecialchars($center['contact']); ?></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach;
|
||||
else: ?>
|
||||
<div class="col">
|
||||
<div class="alert alert-info">No recycling centers found. Please check back later.</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</div>
|
||||
<footer class="bg-dark text-white text-center p-3">
|
||||
<p class="mb-0">© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
73
login.php
73
login.php
@ -49,64 +49,77 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Login - E-Waste Reclaimer</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container">
|
||||
<div class="logo">
|
||||
<h1><a href="index.php">E-Waste Reclaimer</a></h1>
|
||||
</div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.php">Find a Center</a></li>
|
||||
<li><a href="login.php">Login</a></li>
|
||||
<li><a href="register.php">Register</a></li>
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.php"><i class="fas fa-recycle me-2"></i>E-Waste Reclaimer</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">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="index.php">Find a Center</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="login.php">Login</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="register.php">Register</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="container page-main">
|
||||
<section class="form-section">
|
||||
<h2>Login to Your Account</h2>
|
||||
<p>Access your dashboard to track your e-waste submissions.</p>
|
||||
<main class="container my-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-6">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body p-5">
|
||||
<h2 class="card-title text-center mb-4">Login to Your Account</h2>
|
||||
|
||||
<?php if (!empty($errors)): ?>
|
||||
<div class="alert alert-danger">
|
||||
<?php foreach ($errors as $error): ?>
|
||||
<p><?php echo htmlspecialchars($error); ?></p>
|
||||
<p class="mb-0"><?php echo htmlspecialchars($error); ?></p>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($success_msg): ?>
|
||||
<div class="alert alert-success">
|
||||
<p><?php echo htmlspecialchars($success_msg); ?></p>
|
||||
<p class="mb-0"><?php echo htmlspecialchars($success_msg); ?></p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form action="login.php" method="post">
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" required>
|
||||
<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="form-group">
|
||||
<label for="password">Password</label>
|
||||
<input type="password" id="password" name="password" required>
|
||||
<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="form-group">
|
||||
<div class="d-grid">
|
||||
<button type="submit" class="btn btn-primary">Login</button>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</div>
|
||||
<footer class="bg-dark text-white text-center p-3 mt-auto">
|
||||
<p class="mb-0">© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
78
register.php
78
register.php
@ -3,7 +3,6 @@ session_start();
|
||||
require_once 'db/config.php';
|
||||
|
||||
$errors = [];
|
||||
$success = '';
|
||||
|
||||
if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
$name = trim($_POST['name']);
|
||||
@ -46,62 +45,75 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Register - E-Waste Reclaimer</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container">
|
||||
<div class="logo">
|
||||
<h1><a href="index.php">E-Waste Reclaimer</a></h1>
|
||||
</div>
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="index.php">Find a Center</a></li>
|
||||
<li><a href="login.php">Login</a></li>
|
||||
<li><a href="register.php">Register</a></li>
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="index.php"><i class="fas fa-recycle me-2"></i>E-Waste Reclaimer</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">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="index.php">Find a Center</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="login.php">Login</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="register.php">Register</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="container page-main">
|
||||
<section class="form-section">
|
||||
<h2>Create an Account</h2>
|
||||
<p>Join our community to start recycling and earning points.</p>
|
||||
<main class="container my-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-6">
|
||||
<div class="card shadow-sm">
|
||||
<div class="card-body p-5">
|
||||
<h2 class="card-title text-center mb-4">Create an Account</h2>
|
||||
|
||||
<?php if (!empty($errors)): ?>
|
||||
<div class="alert alert-danger">
|
||||
<?php foreach ($errors as $error): ?>
|
||||
<p><?php echo htmlspecialchars($error); ?></p>
|
||||
<p class="mb-0"><?php echo htmlspecialchars($error); ?></p>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form action="register.php" method="post">
|
||||
<div class="form-group">
|
||||
<label for="name">Full Name</label>
|
||||
<input type="text" id="name" name="name" required>
|
||||
<div class="mb-3">
|
||||
<label for="name" class="form-label">Full Name</label>
|
||||
<input type="text" class="form-control" id="name" name="name" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" required>
|
||||
<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="form-group">
|
||||
<label for="password">Password</label>
|
||||
<input type="password" id="password" name="password" required minlength="6">
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label>
|
||||
<input type="password" class="form-control" id="password" name="password" required minlength="6">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="d-grid">
|
||||
<button type="submit" class="btn btn-primary">Register</button>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</div>
|
||||
<footer class="bg-dark text-white text-center p-3 mt-auto">
|
||||
<p class="mb-0">© <?php echo date("Y"); ?> E-Waste Reclaimer. All Rights Reserved.</p>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user