224 lines
12 KiB
PHP
224 lines
12 KiB
PHP
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Aperture – The Intelligent Compute Fabric</title>
|
||
<meta name="description" content="Aperture is the unified compute layer for AI: submit once, run anywhere—cheapest, fastest, compliant.">
|
||
|
||
<!-- Open Graph -->
|
||
<meta property="og:title" content="Aperture – The Intelligent Compute Fabric">
|
||
<meta property="og:description" content="Submit AI workloads once, run anywhere on the globally optimal compute.">
|
||
<meta property="og:image" content="https://picsum.photos/seed/aperture-og/1200/630">
|
||
<meta property="og:url" content="[YOUR_APP_URL]">
|
||
<meta property="og:type" content="website">
|
||
|
||
<!-- Styles -->
|
||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||
<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;600;700&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
|
||
<script src="https://unpkg.com/feather-icons"></script>
|
||
</head>
|
||
<body>
|
||
|
||
<!-- Navbar -->
|
||
<nav class="navbar navbar-expand-lg navbar-dark fixed-top">
|
||
<div class="container">
|
||
<a class="navbar-brand" href="#">
|
||
<i data-feather="aperture" class="me-2"></i> Aperture
|
||
</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="#features">Features</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
|
||
<li class="nav-item"><a class="nav-link" href="login.php">Login</a></li>
|
||
<li class="nav-item ms-lg-3"><a class="btn btn-primary" href="register.php">Register</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- Hero -->
|
||
<header class="hero text-white text-center">
|
||
<div class="container">
|
||
<h1 class="display-3 fw-bold mb-4">Unified Compute, Unlocked.</h1>
|
||
<p class="lead mb-5 col-lg-8 mx-auto">Aperture is the intelligent compute layer for AI. Submit once, run anywhere—cheapest, fastest, compliant.</p>
|
||
<div>
|
||
<a href="#" class="btn btn-primary btn-lg">Get Started</a>
|
||
<a href="#" class="btn btn-secondary btn-lg ms-3">View Docs</a>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- Social Proof -->
|
||
<section class="py-5">
|
||
<div class="container text-center">
|
||
<p class="text-uppercase small text-muted mb-4">Routing workloads across the world's best providers</p>
|
||
<div class="d-flex flex-wrap justify-content-center align-items-center">
|
||
<img src="https://upload.wikimedia.org/wikipedia/commons/9/93/Amazon_Web_Services_Logo.svg" alt="AWS Logo" class="mx-4 my-2">
|
||
<img src="https://upload.wikimedia.org/wikipedia/commons/2/2f/Google_Cloud_logo.svg" alt="Google Cloud Logo" class="mx-4 my-2">
|
||
<img src="https://upload.wikimedia.org/wikipedia/commons/e/e5/Microsoft_Azure_Logo.svg" alt="Azure Logo" class="mx-4 my-2">
|
||
<img src="https://upload.wikimedia.org/wikipedia/commons/4/4b/Cloudflare_Logo.svg" alt="Cloudflare Logo" class="mx-4 my-2" style="max-height: 30px;">
|
||
<img src="https://images.g2crowd.com/uploads/product/image/social_landscape/social_landscape_bf039841426276a8238599575e7043d5/coreweave.png" alt="CoreWeave Logo" class="mx-4 my-2">
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Main Content -->
|
||
<main>
|
||
<!-- Feature 1: Offer Explorer -->
|
||
<section id="features" class="section">
|
||
<div class="container">
|
||
<div class="row align-items-center g-5">
|
||
<div class="col-lg-6">
|
||
<h2>Find Optimal Compute, Instantly.</h2>
|
||
<p class="lead text-muted">Query our global index of compute providers to find the perfect balance of price, performance, and availability for your workload. Stop overpaying for idle instances.</p>
|
||
<img src="https://picsum.photos/seed/aperture-f1/800/600" class="img-fluid rounded-3 mt-4" alt="Diagram showing a job being routed to multiple cloud providers">
|
||
</div>
|
||
<div class="col-lg-6">
|
||
<div class="offer-explorer-card">
|
||
<h4 class="mb-4">Compute Offer Explorer</h4>
|
||
<form id="offer-explorer-form">
|
||
<div class="row g-3">
|
||
<div class="col-md-6">
|
||
<label for="gpuType" class="form-label">GPU Type</label>
|
||
<select id="gpuType" class="form-select">
|
||
<option value="any">Any</option>
|
||
<option value="H100">NVIDIA H100</option>
|
||
<option value="A100">NVIDIA A100</option>
|
||
<option value="RTX 4090">NVIDIA RTX 4090</option>
|
||
</select>
|
||
</div>
|
||
<div class="col-md-6 d-flex align-items-end">
|
||
<div class="form-check form-switch">
|
||
<input class="form-check-input" type="checkbox" role="switch" id="spotOk" checked>
|
||
<label class="form-check-label" for="spotOk">Spot Instances OK</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<button type="submit" class="btn btn-primary mt-4 w-100">Search Offers</button>
|
||
</form>
|
||
<div class="mt-4">
|
||
<table class="table table-hover">
|
||
<thead>
|
||
<tr>
|
||
<th>Provider</th>
|
||
<th>GPU</th>
|
||
<th>Region</th>
|
||
<th>Price/hr</th>
|
||
<th>Spot</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="offer-results-body">
|
||
<!-- JS will populate this -->
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Feature 2: How it works -->
|
||
<section class="section bg-darker">
|
||
<div class="container">
|
||
<div class="text-center col-lg-8 mx-auto">
|
||
<h2 class="mb-3">A Smarter Way to Run AI</h2>
|
||
<p class="lead text-muted">Aperture decouples your workload from the underlying infrastructure, so you can focus on building, not billing.</p>
|
||
</div>
|
||
<div class="row g-4 mt-5 text-center">
|
||
<div class="col-md-4">
|
||
<div class="feature-card">
|
||
<i data-feather="upload-cloud" class="text-primary mb-3" style="width: 48px; height: 48px;"></i>
|
||
<h4>1. Submit Job</h4>
|
||
<p>Define your workload, data, and constraints using our simple API or web console.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="feature-card">
|
||
<i data-feather="cpu" class="text-primary mb-3" style="width: 48px; height: 48px;"></i>
|
||
<h4>2. Orchestrate</h4>
|
||
<p>Aperture's intelligent scheduler finds the globally optimal compute to run your job.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="feature-card">
|
||
<i data-feather="terminal" class="text-primary mb-3" style="width: 48px; height: 48px;"></i>
|
||
<h4>3. Run & Monitor</h4>
|
||
<p>We deploy your job, monitor its status, and stream logs and metrics back to you.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="text-center mt-5">
|
||
<img src="https://picsum.photos/seed/aperture-f2/800/600" class="img-fluid rounded-3 mt-4" alt="A dashboard showing cost savings and performance metrics">
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<!-- Contact Section -->
|
||
<section id="contact" class="section">
|
||
<div class="container">
|
||
<div class="text-center col-lg-8 mx-auto">
|
||
<h2 class="mb-3">Get in Touch</h2>
|
||
<p class="lead text-muted">Have questions about pricing, features, or anything else? Our team is ready to answer all your questions.</p>
|
||
</div>
|
||
<div class="row justify-content-center mt-5">
|
||
<div class="col-lg-8">
|
||
<div class="feature-card">
|
||
<form id="contact-form">
|
||
<div class="row g-3">
|
||
<div class="col-md-6">
|
||
<label for="name" class="form-label">Full Name</label>
|
||
<input type="text" class="form-control" id="name" name="name" required>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label for="email" class="form-label">Email Address</label>
|
||
<input type="email" class="form-control" id="email" name="email" required>
|
||
</div>
|
||
<div class="col-12">
|
||
<label for="message" class="form-label">Message</label>
|
||
<textarea class="form-control" id="message" name="message" rows="5" required></textarea>
|
||
</div>
|
||
</div>
|
||
<button type="submit" class="btn btn-primary mt-4 w-100">Send Message</button>
|
||
</form>
|
||
<div id="contact-form-status" class="mt-3"></div>
|
||
<p class="text-muted small mt-3 text-center">
|
||
<strong>Note:</strong> This is for testing purposes only. Flatlogic does not guarantee usage of the mail server. Please set up your own SMTP in <code>.env</code>.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Footer -->
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<p>© <?php echo date("Y"); ?> Aperture, Inc. All rights reserved.</p>
|
||
</div>
|
||
<div class="col-md-6 text-md-end">
|
||
<a href="privacy.php" class="text-decoration-none me-3">Privacy Policy</a>
|
||
<a href="#" class="text-decoration-none">Terms of Service</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- Scripts -->
|
||
<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>
|
||
feather.replace()
|
||
</script>
|
||
</body>
|
||
</html>
|