181 lines
8.2 KiB
PHP
181 lines
8.2 KiB
PHP
<?php
|
|
require_once __DIR__ . '/../backend/includes/functions.php';
|
|
require_once __DIR__ . '/../backend/config/products-config.php';
|
|
|
|
// Produkt-Daten aus Config laden
|
|
$product = getProduct('vpc');
|
|
$packages = getProductPackages('vpc');
|
|
|
|
// Page configuration
|
|
$page_title = $product['page_title'];
|
|
$page_description = $product['page_description'];
|
|
$current_page = 'vpc';
|
|
|
|
// Include header
|
|
includeHeader($page_title, $page_description, $current_page);
|
|
?>
|
|
|
|
<main id="main-content">
|
|
<!-- Product Hero -->
|
|
<section class="product-hero">
|
|
<div class="container">
|
|
<div class="product-hero-content">
|
|
<?php
|
|
generateBreadcrumbs([
|
|
['title' => 'Home', 'url' => 'index.php'],
|
|
['title' => 'Virtual Private Container', 'url' => '']
|
|
]);
|
|
?>
|
|
<h1 class="product-hero-title">
|
|
<?php echo htmlspecialchars($product['name']); ?>
|
|
<span class="highlight"><?php echo htmlspecialchars($product['hero_highlight'] ?? ''); ?></span>
|
|
</h1>
|
|
<p class="product-hero-description">
|
|
<?php echo htmlspecialchars($product['hero_description'] ?? $product['description']); ?>
|
|
</p>
|
|
<div class="product-hero-features">
|
|
<div class="hero-feature">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="10"/>
|
|
<polyline points="12,6 12,12 16,14"/>
|
|
</svg>
|
|
<span>Sofortige Bereitstellung</span>
|
|
</div>
|
|
<div class="hero-feature">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
|
|
</svg>
|
|
<span>99.9% Uptime</span>
|
|
</div>
|
|
<div class="hero-feature">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/>
|
|
</svg>
|
|
<span>Maximale Performance</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- VPC Packages -->
|
|
<section class="packages">
|
|
<div class="container">
|
|
<div class="section-header">
|
|
<h2 class="section-title"><?php echo htmlspecialchars($product['packages_title'] ?? ($product['short_name'] . ' Pakete')); ?></h2>
|
|
<p class="section-description">
|
|
<?php echo htmlspecialchars($product['packages_description'] ?? 'Wählen Sie das passende Paket für Ihre Anforderungen'); ?>
|
|
</p>
|
|
</div>
|
|
<div class="packages-grid">
|
|
<?php echo renderAllPackages('vpc'); ?>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Technical Details -->
|
|
<section class="technical-details">
|
|
<div class="container">
|
|
<div class="section-header">
|
|
<h2 class="section-title">Technische Details</h2>
|
|
<p class="section-description">
|
|
Erfahren Sie mehr über unsere Container-Technologie
|
|
</p>
|
|
</div>
|
|
<div class="details-grid">
|
|
<div class="detail-card glass-card">
|
|
<div class="detail-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M4 7V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v3"/>
|
|
<path d="M4 7h16"/>
|
|
<path d="M4 7v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Proxmox LXC</h3>
|
|
<p>Modernste Container-Virtualisierung auf Basis von Linux Containers (LXC) mit Proxmox-Management für maximale Effizienz.</p>
|
|
</div>
|
|
<div class="detail-card glass-card">
|
|
<div class="detail-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="3"/>
|
|
<path d="M12 1v6m0 6v6"/>
|
|
</svg>
|
|
</div>
|
|
<h3>High Performance</h3>
|
|
<p>Enterprise-Hardware mit NVMe SSD-Speicher und modernen Intel/AMD Prozessoren für beste Performance.</p>
|
|
</div>
|
|
<div class="detail-card glass-card">
|
|
<div class="detail-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/>
|
|
<polyline points="7.5,4.21 12,6.81 16.5,4.21"/>
|
|
<polyline points="7.5,19.79 7.5,14.6 3,12"/>
|
|
<polyline points="21,12 16.5,14.6 16.5,19.79"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Skalierbarkeit</h3>
|
|
<p>Einfache Anpassung der Ressourcen je nach Bedarf - CPU, RAM und Speicher können flexibel skaliert werden.</p>
|
|
</div>
|
|
<div class="detail-card glass-card">
|
|
<div class="detail-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
|
|
</svg>
|
|
</div>
|
|
<h3>Sicherheit</h3>
|
|
<p>Isolierte Container-Umgebung mit automatischen Sicherheitsupdates und regelmäßigen Backups.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Use Cases -->
|
|
<section class="use-cases">
|
|
<div class="container">
|
|
<div class="section-header">
|
|
<h2 class="section-title">Anwendungsbereiche</h2>
|
|
<p class="section-description">
|
|
Perfekt geeignet für verschiedene Szenarien
|
|
</p>
|
|
</div>
|
|
<div class="use-cases-grid">
|
|
<div class="use-case-item glass-card">
|
|
<h3>Web-Entwicklung</h3>
|
|
<p>Ideale Testumgebung für Entwickler mit schneller Bereitstellung und flexibler Konfiguration.</p>
|
|
</div>
|
|
<div class="use-case-item glass-card">
|
|
<h3>Microservices</h3>
|
|
<p>Effiziente Containerisierung von Microservices mit optimaler Ressourcennutzung.</p>
|
|
</div>
|
|
<div class="use-case-item glass-card">
|
|
<h3>CI/CD Pipelines</h3>
|
|
<p>Automatisierte Build- und Deployment-Prozesse in isolierten Container-Umgebungen.</p>
|
|
</div>
|
|
<div class="use-case-item glass-card">
|
|
<h3>Backup-Server</h3>
|
|
<p>Zuverlässige Backup-Lösungen mit redundanter Speicherung und automatischer Überwachung.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA Section -->
|
|
<section class="cta">
|
|
<div class="container">
|
|
<div class="cta-content glass-card">
|
|
<h2><?php echo htmlspecialchars($product['cta_title'] ?? ('Bereit für ' . $product['name'] . '?')); ?></h2>
|
|
<p><?php echo htmlspecialchars($product['cta_description'] ?? ('Starten Sie noch heute mit ' . $product['name'])); ?></p>
|
|
<div class="cta-actions">
|
|
<a href="contact.php?product=vpc" class="btn btn-primary">Jetzt bestellen</a>
|
|
<a href="/contact" class="btn btn-secondary">Beratung anfordern</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<?php
|
|
// Include footer
|
|
includeFooter();
|
|
?>
|