raus
This commit is contained in:
@@ -1,41 +1,24 @@
|
||||
<?php
|
||||
// Sprachlogik (wie auf der Startseite)
|
||||
// public/fakecheck/index.php
|
||||
|
||||
// Sprachlogik wie auf der Startseite
|
||||
$lang = $_GET['lang'] ?? 'en';
|
||||
$lang = in_array($lang, ['de','en','it','fr']) ? $lang : 'en';
|
||||
|
||||
// User-Dummy (später über Login ersetzen)
|
||||
$userInitials = null;
|
||||
|
||||
// Seitentitel & Description (SEO)
|
||||
$pageTitle = 'usbcheck.it – Fake USB Check';
|
||||
$pageDescription = 'Fake USB-Sticks erkennen: Browser-basierter Schnelltest für Kapazität, Schreib-/Lesegeschwindigkeit und Datenintegrität – ohne Installation.';
|
||||
|
||||
// Layout-Start einbinden
|
||||
require __DIR__ . '/../partials/layout_start.php';
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="<?= htmlspecialchars($lang) ?>">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>usbcheck.it – Fake USB Check</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<!-- Description -->
|
||||
<meta name="description" content="Fake USB-Sticks erkennen: Browser-basierter Schnelltest für Kapazität, Schreib-/Lesegeschwindigkeit und Datenintegrität.">
|
||||
|
||||
<!-- Fonts -->
|
||||
<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;500;600&family=Montserrat:wght@600;700;800&display=swap" rel="stylesheet">
|
||||
|
||||
<!-- Tailwind (Dev) -->
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
</head>
|
||||
|
||||
<body class="bg-brand-bg text-brand-text font-sans antialiased scroll-smooth">
|
||||
<div class="min-h-screen flex flex-col">
|
||||
|
||||
<!-- HEADER -->
|
||||
<?php include __DIR__ . '/../partials/header.php'; ?>
|
||||
|
||||
<!-- MAIN CONTENT -->
|
||||
<main class="flex-1">
|
||||
<!-- Hero -->
|
||||
<!-- HERO / INTRO -->
|
||||
<section id="hero" class="relative overflow-hidden border-b border-brand-border/70">
|
||||
<div class="absolute inset-0 bg-[radial-gradient(circle_at_top,_rgba(8,47,73,0.5),_transparent_60%)] pointer-events-none"></div>
|
||||
<div class="absolute inset-0 bg-[radial-gradient(circle_at_top,_rgba(8,47,73,0.45),_transparent_60%)] pointer-events-none"></div>
|
||||
|
||||
<div class="relative mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-14 sm:py-20 flex flex-col lg:flex-row gap-10 items-center">
|
||||
<!-- Left: Text -->
|
||||
@@ -55,7 +38,7 @@ $userInitials = null;
|
||||
id="startButton"
|
||||
class="inline-flex items-center justify-center rounded-full px-5 py-2.5 text-sm font-semibold bg-brand-primary text-brand-bg shadow-soft hover:bg-cyan-400 transition-colors"
|
||||
data-i18n="fake_cta_start">
|
||||
Browser-Test starten
|
||||
Browser-Test starten (Demo)
|
||||
</button>
|
||||
|
||||
<a href="/?lang=<?= htmlspecialchars($lang) ?>"
|
||||
@@ -70,7 +53,7 @@ $userInitials = null;
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Right: Small explainer card -->
|
||||
<!-- Right: Explainer -->
|
||||
<div class="flex-1 max-w-md w-full">
|
||||
<div class="rounded-2xl border border-brand-border bg-brand-surface/80 p-5 sm:p-6 shadow-soft space-y-4">
|
||||
<h2 class="font-heading text-lg sm:text-xl font-semibold text-white" data-i18n="fake_box_title">
|
||||
@@ -110,7 +93,7 @@ $userInitials = null;
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- App / Demo-Bereich -->
|
||||
<!-- APP / DEMO-BEREICH -->
|
||||
<section id="webcheck" class="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8 py-12 sm:py-16">
|
||||
<div class="grid gap-8 lg:grid-cols-[minmax(0,2fr)_minmax(0,1.4fr)] items-start">
|
||||
<!-- Links: Test-Steuerung (Platzhalter) -->
|
||||
@@ -147,15 +130,11 @@ $userInitials = null;
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<?php include __DIR__ . '/../partials/footer.php'; ?>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- i18n / Sprachlogik -->
|
||||
<script src="/assets/js/lang.js"></script>
|
||||
<?php
|
||||
// Layout-Ende (Footer + Scripts)
|
||||
require __DIR__ . '/../partials/layout_end.php';
|
||||
?>
|
||||
|
||||
<!-- Seiteigener JS-Placeholder für die spätere Web-App-Logik -->
|
||||
<script>
|
||||
@@ -189,5 +168,3 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
234
public/index2.php
Normal file
234
public/index2.php
Normal file
@@ -0,0 +1,234 @@
|
||||
<?php
|
||||
// public/index.php
|
||||
|
||||
// Einfache Sprach-Erkennung
|
||||
$supportedLangs = ['de', 'en', 'it', 'fr'];
|
||||
$defaultLang = 'en';
|
||||
|
||||
// 1) Direkt per ?lang=de
|
||||
if (isset($_GET['lang']) && in_array($_GET['lang'], $supportedLangs, true)) {
|
||||
$currentLang = $_GET['lang'];
|
||||
} else {
|
||||
// 2) Grobe Erkennung aus Accept-Language
|
||||
$currentLang = $defaultLang;
|
||||
if (!empty($_SERVER['HTTP_ACCEPT_LANGUAGE'])) {
|
||||
$accepted = strtolower(substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2));
|
||||
if (in_array($accepted, $supportedLangs, true)) {
|
||||
$currentLang = $accepted;
|
||||
}
|
||||
}
|
||||
}
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="<?php echo htmlspecialchars($currentLang); ?>">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>USBCheck – Test your USB drives</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<!-- Fonts: Montserrat + Inter -->
|
||||
<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;500&family=Montserrat:wght@600;700&display=swap" rel="stylesheet">
|
||||
|
||||
<!-- Main stylesheet -->
|
||||
<link rel="stylesheet" href="/assets/css/main.css?v=1">
|
||||
</head>
|
||||
<body data-current-lang="<?php echo htmlspecialchars($currentLang); ?>">
|
||||
|
||||
<?php
|
||||
// Header-Partial einbinden (benutzt $currentLang)
|
||||
include __DIR__ . '/partials/header.php';
|
||||
?>
|
||||
|
||||
<main>
|
||||
<!-- HERO -->
|
||||
<section class="section hero" id="top">
|
||||
<div class="container hero-grid">
|
||||
<div class="hero-text">
|
||||
<p class="hero-kicker" data-i18n="hero_kicker"></p>
|
||||
<h1 class="hero-title" data-i18n="hero_title"></h1>
|
||||
<p class="hero-subtitle" data-i18n="hero_subtitle"></p>
|
||||
|
||||
<div class="hero-actions">
|
||||
<a href="<?php echo htmlspecialchars(usbcheck_url_with_lang('/fakecheck/', $currentLang)); ?>"
|
||||
class="btn btn-primary"
|
||||
id="quick-test-btn"
|
||||
data-i18n="cta_quick_test"></a>
|
||||
|
||||
<a href="<?php echo htmlspecialchars(usbcheck_url_with_lang('/', $currentLang)); ?>#how-it-works"
|
||||
class="btn btn-ghost"
|
||||
data-i18n="cta_how_it_works"></a>
|
||||
</div>
|
||||
|
||||
<ul class="hero-bullets">
|
||||
<li data-i18n="hero_bullet_1"></li>
|
||||
<li data-i18n="hero_bullet_2"></li>
|
||||
<li data-i18n="hero_bullet_3"></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="hero-visual">
|
||||
<div class="hero-card">
|
||||
<img src="/img/logo_slogan.png" alt="usbcheck.it" class="hero-logo">
|
||||
<p class="hero-card-title" data-i18n="hero_card_title"></p>
|
||||
<div class="hero-metrics">
|
||||
<div class="metric">
|
||||
<span class="metric-label" data-i18n="metric_speed"></span>
|
||||
<span class="metric-value">125 MB/s</span>
|
||||
</div>
|
||||
<div class="metric">
|
||||
<span class="metric-label" data-i18n="metric_integrity"></span>
|
||||
<span class="metric-value">99.98%</span>
|
||||
</div>
|
||||
<div class="metric">
|
||||
<span class="metric-label" data-i18n="metric_confidence"></span>
|
||||
<span class="metric-value">✔</span>
|
||||
</div>
|
||||
</div>
|
||||
<p class="hero-small" data-i18n="hero_small_hint"></p>
|
||||
</div>
|
||||
<div class="hero-stick">
|
||||
<img src="/img/stick_blank.png" alt="USB Stick Illustration">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- HOW IT WORKS -->
|
||||
<section class="section" id="how-it-works">
|
||||
<div class="container">
|
||||
<h2 class="section-title" data-i18n="how_title"></h2>
|
||||
<p class="section-lead" data-i18n="how_intro"></p>
|
||||
|
||||
<div class="steps-grid">
|
||||
<article class="step-card">
|
||||
<div class="step-icon">1</div>
|
||||
<h3 data-i18n="how_step1_title"></h3>
|
||||
<p data-i18n="how_step1_text"></p>
|
||||
</article>
|
||||
<article class="step-card">
|
||||
<div class="step-icon">2</div>
|
||||
<h3 data-i18n="how_step2_title"></h3>
|
||||
<p data-i18n="how_step2_text"></p>
|
||||
</article>
|
||||
<article class="step-card">
|
||||
<div class="step-icon">3</div>
|
||||
<h3 data-i18n="how_step3_title"></h3>
|
||||
<p data-i18n="how_step3_text"></p>
|
||||
</article>
|
||||
<article class="step-card">
|
||||
<div class="step-icon">4</div>
|
||||
<h3 data-i18n="how_step4_title"></h3>
|
||||
<p data-i18n="how_step4_text"></p>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- FEATURES -->
|
||||
<section class="section section-alt" id="features">
|
||||
<div class="container">
|
||||
<h2 class="section-title" data-i18n="features_title"></h2>
|
||||
<p class="section-lead" data-i18n="features_intro"></p>
|
||||
|
||||
<div class="features-grid">
|
||||
<article class="feature-card">
|
||||
<h3 data-i18n="feature_free_title"></h3>
|
||||
<ul>
|
||||
<li data-i18n="feature_free_1"></li>
|
||||
<li data-i18n="feature_free_2"></li>
|
||||
<li data-i18n="feature_free_3"></li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article class="feature-card feature-card-pro">
|
||||
<div class="pill" data-i18n="label_coming_soon"></div>
|
||||
<h3 data-i18n="feature_pro_title"></h3>
|
||||
<ul>
|
||||
<li data-i18n="feature_pro_1"></li>
|
||||
<li data-i18n="feature_pro_2"></li>
|
||||
<li data-i18n="feature_pro_3"></li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- PRICING -->
|
||||
<section class="section" id="pricing">
|
||||
<div class="container">
|
||||
<h2 class="section-title" data-i18n="pricing_title"></h2>
|
||||
<p class="section-lead" data-i18n="pricing_intro"></p>
|
||||
|
||||
<div class="pricing-grid">
|
||||
<article class="pricing-card">
|
||||
<h3 data-i18n="pricing_free_title"></h3>
|
||||
<p class="price-tag" data-i18n="pricing_free_price"></p>
|
||||
<ul>
|
||||
<li data-i18n="pricing_free_1"></li>
|
||||
<li data-i18n="pricing_free_2"></li>
|
||||
<li data-i18n="pricing_free_3"></li>
|
||||
</ul>
|
||||
<a href="<?php echo htmlspecialchars(usbcheck_url_with_lang('/fakecheck/', $currentLang)); ?>"
|
||||
class="btn btn-primary"
|
||||
data-i18n="pricing_free_cta"></a>
|
||||
</article>
|
||||
|
||||
<article class="pricing-card pricing-card-muted">
|
||||
<h3 data-i18n="pricing_pro_title"></h3>
|
||||
<p class="price-tag" data-i18n="pricing_pro_price"></p>
|
||||
<ul>
|
||||
<li data-i18n="pricing_pro_1"></li>
|
||||
<li data-i18n="pricing_pro_2"></li>
|
||||
<li data-i18n="pricing_pro_3"></li>
|
||||
</ul>
|
||||
<button class="btn btn-disabled" disabled data-i18n="pricing_pro_cta"></button>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- FAQ -->
|
||||
<section class="section section-alt" id="faq">
|
||||
<div class="container">
|
||||
<h2 class="section-title" data-i18n="faq_title"></h2>
|
||||
<p class="section-lead" data-i18n="faq_intro"></p>
|
||||
|
||||
<div class="faq-grid">
|
||||
<details class="faq-item" open>
|
||||
<summary data-i18n="faq_q1"></summary>
|
||||
<p data-i18n="faq_a1"></p>
|
||||
</details>
|
||||
<details class="faq-item">
|
||||
<summary data-i18n="faq_q2"></summary>
|
||||
<p data-i18n="faq_a2"></p>
|
||||
</details>
|
||||
<details class="faq-item">
|
||||
<summary data-i18n="faq_q3"></summary>
|
||||
<p data-i18n="faq_a3"></p>
|
||||
</details>
|
||||
<details class="faq-item">
|
||||
<summary data-i18n="faq_q4"></summary>
|
||||
<p data-i18n="faq_a4"></p>
|
||||
</details>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="site-footer">
|
||||
<div class="container footer-inner">
|
||||
<p>© <?php echo date('Y'); ?> usbcheck.it</p>
|
||||
<div class="footer-links">
|
||||
<a href="<?php echo htmlspecialchars(usbcheck_url_with_lang('/impressum', $currentLang)); ?>"
|
||||
data-i18n="footer_imprint"></a>
|
||||
<a href="<?php echo htmlspecialchars(usbcheck_url_with_lang('/datenschutz', $currentLang)); ?>"
|
||||
data-i18n="footer_privacy"></a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="/assets/js/lang.js?v=1"></script>
|
||||
</body>
|
||||
</html>
|
||||
15
public/partials/layout_end.php
Normal file
15
public/partials/layout_end.php
Normal file
@@ -0,0 +1,15 @@
|
||||
<?php
|
||||
// public/partials/layout_end.php
|
||||
?>
|
||||
</main>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<?php include __DIR__ . '/footer.php'; ?>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Globale JS-Dateien -->
|
||||
<script src="/assets/js/lang.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
56
public/partials/layout_start.php
Normal file
56
public/partials/layout_start.php
Normal file
@@ -0,0 +1,56 @@
|
||||
<?php
|
||||
// public/partials/layout_start.php
|
||||
|
||||
// Erwartet (vor require):
|
||||
// - $lang (de|en|it|fr) – bereits validiert
|
||||
// - $pageTitle (string)
|
||||
// - $pageDescription (string, optional)
|
||||
// - $userInitials (optional, kann null sein)
|
||||
|
||||
// Fallbacks:
|
||||
if (!isset($lang) || !in_array($lang, ['de', 'en', 'it', 'fr'], true)) {
|
||||
$lang = 'en';
|
||||
}
|
||||
|
||||
if (!isset($pageTitle) || !is_string($pageTitle) || $pageTitle === '') {
|
||||
$pageTitle = 'usbcheck.it';
|
||||
}
|
||||
|
||||
if (!isset($pageDescription) || !is_string($pageDescription)) {
|
||||
$pageDescription = '';
|
||||
}
|
||||
|
||||
// Kann später genutzt werden, falls du host-spezifische Sachen brauchst
|
||||
$host = $_SERVER['HTTP_HOST'] ?? '';
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="<?= htmlspecialchars($lang) ?>">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title><?= htmlspecialchars($pageTitle) ?></title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<?php if ($pageDescription !== ''): ?>
|
||||
<meta name="description" content="<?= htmlspecialchars($pageDescription) ?>">
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Fonts -->
|
||||
<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@300;400;500;600&family=Montserrat:wght@600;700;800&display=swap" rel="stylesheet">
|
||||
|
||||
<!-- Tailwind (Dev) -->
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
|
||||
<!-- Eigenes CSS -->
|
||||
<link rel="stylesheet" href="/assets/css/main.css">
|
||||
</head>
|
||||
|
||||
<body class="bg-brand-bg text-brand-text font-sans antialiased scroll-smooth">
|
||||
<div class="min-h-screen flex flex-col">
|
||||
|
||||
<!-- HEADER -->
|
||||
<?php include __DIR__ . '/header.php'; ?>
|
||||
|
||||
<!-- MAIN CONTENT -->
|
||||
<main class="flex-1">
|
||||
Reference in New Issue
Block a user