117 lines
3.4 KiB
HTML
117 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="sk">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>WebWizard - AI Website Concierge</title>
|
|
<link rel="stylesheet" href="css/wizard.css">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>WebWizard</h1>
|
|
</header>
|
|
|
|
<main>
|
|
<div class="wizard-container">
|
|
<div class="progress-bar">
|
|
<div class="progress-fill"></div>
|
|
</div>
|
|
|
|
<div class="wizard-content">
|
|
<!-- Step 1: Segmentácia biznisu -->
|
|
<div class="step active" data-step="1">
|
|
<h2>Oblasť podnikania</h2>
|
|
<p class="step-description">V čom podnikáte? Pomôže nám to prispôsobiť váš web.</p>
|
|
|
|
<div id="category-list" class="category-grid">
|
|
<!-- Categories will be injected here -->
|
|
</div>
|
|
|
|
<div id="subcategory-container" class="subcategory-section hidden">
|
|
<h3>Vyberte podkategóriu</h3>
|
|
<div id="subcategory-list" class="subcategory-chips">
|
|
<!-- Subcategories will be injected here -->
|
|
</div>
|
|
|
|
<div id="custom-category-group" class="form-group hidden">
|
|
<label for="custom-description">Popíšte vašu oblasť podnikania</label>
|
|
<textarea id="custom-description" rows="3" placeholder="Napr. Súkromná materská škola, Prenájom jácht..."></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 2: Identita, kontakt a GDPR -->
|
|
<div class="step" data-step="2">
|
|
<h2>Identita a kontakt</h2>
|
|
<p class="step-description">Základné informácie o vašej firme a GDPR súhlas.</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 2...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 3: Služby a smart otázky -->
|
|
<div class="step" data-step="3">
|
|
<h2>Služby</h2>
|
|
<p class="step-description">Čo presne ponúkate vašim zákazníkom?</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 3...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 4: Vizuálny štýl -->
|
|
<div class="step" data-step="4">
|
|
<h2>Vizuálny štýl</h2>
|
|
<p class="step-description">Ako by mal váš nový web vyzerať?</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 4...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 5: Moduly -->
|
|
<div class="step" data-step="5">
|
|
<h2>Moduly webu</h2>
|
|
<p class="step-description">Vyberte si sekcie a funkcie vášho webu.</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 5...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 6: Generovanie -->
|
|
<div class="step" data-step="6">
|
|
<h2>Generovanie obsahu</h2>
|
|
<p class="step-description">Naša AI teraz pripravuje váš textový obsah.</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 6...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 7: Preview -->
|
|
<div class="step" data-step="7">
|
|
<h2>Náhľad webu</h2>
|
|
<p class="step-description">Pozrite si, ako vyzerá váš nový web.</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 7...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 8: Export -->
|
|
<div class="step" data-step="8">
|
|
<h2>Hotovo!</h2>
|
|
<p class="step-description">Váš web je pripravený na stiahnutie.</p>
|
|
<div class="form-placeholder">
|
|
<p>Obsah pre krok 8...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="wizard-footer">
|
|
<button id="btn-prev" class="btn-secondary" disabled>Späť</button>
|
|
<button id="btn-next" class="btn-primary">Pokračovať</button>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<script src="js/wizard.js"></script>
|
|
</body>
|
|
</html>
|