HTMLify

create.html
Views: 58 | Author: karbonsites
<!DOCTYPE html><html lang="fr"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Yummy Cake — Créer mon gâteau</title><link rel="stylesheet" href="style.css"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"><link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,700;1,400&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap" rel="stylesheet"></head><body><div class="mobile-frame"><header class="app-header secondary-header"><a href="index.html" class="back-btn"><i class="fa-solid fa-chevron-left"></i></a><h1>Créer mon gâteau 🎂</h1></header><main class="app-content wizard-content"><div class="wizard-progress"><div class="step-indicator active" data-step="1">1</div><div class="step-line"></div><div class="step-indicator" data-step="2">2</div><div class="step-line"></div><div class="step-indicator" data-step="3">3</div><div class="step-line"></div><div class="step-indicator" data-step="4">4</div></div><div class="wizard-step active" id="step-1"><h2>Pour quelle occasion ?</h2><div class="selection-grid"><div class="select-card active" data-value="Anniversaire"><span class="emoji">🎂</span><span>Anniversaire</span></div><div class="select-card" data-value="Mariage"><span class="emoji">💍</span><span>Mariage</span></div><div class="select-card" data-value="Graduation"><span class="emoji">🎓</span><span>Graduation</span></div><div class="select-card" data-value="Saint-Valentin"><span class="emoji">❤️</span><span>Saint-Valentin</span></div><div class="select-card" data-value="Naissance"><span class="emoji">👶</span><span>Naissance</span></div><div class="select-card" data-value="Autre"><span class="emoji">🎉</span><span>Autre</span></div></div><button class="btn-primary wizard-next" onclick="nextStep(2)">Continuer</button></div><div class="wizard-step" id="step-2" style="display:none;"><h2>Pour combien de personnes ?</h2><div class="selection-list"><label class="radio-card"><input type="radio" name="persons" checked><span>6 personnes</span></label><label class="radio-card"><input type="radio" name="persons"><span>10 personnes</span></label><label class="radio-card"><input type="radio" name="persons"><span>15 personnes</span></label><label class="radio-card"><input type="radio" name="persons"><span>20 personnes</span></label><label class="radio-card"><input type="radio" name="persons"><span>Plus de 30 personnes</span></label></div><div class="btn-group"><button class="btn-secondary" onclick="nextStep(1)">Retour</button><button class="btn-primary" onclick="nextStep(3)">Continuer</button></div></div><div class="wizard-step" id="step-3" style="display:none;"><h2>Choisissez votre parfum & style</h2><div class="option-group"><label>Parfum principal</label><select class="custom-select"><option>Chocolat</option><option>Vanille</option><option>Fraise</option><option>Red Velvet</option><option>Citron</option></select></div><div class="option-group"><label>Style visuel</label><div class="style-chips"><span class="chip active">Classique</span><span class="chip">Élégant</span><span class="chip">Floral</span><span class="chip">Enfant</span><span class="chip">Premium</span></div></div><div class="btn-group"><button class="btn-secondary" onclick="nextStep(2)">Retour</button><button class="btn-primary" onclick="nextStep(4)">Continuer</button></div></div><div class="wizard-step" id="step-4" style="display:none;"><h2>Date et résumé</h2><div class="option-group"><label>Date souhaitée</label><input type="date" class="custom-input" value="2026-08-15"></div><div class="summary-card"><h3>Votre création ❤️</h3><ul><li><span>Occasion</span> <strong>Anniversaire</strong></li><li><span>Personnes</span> <strong>15 pers.</strong></li><li><span>Parfum</span> <strong>Chocolat</strong></li><li><span>Date</span> <strong>15 août 2026</strong></li></ul><div class="estimate-box"><span>Prix estimatif indicatif</span><strong>À partir de 20 000 FCFA</strong></div></div><div class="btn-group"><button class="btn-secondary" onclick="nextStep(3)">Retour</button><a href="confirmation.html" class="btn-primary">ENVOYER LA DEMANDE</a></div></div></main><nav class="bottom-nav"><a href="index.html" class="nav-item"><i class="fa-solid fa-house"></i><span>Accueil</span></a><a href="catalog.html" class="nav-item"><i class="fa-solid fa-cake-candles"></i><span>Catalogue</span></a><a href="create.html" class="nav-item highlight-nav active"><div class="create-btn-circle"><i class="fa-solid fa-plus"></i></div><span>Créer</span></a><a href="cart.html" class="nav-item"><i class="fa-solid fa-bag-shopping"></i><span>Panier</span></a><a href="account.html" class="nav-item"><i class="fa-solid fa-user"></i><span>Compte</span></a></nav></div><script src="script.js" defer></script>
  <a href="https://karbonsites.space/home" target="_blank" id="karbon-promo-banner">
      <span>✨</span>
      <div>Built with <b>Karbon Sites</b></div>
  </a>
</body></html>
HTMLify

Share this file:
