164 lines
7.6 KiB
PHP
164 lines
7.6 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Fuel Distribution Co.</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css">
|
|
</head>
|
|
<body>
|
|
|
|
<?php
|
|
session_start();
|
|
?>
|
|
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark-blue">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="#">FuelDistro</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="#about">About</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#services">Services</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#contact">Contact</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="btn btn-brand-orange ms-lg-3" href="login.php">Customer Login</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="admin.php">Admin</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
<?php
|
|
require_once 'includes/pexels.php';
|
|
$hero_image_data = pexels_get('https://api.pexels.com/v1/search?query=gas+station&orientation=landscape&per_page=1&page=1');
|
|
$hero_image = 'https://images.pexels.com/photos/258154/pexels-photo-258154.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1'; // Fallback
|
|
if ($hero_image_data && !empty($hero_image_data['photos'])) {
|
|
$photo = $hero_image_data['photos'][0];
|
|
$src = $photo['src']['large2x'] ?? ($photo['src']['large'] ?? $photo['src']['original']);
|
|
$target = __DIR__ . '/assets/images/pexels/' . $photo['id'] . '.jpg';
|
|
download_to($src, $target);
|
|
$hero_image = 'assets/images/pexels/' . $photo['id'] . '.jpg';
|
|
}
|
|
|
|
$about_image_data = pexels_get('https://api.pexels.com/v1/search?query=fuel+truck&orientation=landscape&per_page=1&page=1');
|
|
$about_image = 'https://images.pexels.com/photos/3184418/pexels-photo-3184418.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1'; // Fallback
|
|
if ($about_image_data && !empty($about_image_data['photos'])) {
|
|
$photo = $about_image_data['photos'][0];
|
|
$src = $photo['src']['large2x'] ?? ($photo['src']['large'] ?? $photo['src']['original']);
|
|
$target = __DIR__ . '/assets/images/pexels/' . $photo['id'] . '.jpg';
|
|
download_to($src, $target);
|
|
$about_image = 'assets/images/pexels/' . $photo['id'] . '.jpg';
|
|
}
|
|
?>
|
|
|
|
<header class="hero-section text-white text-center" style="background-image: url('<?php echo $hero_image; ?>');">
|
|
<div class="container">
|
|
<h1 class="display-4">Reliable Fuel Distribution</h1>
|
|
<p class="lead">Your trusted partner for timely petrol and diesel supply.</p>
|
|
</div>
|
|
</header>
|
|
|
|
<section id="about" class="py-5">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<h2>About Us</h2>
|
|
<p>We are a leading fuel distribution company dedicated to providing businesses with high-quality petrol and diesel. Our commitment to efficiency and customer service ensures your operations never run dry. We offer customized pricing and delivery schedules to meet your specific needs.</p>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<img src="<?php echo $about_image; ?>" class="img-fluid rounded" alt="About Us Image">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
<section id="services" class="bg-light py-5">
|
|
<div class="container">
|
|
<div class="text-center mb-5">
|
|
<h2>Our Services</h2>
|
|
<p class="lead">We deliver petrol and diesel directly to your business.</p>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="card mb-4">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Petrol Delivery</h5>
|
|
<p class="card-text">High-octane petrol for your fleet and machinery, delivered on schedule.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="card mb-4">
|
|
<div class="card-body">
|
|
<h5 class="card-title">Diesel Delivery</h5>
|
|
<p class="card-text">Bulk diesel for commercial vehicles, generators, and industrial equipment.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="contact" class="py-5">
|
|
<div class="container">
|
|
<div class="text-center mb-5">
|
|
<h2>Contact Us</h2>
|
|
<p class="lead">Interested in opening an account? Fill out the form below.</p>
|
|
</div>
|
|
|
|
<?php if (isset($_SESSION['status'])): ?>
|
|
<div class="alert alert-<?php echo $_SESSION['status']['type']; ?> alert-dismissible fade show" role="alert">
|
|
<?php echo $_SESSION['status']['message']; ?>
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
|
</div>
|
|
<?php unset($_SESSION['status']); ?>
|
|
<?php endif; ?>
|
|
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-8">
|
|
<form action="contact_handler.php" method="POST">
|
|
<div class="mb-3">
|
|
<label for="name" class="form-label">Your Name</label>
|
|
<input type="text" class="form-control" id="name" name="name" required>
|
|
</div>
|
|
<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="message" class="form-label">Message</label>
|
|
<textarea class="form-control" id="message" name="message" rows="5" required></textarea>
|
|
</div>
|
|
<div class="text-center">
|
|
<button type="submit" class="btn btn-brand-orange btn-lg">Request Account</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer class="bg-dark-blue text-white text-center py-3">
|
|
<div class="container">
|
|
<p>© 2025 FuelDistro. All Rights Reserved.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
|
</body>
|
|
</html>
|