91 lines
4.6 KiB
PHP
91 lines
4.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>Flatlogic LAMP Demo</title>
|
|
<meta name="description" content="A playful demo site that shows what the new Flatlogic LAMP template can do.">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
|
</head>
|
|
<body>
|
|
|
|
<?php include 'navbar.php'; ?>
|
|
|
|
<main>
|
|
<section class="hero text-center">
|
|
<div class="container">
|
|
<h1 class="display-3 fw-bold">Generate a Website With a Vibe</h1>
|
|
<p class="lead col-lg-8 mx-auto text-muted">Tell our AI your vibe, and we'll spin up a micro-site in seconds. From Synthwave to Brutalism, discover your digital aesthetic.</p>
|
|
<a href="vibe.php" class="btn btn-primary btn-lg px-4">
|
|
<i class="bi bi-stars"></i>
|
|
Create a Vibe Site
|
|
</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="py-5 bg-light">
|
|
<div class="container">
|
|
<div class="row text-center g-4">
|
|
<div class="col-lg-4">
|
|
<div class="card h-100 p-4">
|
|
<img id="img-vibe" src="https://picsum.photos/seed/lamp-vibe/800/600" class="card-img-top rounded mb-3" alt="A colorful, abstract image representing different design vibes.">
|
|
<div class="card-body">
|
|
<h3 class="h4">Vibe Generator</h3>
|
|
<p>Choose a vibe, give us a keyword, and watch the magic happen. Your own micro-site, generated by AI.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="card h-100 p-4">
|
|
<img id="img-code" src="https://picsum.photos/seed/lamp-code/800/600" class="card-img-top rounded mb-3" alt="A snippet of code on a dark background, representing the PHP sandbox.">
|
|
<div class="card-body">
|
|
<h3 class="h4">PHP Sandbox</h3>
|
|
<p>Safely run PHP code snippets in an isolated environment. Perfect for testing and learning.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="card h-100 p-4">
|
|
<img id="img-seo" src="https://picsum.photos/seed/lamp-seo/800/600" class="card-img-top rounded mb-3" alt="A magnifying glass over a web page, symbolizing SEO analysis.">
|
|
<div class="card-body">
|
|
<h3 class="h4">SEO Checker</h3>
|
|
<p>Paste your HTML and get instant feedback on your on-page SEO, powered by AI analysis.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="py-5 bg-dark text-white">
|
|
<div class="container text-center">
|
|
<p class="mb-0">© <?php echo date("Y"); ?> Flatlogic. All rights reserved.</p>
|
|
<p class="mb-0">
|
|
<a href="contact.php" class="text-white">Contact</a> |
|
|
<a href="#" class="text-white">Privacy Policy</a> |
|
|
<a href="#" class="text-white">Terms of Service</a>
|
|
</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
fetch('api/pexels.php?queries=vibe,code,seo')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data && data.length === 3) {
|
|
document.getElementById('img-vibe').src = data[0].src;
|
|
document.getElementById('img-code').src = data[1].src;
|
|
document.getElementById('img-seo').src = data[2].src;
|
|
}
|
|
})
|
|
.catch(error => console.error('Error fetching images:', error));
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|