Compare commits
No commits in common. "ai-dev" and "master" have entirely different histories.
@ -1,27 +0,0 @@
|
|||||||
|
|
||||||
body {
|
|
||||||
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
font-family: Georgia, 'Times New Roman', Times, serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hero {
|
|
||||||
background: linear-gradient(45deg, #0d6efd, #6f42c1);
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
section {
|
|
||||||
padding: 60px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.portfolio-item img {
|
|
||||||
width: 100%;
|
|
||||||
height: 200px;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
.testimonial-card {
|
|
||||||
background-color: #f8f9fa;
|
|
||||||
}
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', function () {
|
|
||||||
// Smooth scrolling for navigation links
|
|
||||||
const navLinks = document.querySelectorAll('.nav-link');
|
|
||||||
|
|
||||||
for (const link of navLinks) {
|
|
||||||
if (link.hash !== "") {
|
|
||||||
link.addEventListener('click', function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
const hash = this.hash;
|
|
||||||
|
|
||||||
document.querySelector(hash).scrollIntoView({
|
|
||||||
behavior: 'smooth'
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
289
index.php
289
index.php
@ -1,157 +1,150 @@
|
|||||||
<!DOCTYPE html>
|
<?php
|
||||||
|
declare(strict_types=1);
|
||||||
|
@ini_set('display_errors', '1');
|
||||||
|
@error_reporting(E_ALL);
|
||||||
|
@date_default_timezone_set('UTC');
|
||||||
|
|
||||||
|
$phpVersion = PHP_VERSION;
|
||||||
|
$now = date('Y-m-d H:i:s');
|
||||||
|
?>
|
||||||
|
<!doctype html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<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" />
|
||||||
<title><?php echo htmlspecialchars($_SERVER['PROJECT_NAME'] ?? 'Personal Portfolio'); ?></title>
|
<title>New Style</title>
|
||||||
<meta name="description" content="<?php echo htmlspecialchars($_SERVER['PROJECT_DESCRIPTION'] ?? 'A personal portfolio website.'); ?>">
|
<?php
|
||||||
|
// Read project preview data from environment
|
||||||
<!-- Bootstrap CSS -->
|
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
||||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
?>
|
||||||
|
<?php if ($projectDescription): ?>
|
||||||
<!-- Custom CSS -->
|
<!-- Meta description -->
|
||||||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
<meta name="description" content='<?= htmlspecialchars($projectDescription) ?>' />
|
||||||
|
<!-- Open Graph meta tags -->
|
||||||
|
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||||
|
<!-- Twitter meta tags -->
|
||||||
|
<meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php if ($projectImageUrl): ?>
|
||||||
|
<!-- Open Graph image -->
|
||||||
|
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||||
|
<!-- Twitter image -->
|
||||||
|
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
||||||
|
<?php endif; ?>
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
:root {
|
||||||
|
--bg-color-start: #6a11cb;
|
||||||
|
--bg-color-end: #2575fc;
|
||||||
|
--text-color: #ffffff;
|
||||||
|
--card-bg-color: rgba(255, 255, 255, 0.01);
|
||||||
|
--card-border-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
font-family: 'Inter', sans-serif;
|
||||||
|
background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end));
|
||||||
|
color: var(--text-color);
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
min-height: 100vh;
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
body::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M-10 10L110 10M10 -10L10 110" stroke-width="1" stroke="rgba(255,255,255,0.05)"/></svg>');
|
||||||
|
animation: bg-pan 20s linear infinite;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
@keyframes bg-pan {
|
||||||
|
0% { background-position: 0% 0%; }
|
||||||
|
100% { background-position: 100% 100%; }
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
.card {
|
||||||
|
background: var(--card-bg-color);
|
||||||
|
border: 1px solid var(--card-border-color);
|
||||||
|
border-radius: 16px;
|
||||||
|
padding: 2rem;
|
||||||
|
backdrop-filter: blur(20px);
|
||||||
|
-webkit-backdrop-filter: blur(20px);
|
||||||
|
box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.loader {
|
||||||
|
margin: 1.25rem auto 1.25rem;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
border: 3px solid rgba(255, 255, 255, 0.25);
|
||||||
|
border-top-color: #fff;
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: spin 1s linear infinite;
|
||||||
|
}
|
||||||
|
@keyframes spin {
|
||||||
|
from { transform: rotate(0deg); }
|
||||||
|
to { transform: rotate(360deg); }
|
||||||
|
}
|
||||||
|
.hint {
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
.sr-only {
|
||||||
|
position: absolute;
|
||||||
|
width: 1px; height: 1px;
|
||||||
|
padding: 0; margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
clip: rect(0, 0, 0, 0);
|
||||||
|
white-space: nowrap; border: 0;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
font-size: 3rem;
|
||||||
|
font-weight: 700;
|
||||||
|
margin: 0 0 1rem;
|
||||||
|
letter-spacing: -1px;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: 0.5rem 0;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
code {
|
||||||
|
background: rgba(0,0,0,0.2);
|
||||||
|
padding: 2px 6px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||||
|
}
|
||||||
|
footer {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 1rem;
|
||||||
|
font-size: 0.8rem;
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<main>
|
||||||
<!-- Navigation -->
|
<div class="card">
|
||||||
<nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
|
<h1>Analyzing your requirements and generating your website…</h1>
|
||||||
<div class="container">
|
<div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
|
||||||
<a class="navbar-brand" href="#"><?php echo htmlspecialchars($_SERVER['PROJECT_NAME'] ?? 'Portfolio'); ?></a>
|
<span class="sr-only">Loading…</span>
|
||||||
<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="#intro">Intro</a></li>
|
|
||||||
<li class="nav-item"><a class="nav-link" href="#about">About</a></li>
|
|
||||||
<li class="nav-item"><a class="nav-link" href="#portfolio">Portfolio</a></li>
|
|
||||||
<li class="nav-item"><a class="nav-link" href="#testimonials">Testimonials</a></li>
|
|
||||||
<li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
|
<p class="hint"><?= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.</p>
|
||||||
|
<p class="hint">This page will update automatically as the plan is implemented.</p>
|
||||||
|
<p>Runtime: PHP <code><?= htmlspecialchars($phpVersion) ?></code> — UTC <code><?= htmlspecialchars($now) ?></code></p>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</main>
|
||||||
|
<footer>
|
||||||
<!-- Intro Section -->
|
Page updated: <?= htmlspecialchars($now) ?> (UTC)
|
||||||
<header id="intro" class="hero text-center py-5">
|
|
||||||
<div class="container">
|
|
||||||
<h1 class="display-4">Welcome to My Portfolio</h1>
|
|
||||||
<p class="lead">I build beautiful and functional websites.</p>
|
|
||||||
<a href="#portfolio" class="btn btn-light btn-lg">See My Work</a>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- About Section -->
|
|
||||||
<section id="about" class="py-5">
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-8 mx-auto text-center">
|
|
||||||
<h2 class="mb-4">About Me</h2>
|
|
||||||
<p class="lead">This is a placeholder for your about section. Talk about your passion, your skills, and your experience. Make it personal and engaging. Let visitors know who you are beyond the professional. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Portfolio Section -->
|
|
||||||
<section id="portfolio" class="bg-light py-5">
|
|
||||||
<div class="container">
|
|
||||||
<h2 class="text-center mb-5">Portfolio</h2>
|
|
||||||
<div class="row">
|
|
||||||
<!-- Portfolio Item 1 -->
|
|
||||||
<div class="col-md-4 mb-4">
|
|
||||||
<div class="card portfolio-item">
|
|
||||||
<img src="https://picsum.photos/seed/p1/400/200" class="card-img-top" alt="Project 1">
|
|
||||||
<div class="card-body">
|
|
||||||
<h5 class="card-title">Project One</h5>
|
|
||||||
<p class="card-text">A brief description of the project. What was the challenge and how you solved it.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Portfolio Item 2 -->
|
|
||||||
<div class="col-md-4 mb-4">
|
|
||||||
<div class="card portfolio-item">
|
|
||||||
<img src="https://picsum.photos/seed/p2/400/200" class="card-img-top" alt="Project 2">
|
|
||||||
<div class="card-body">
|
|
||||||
<h5 class="card-title">Project Two</h5>
|
|
||||||
<p class="card-text">A brief description of the project. What was the challenge and how you solved it.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Portfolio Item 3 -->
|
|
||||||
<div class="col-md-4 mb-4">
|
|
||||||
<div class="card portfolio-item">
|
|
||||||
<img src="https://picsum.photos/seed/p3/400/200" class="card-img-top" alt="Project 3">
|
|
||||||
<div class="card-body">
|
|
||||||
<h5 class="card-title">Project Three</h5>
|
|
||||||
<p class="card-text">A brief description of the project. What was the challenge and how you solved it.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Testimonials Section -->
|
|
||||||
<section id="testimonials" class="py-5">
|
|
||||||
<div class="container">
|
|
||||||
<h2 class="text-center mb-5">Testimonials</h2>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-6 mx-auto">
|
|
||||||
<div class="card testimonial-card p-4 mb-4">
|
|
||||||
<p class="mb-0">"This is a placeholder testimonial. A great quote from a happy client goes here. It builds trust and credibility."</p>
|
|
||||||
<footer class="blockquote-footer mt-2">Client Name, <cite title="Source Title">Company</cite></footer>
|
|
||||||
</div>
|
|
||||||
<div class="card testimonial-card p-4">
|
|
||||||
<p class="mb-0">"Another fantastic quote. Highlighting specific positive outcomes is very effective. Keep it short and impactful."</p>
|
|
||||||
<footer class="blockquote-footer mt-2">Another Client, <cite title="Source Title">Organization</cite></footer>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Contact Section -->
|
|
||||||
<section id="contact" class="bg-light py-5">
|
|
||||||
<div class="container">
|
|
||||||
<h2 class="text-center mb-4">Contact Me</h2>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-6 mx-auto">
|
|
||||||
<form>
|
|
||||||
<div class="mb-3">
|
|
||||||
<label for="name" class="form-label">Name</label>
|
|
||||||
<input type="text" class="form-control" id="name" required>
|
|
||||||
</div>
|
|
||||||
<div class="mb-3">
|
|
||||||
<label for="email" class="form-label">Email address</label>
|
|
||||||
<input type="email" class="form-control" id="email" required>
|
|
||||||
</div>
|
|
||||||
<div class="mb-3">
|
|
||||||
<label for="message" class="form-label">Message</label>
|
|
||||||
<textarea class="form-control" id="message" rows="4" required></textarea>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn btn-primary w-100">Send Message</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Footer -->
|
|
||||||
<footer class="py-4 bg-dark text-white text-center">
|
|
||||||
<div class="container">
|
|
||||||
<a href="#" class="text-white me-3"><i class="bi bi-twitter"></i></a>
|
|
||||||
<a href="#" class="text-white me-3"><i class="bi bi-linkedin"></i></a>
|
|
||||||
<a href="#" class="text-white"><i class="bi bi-github"></i></a>
|
|
||||||
<p class="mt-3 mb-0">Copyright © <?php echo date("Y"); ?>. All Rights Reserved.</p>
|
|
||||||
</div>
|
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<!-- Bootstrap JS -->
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
|
||||||
<!-- Custom JS -->
|
|
||||||
<script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Loading…
x
Reference in New Issue
Block a user