Hugging Face's logo

Spaces:
docto41
/
hyperia
Running

App Files Community
docto41 commited on
Commit
217f4ac
·
verified ·
1 Parent(s): 78538dc

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +199 -204
  2. prompts.txt +2 -1
index.html CHANGED
@@ -118,6 +118,35 @@
118
  transform: rotate(-90deg);
119
  transform-origin: 50% 50%;
120
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
121
  </style>
122
  </head>
123
  <body class="relative overflow-hidden">
@@ -141,16 +170,16 @@
141
  <span class="text-3xl font-bold futuristic-text neon-text">HyperAI</span>
142
  </div>
143
  <div class="hidden lg:flex items-center space-x-8">
144
- <a href="#" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">FONCTIONS</a>
145
- <a href="#" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">SOLUTIONS</a>
146
- <a href="#" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">TARIFS</a>
147
- <a href="#" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">RESSOURCES</a>
148
  </div>
149
  <div class="flex items-center space-x-4">
150
- <button id="login-btn" class="px-6 py-2 rounded-full border-2 border-var(--neon-blue) text-var(--neon-blue) hover:bg-var(--neon-blue) hover:text-black transition-all duration-300 futuristic-text" onclick="window.open('https://hyperai-login.com', '_blank')">
151
  CONNEXION
152
  </button>
153
- <button id="free-trial-btn" class="px-6 py-2 rounded-full bg-var(--neon-blue) text-black hover:bg-var(--neon-pink) transition-all duration-300 futuristic-text shadow-lg hover:shadow-xl neon-border" onclick="window.open('https://hyperai-trial.com', '_blank')">
154
  ESSAI GRATUIT
155
  </button>
156
  </div>
@@ -172,10 +201,10 @@
172
  <span class="text-var(--neon-blue) font-bold">989,999+ IA</span> spécialisées créent votre plateforme de cours en ligne complète en <span class="text-var(--neon-pink) font-bold">10 secondes</span>. Tout service inclus en <span class="text-var(--neon-blue) font-bold">10 minutes</span>.
173
  </p>
174
  <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
175
- <button id="start-now-btn" class="px-8 py-4 bg-var(--neon-blue) text-black font-bold rounded-full hover:bg-var(--neon-pink) transition-all duration-300 transform hover:scale-105 shadow-lg futuristic-text neon-border" onclick="window.open('https://hyperai-generator.com', '_blank')">
176
  DÉMARRER MAINTENANT <i class="fas fa-arrow-right ml-2"></i>
177
  </button>
178
- <button id="demo-video-btn" class="px-8 py-4 bg-transparent border-2 border-var(--neon-blue) text-var(--neon-blue) font-bold rounded-full hover:bg-white hover:bg-opacity-10 transition-all duration-300 transform hover:scale-105 futuristic-text" onclick="window.open('https://hyperai-demo.com', '_blank')">
179
  <i class="fas fa-play-circle mr-2"></i> VIDÉO DEMO
180
  </button>
181
  </div>
@@ -310,7 +339,7 @@
310
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-blue)">Base de données</span>
311
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-blue)">API Intégrées</span>
312
  </div>
313
- <button class="mt-6 px-4 py-2 bg-var(--neon-blue) text-black rounded text-sm font-bold futuristic-text w-full hover:bg-var(--neon-pink) transition-all duration-300" onclick="window.open('https://hyperai-architecture.com', '_blank')">
314
  ACTIVER LES IA ARCHITECTES
315
  </button>
316
  </div>
@@ -330,7 +359,7 @@
330
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-pink)">Animations VR</span>
331
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-pink)">Branding IA</span>
332
  </div>
333
- <button class="mt-6 px-4 py-2 bg-var(--neon-pink) text-black rounded text-sm font-bold futuristic-text w-full hover:bg-var(--neon-purple) transition-all duration-300" onclick="window.open('https://hyperai-design.com', '_blank')">
334
  ACTIVER LES IA DESIGNERS
335
  </button>
336
  </div>
@@ -350,7 +379,7 @@
350
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-purple)">Analyse concurrentielle</span>
351
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-purple)">Recommandations</span>
352
  </div>
353
- <button class="mt-6 px-4 py-2 bg-var(--neon-purple) text-black rounded text-sm font-bold futuristic-text w-full hover:bg-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-analytics.com', '_blank')">
354
  ACTIVER LES IA ANALYSTES
355
  </button>
356
  </div>
@@ -364,7 +393,7 @@
364
  <div class="text-center mb-16">
365
  <h2 class="text-4xl md:text-5xl font-bold mb-4 futuristic-text neon-text">GÉNÉRATEUR DE COURS 10s</h2>
366
  <p class="text-xl text-gray-300 max-w-3xl mx-auto">
367
- Configurez votre plateforme de cours en ligne en quelques clis
368
  </p>
369
  </div>
370
 
@@ -490,7 +519,7 @@
490
  </div>
491
 
492
  <div class="flex justify-end">
493
- <button id="next-step-btn" class="px-8 py-3 bg-var(--neon-blue) text-black rounded-lg font-bold hover:bg-var(--neon-pink) transition-all duration-300 futuristic-text neon-border" onclick="window.open('https://hyperai-next-step.com', '_blank')">
494
  SUIVANT <i class="fas fa-arrow-right ml-2"></i>
495
  </button>
496
  </div>
@@ -512,11 +541,11 @@
512
 
513
  <div class="bg-gray-900 rounded-3xl border-2 border-gray-800 p-8 max-w-6xl mx-auto neon-border">
514
  <div class="flex flex-wrap justify-center gap-4 mb-8">
515
- <button class="px-5 py-2 bg-var(--neon-blue) text-black rounded-full text-sm font-bold futuristic-text" onclick="window.open('https://hyperai-preview-home.com', '_blank')">ACCUEIL</button>
516
- <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700" onclick="window.open('https://hyperai-preview-courses.com', '_blank')">COURS</button>
517
- <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700" onclick="window.open('https://hyperai-preview-instructors.com', '_blank')">FORMATEURS</button>
518
- <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700" onclick="window.open('https://hyperai-preview-cart.com', '_blank')">PANIER</button>
519
- <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700" onclick="window.open('https://hyperai-preview-dashboard.com', '_blank')">DASHBOARD</button>
520
  </div>
521
 
522
  <div class="bg-black rounded-xl border-2 border-gray-800 overflow-hidden">
@@ -536,14 +565,14 @@
536
  <div class="flex justify-between items-center mb-8">
537
  <div class="text-2xl font-bold futuristic-text text-var(--neon-blue)">ACADEMY PRO</div>
538
  <div class="flex items-center space-x-4">
539
- <button class="p-2 text-gray-400 hover:text-var(--neon-blue)" onclick="window.open('https://hyperai-search.com', '_blank')">
540
  <i class="fas fa-search"></i>
541
  </button>
542
- <button class="p-2 text-gray-400 hover:text-var(--neon-blue)" onclick="window.open('https://hyperai-cart.com', '_blank')">
543
  <i class="fas fa-shopping-cart"></i>
544
  <span class="ml-1 text-xs bg-var(--neon-blue) text-black rounded-full px-1.5 py-0.5">3</span>
545
  </button>
546
- <button class="p-2 text-gray-400 hover:text-var(--neon-blue)" onclick="window.open('https://hyperai-profile.com', '_blank')">
547
  <i class="fas fa-user-astronaut"></i>
548
  </button>
549
  </div>
@@ -553,13 +582,13 @@
553
  <div class="mb-8 p-6 rounded-xl bg-gradient-to-r from-gray-900 to-gray-800 border border-gray-700">
554
  <h3 class="text-xl font-bold mb-2">MAÎTRISEZ LA TECHNOLOGIE DE DEMAIN</h3>
555
  <p class="text-gray-400 mb-4">Rejoignez 50,000+ étudiants dans notre communauté d'apprentissage en ligne.</p>
556
- <button class="px-4 py-2 bg-var(--neon-blue) text-black rounded text-sm font-bold futuristic-text" onclick="window.open('https://hyperai-explore-courses.com', '_blank')">EXPLORER LES COURS</button>
557
  </div>
558
 
559
  <!-- Courses Grid -->
560
  <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
561
  <!-- Course 1 -->
562
- <div class="course-card bg-gray-900 rounded-lg overflow-hidden border border-gray-800 hover:border-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-course-ai.com', '_blank')">
563
  <div class="relative">
564
  <img src="https://images.unsplash.com/photo-1563986768609-322da13575f8?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Course" class="w-full h-40 object-cover">
565
  <div class="absolute top-2 right-2 bg-black bg-opacity-70 rounded-full w-8 h-8 flex items-center justify-center">
@@ -581,7 +610,7 @@
581
  </div>
582
 
583
  <!-- Course 2 -->
584
- <div class="course-card bg-gray-900 rounded-lg overflow-hidden border border-gray-800 hover:border-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-course-blockchain.com', '_blank')">
585
  <div class="relative">
586
  <img src="https://images.unsplash.com/photo-1550751827-4bd374c3f58b?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Course" class="w-full h-40 object-cover">
587
  <div class="absolute top-2 right-2 bg-black bg-opacity-70 rounded-full w-8 h-8 flex items-center justify-center">
@@ -602,7 +631,7 @@
602
  </div>
603
 
604
  <!-- Course 3 -->
605
- <div class="course-card bg-gray-900 rounded-lg overflow-hidden border border-gray-800 hover:border-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-course-cybersecurity.com', '_blank')">
606
  <div class="relative">
607
  <img src="https://images.unsplash.com/photo-1547658719-da2b51169166?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Course" class="w-full h-40 object-cover">
608
  <div class="absolute top-2 right-2 bg-black bg-opacity-70 rounded-full w-8 h-8 flex items-center justify-center">
@@ -651,10 +680,10 @@
651
  </h2>
652
  <p class="text-xl text-gray-300 mb-8">989,999 IA sont prêtes à créer votre site en <span class="text-var(--neon-blue) font-bold">10 secondes</span> avec tous les services inclus en <span class="text-var(--neon-pink) font-bold">10 minutes</span>.</p>
653
  <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-6">
654
- <button id="final-start-btn" class="px-10 py-5 bg-var(--neon-blue) text-black font-bold rounded-full hover:bg-var(--neon-pink) transition-all duration-300 transform hover:scale-105 shadow-2xl futuristic-text text-xl neon-border" onclick="window.open('https://hyperai-start-now.com', '_blank')">
655
  COMMENCER MAINTENANT <i class="fas fa-rocket ml-2"></i>
656
  </button>
657
- <button id="contact-expert-btn" class="px-10 py-5 bg-transparent border-2 border-var(--neon-blue) text-var(--neon-blue) font-bold rounded-full hover:bg-white hover:bg-opacity-10 transition-all duration-300 transform hover:scale-105 futuristic-text text-xl" onclick="window.open('https://hyperai-contact-expert.com', '_blank')">
658
  <i class="fas fa-headset mr-2"></i> CONTACT EXPERT
659
  </button>
660
  </div>
@@ -680,16 +709,16 @@
680
  </div>
681
  <p class="text-sm mb-6">La plateforme ultime pour créer des marketplaces de cours en ligne alimentée par 989,999 IA spécialisées.</p>
682
  <div class="flex space-x-4">
683
- <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300" onclick="window.open('https://facebook.com/hyperai', '_blank')">
684
  <i class="fab fa-facebook-f"></i>
685
  </a>
686
- <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300" onclick="window.open('https://twitter.com/hyperai', '_blank')">
687
  <i class="fab fa-twitter"></i>
688
  </a>
689
- <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300" onclick="window.open('https://linkedin.com/company/hyperai', '_blank')">
690
  <i class="fab fa-linkedin-in"></i>
691
  </a>
692
- <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300" onclick="window.open('https://discord.gg/hyperai', '_blank')">
693
  <i class="fab fa-discord"></i>
694
  </a>
695
  </div>
@@ -697,40 +726,40 @@
697
  <div>
698
  <h4 class="text-lg font-bold text-white mb-4 futuristic-text">PRODUIT</h4>
699
  <ul class="space-y-3 text-sm">
700
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-features.com', '_blank')">Fonctionnalités</a></li>
701
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-pricing.com', '_blank')">Tarifs</a></li>
702
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-specialized-ai.com', '_blank')">IA Spécialisées</a></li>
703
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-integrations.com', '_blank')">Intégrations</a></li>
704
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-roadmap.com', '_blank')">Roadmap</a></li>
705
  </ul>
706
  </div>
707
  <div>
708
  <h4 class="text-lg font-bold text-white mb-4 futuristic-text">RESSOURCES</h4>
709
  <ul class="space-y-3 text-sm">
710
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-blog.com', '_blank')">Blog</a></li>
711
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-docs.com', '_blank')">Documentation</a></li>
712
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-tutorials.com', '_blank')">Tutoriels</a></li>
713
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-support.com', '_blank')">Support</a></li>
714
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-api.com', '_blank')">API</a></li>
715
  </ul>
716
  </div>
717
  <div>
718
  <h4 class="text-lg font-bold text-white mb-4 futuristic-text">ENTREPRISE</h4>
719
  <ul class="space-y-3 text-sm">
720
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-about.com', '_blank')">À propos</a></li>
721
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-careers.com', '_blank')">Carrières</a></li>
722
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-partners.com', '_blank')">Partenaires</a></li>
723
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-contact.com', '_blank')">Contact</a></li>
724
- <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-press.com', '_blank')">Presse</a></li>
725
  </ul>
726
  </div>
727
  </div>
728
  <div class="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
729
  <p class="text-xs mb-4 md:mb-0">© 2023 HyperAI. Tous droits réservés. Une création de 989,999 IA.</p>
730
  <div class="flex space-x-6 text-xs">
731
- <a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-terms.com', '_blank')">Conditions</a>
732
- <a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-privacy.com', '_blank')">Confidentialité</a>
733
- <a href="#" class="hover:text-var(--neon-blue) transition-all duration-300" onclick="window.open('https://hyperai-cookies.com', '_blank')">Cookies</a>
734
  </div>
735
  </div>
736
  </div>
@@ -756,27 +785,16 @@
756
 
757
  // Auto-activate all buttons for demo purposes
758
  autoActivateButtons();
 
 
 
759
  });
760
 
761
  // Auto-activate all buttons
762
  function autoActivateButtons() {
763
- // Main CTA buttons
764
- document.getElementById('start-now-btn').classList.add('active');
765
- document.getElementById('final-start-btn').classList.add('active');
766
-
767
- // AI Cluster buttons
768
- document.querySelectorAll('.bg-var\\(\\-\\-neon-blue\\), .bg-var\\(\\-\\-neon-pink\\), .bg-var\\(\\-\\-neon-purple\\), .bg-gray-800').forEach(btn => {
769
- btn.classList.add('active');
770
- });
771
-
772
- // Navigation buttons
773
- document.querySelectorAll('.step').forEach(step => {
774
- step.classList.add('active');
775
- });
776
-
777
- // Preview tabs
778
- document.querySelectorAll('.course-card').forEach(card => {
779
- card.classList.add('active');
780
  });
781
  }
782
 
@@ -959,154 +977,131 @@
959
  <i class="fas fa-rocket"></i>
960
  </div>
961
  </div>
962
- <div class="col-span-11">
963
- <p class="text-var(--neon-blue) font-bold">PLATEFORME PRÊTE À ÊTRE PUBLIÉE !</p>
964
- <p class="text-xs text-gray-400">989,999 IA ont terminé leur travail en 10 secondes</p>
965
- </div>
966
- `;
967
- statusContainer.appendChild(completionMessage);
968
-
969
- // Enable buttons and show success
970
- document.getElementById('start-now-btn').disabled = false;
971
- document.getElementById('final-start-btn').disabled = false;
972
-
973
- // Show success notification
974
- showNotification('Plateforme générée avec succès!', 'var(--neon-blue)');
975
- }
976
-
977
- // Show notification
978
- function showNotification(message, color) {
979
- const notification = document.createElement('div');
980
- notification.className = 'fixed top-4 right-4 p-4 rounded-lg shadow-lg z-50';
981
- notification.style.backgroundColor = color;
982
- notification.style.color = 'black';
983
- notification.innerHTML = `
984
- <div class="flex items-center">
985
- <i class="fas fa-check-circle mr-2"></i>
986
- <span class="font-bold futuristic-text">${message}</span>
987
- </div>
988
- `;
989
- document.body.appendChild(notification);
990
-
991
- setTimeout(() => {
992
- notification.style.transition = 'opacity 0.5s';
993
- notification.style.opacity = '0';
994
- setTimeout(() => notification.remove(), 500);
995
- }, 3000);
996
- }
997
 
998
- // Theme selection
999
- function selectTheme(theme) {
1000
- selectedTheme = theme;
1001
- console.log(`Thème sélectionné : ${theme}`);
1002
-
1003
- // Update preview based on theme
1004
- updatePreviewTheme(theme);
1005
- }
 
 
 
 
 
 
 
 
 
 
 
 
1006
 
1007
- // Update custom theme
1008
- function updateCustomTheme(description) {
1009
- if (document.getElementById('other').checked) {
1010
- selectedTheme = description;
1011
- console.log(`Thème personnalisé : ${description}`);
 
 
1012
  }
1013
- }
1014
 
1015
- // Update preview based on selected theme
1016
- function updatePreviewTheme(theme) {
1017
- const previewTitle = document.querySelector('#preview-content .text-2xl');
1018
- const heroTitle = document.querySelector('#preview-content .text-xl');
1019
- const heroText = document.querySelector('#preview-content .text-gray-400');
1020
-
1021
- switch(theme.toLowerCase()) {
1022
- case 'technologie':
1023
- previewTitle.textContent = 'TECH ACADEMY';
1024
- heroTitle.textContent = 'MAÎTRISEZ LA TECHNOLOGIE DE DEMAIN';
1025
- heroText.textContent = 'Rejoignez 50,000+ étudiants dans notre communauté tech.';
1026
- break;
1027
- case 'business':
1028
- previewTitle.textContent = 'BUSINESS PRO';
1029
- heroTitle.textContent = 'DÉVELOPPEZ VOTRE BUSINESS';
1030
- heroText.textContent = 'Rejoignez 35,000+ entrepreneurs dans notre communauté.';
1031
- break;
1032
- case 'créativité':
1033
- previewTitle.textContent = 'CREATIVE LAB';
1034
- heroTitle.textContent = 'LIBÉREZ VOTRE CRÉATIVITÉ';
1035
- heroText.textContent = 'Rejoignez 25,000+ créatifs dans notre communauté.';
1036
- break;
1037
- case 'langues':
1038
- previewTitle.textContent = 'LANGUAGE HUB';
1039
- heroTitle.textContent = 'APPRENEZ UNE NOUVELLE LANGUE';
1040
- heroText.textContent = 'Rejoignez 40,000+ étudiants en langues dans notre communauté.';
1041
- break;
1042
- case 'santé':
1043
- previewTitle.textContent = 'HEALTH MASTERY';
1044
- heroTitle.textContent = 'AMÉLIOREZ VOTRE SANTÉ';
1045
- heroText.textContent = 'Rejoignez 30,000+ membres dans notre communauté santé.';
1046
- break;
1047
- default:
1048
- previewTitle.textContent = 'ACADEMY PRO';
1049
- heroTitle.textContent = 'APPRENEZ EN LIGNE';
1050
- heroText.textContent = 'Rejoignez notre communauté d\'apprentissage.';
1051
  }
1052
- }
1053
 
1054
- // Next step in form
1055
- function nextStep() {
1056
- if (currentStep < 5) {
1057
- currentStep++;
1058
- updateFormSteps();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1059
  }
1060
- }
1061
 
1062
- // Previous step in form
1063
- function prevStep() {
1064
- if (currentStep > 1) {
1065
- currentStep--;
1066
- updateFormSteps();
 
1067
  }
1068
- }
1069
 
1070
- // Update form steps UI
1071
- function updateFormSteps() {
1072
- const steps = document.querySelectorAll('.step');
1073
-
1074
- steps.forEach((step, index) => {
1075
- if (index + 1 === currentStep) {
1076
- step.querySelector('div div').classList.replace('bg-gray-800', 'bg-var(--neon-blue)');
1077
- step.querySelector('span').classList.add('text-var(--neon-blue)');
1078
- step.querySelector('span').classList.remove('opacity-50');
1079
- } else {
1080
- step.querySelector('div div').classList.replace('bg-var(--neon-blue)', 'bg-gray-800');
1081
- step.querySelector('span').classList.remove('text-var(--neon-blue)');
1082
- if (index + 1 > currentStep) {
1083
- step.querySelector('span').classList.add('opacity-50');
1084
- }
1085
  }
1086
- });
1087
-
1088
- // Update form content based on step
1089
- updateFormContent();
1090
- }
1091
 
1092
- // Update form content based on current step
1093
- function updateFormContent() {
1094
- const formContent = document.querySelector('.md\\:col-span-4');
1095
-
1096
- switch(currentStep) {
1097
- case 1:
1098
- formContent.innerHTML = `
1099
- <h3 class="text-2xl font-bold mb-6 futuristic-text text-var(--neon-blue)">CHOISISSEZ VOTRE THÈME PRINCIPAL</h3>
1100
-
1101
- <div class="grid grid-cols-2 md:grid-cols-3 gap-4 mb-8">
1102
- <!-- Theme cards here (same as before) -->
1103
- </div>
1104
-
1105
- <div class="mb-6">
1106
- <label for="custom-theme" class="block text-sm font-medium text-gray-300 mb-2">OU DÉCRIVEZ VOTRE THÈME :</label>
1107
- <input type="text" id="custom-theme" class="w-full p-4 bg-gray-900 border-2 border-gray-700 rounded-lg focus:border-var(--neon-blue) focus:outline-none text-white futuristic-text" placeholder="Ex: Formation en cybersécurité avancée pour entreprises" oninput="updateCustomTheme(this.value)">
1108
- </div>
1109
-
1110
- <div class="flex justify-end">
1111
- <button id="next-step-btn" class="px-8 py-3 bg-var(--neon-blue) text-black rounded-lg font-bold
1112
  </html>
 
118
  transform: rotate(-90deg);
119
  transform-origin: 50% 50%;
120
  }
121
+
122
+ /* Animation pour les boutons actifs */
123
+ .active-button {
124
+ animation: pulse 1.5s infinite;
125
+ position: relative;
126
+ overflow: hidden;
127
+ }
128
+
129
+ .active-button::after {
130
+ content: '';
131
+ position: absolute;
132
+ top: -50%;
133
+ left: -50%;
134
+ width: 200%;
135
+ height: 200%;
136
+ background: linear-gradient(
137
+ to bottom right,
138
+ rgba(255,255,255,0) 45%,
139
+ rgba(255,255,255,0.8) 50%,
140
+ rgba(255,255,255,0) 55%
141
+ );
142
+ transform: rotate(30deg);
143
+ animation: shine 3s infinite;
144
+ }
145
+
146
+ @keyframes shine {
147
+ 0% { transform: translateX(-100%) rotate(30deg); }
148
+ 100% { transform: translateX(100%) rotate(30deg); }
149
+ }
150
  </style>
151
  </head>
152
  <body class="relative overflow-hidden">
 
170
  <span class="text-3xl font-bold futuristic-text neon-text">HyperAI</span>
171
  </div>
172
  <div class="hidden lg:flex items-center space-x-8">
173
+ <a href="https://hyperai-fonctions.com" target="_blank" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">FONCTIONS</a>
174
+ <a href="https://hyperai-solutions.com" target="_blank" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">SOLUTIONS</a>
175
+ <a href="https://hyperai-tarifs.com" target="_blank" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">TARIFS</a>
176
+ <a href="https://hyperai-ressources.com" target="_blank" class="text-white hover:text-var(--neon-blue) font-medium futuristic-text transition-all duration-300">RESSOURCES</a>
177
  </div>
178
  <div class="flex items-center space-x-4">
179
+ <button id="login-btn" class="px-6 py-2 rounded-full border-2 border-var(--neon-blue) text-var(--neon-blue) hover:bg-var(--neon-blue) hover:text-black transition-all duration-300 futuristic-text active-button" onclick="window.open('https://hyperai-login.com', '_blank')">
180
  CONNEXION
181
  </button>
182
+ <button id="free-trial-btn" class="px-6 py-2 rounded-full bg-var(--neon-blue) text-black hover:bg-var(--neon-pink) transition-all duration-300 futuristic-text shadow-lg hover:shadow-xl neon-border active-button" onclick="window.open('https://hyperai-trial.com', '_blank')">
183
  ESSAI GRATUIT
184
  </button>
185
  </div>
 
201
  <span class="text-var(--neon-blue) font-bold">989,999+ IA</span> spécialisées créent votre plateforme de cours en ligne complète en <span class="text-var(--neon-pink) font-bold">10 secondes</span>. Tout service inclus en <span class="text-var(--neon-blue) font-bold">10 minutes</span>.
202
  </p>
203
  <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
204
+ <button id="start-now-btn" class="px-8 py-4 bg-var(--neon-blue) text-black font-bold rounded-full hover:bg-var(--neon-pink) transition-all duration-300 transform hover:scale-105 shadow-lg futuristic-text neon-border active-button" onclick="window.open('https://hyperai-generator.com', '_blank')">
205
  DÉMARRER MAINTENANT <i class="fas fa-arrow-right ml-2"></i>
206
  </button>
207
+ <button id="demo-video-btn" class="px-8 py-4 bg-transparent border-2 border-var(--neon-blue) text-var(--neon-blue) font-bold rounded-full hover:bg-white hover:bg-opacity-10 transition-all duration-300 transform hover:scale-105 futuristic-text active-button" onclick="window.open('https://hyperai-demo.com', '_blank')">
208
  <i class="fas fa-play-circle mr-2"></i> VIDÉO DEMO
209
  </button>
210
  </div>
 
339
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-blue)">Base de données</span>
340
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-blue)">API Intégrées</span>
341
  </div>
342
+ <button class="mt-6 px-4 py-2 bg-var(--neon-blue) text-black rounded text-sm font-bold futuristic-text w-full hover:bg-var(--neon-pink) transition-all duration-300 active-button" onclick="window.open('https://hyperai-architecture.com', '_blank')">
343
  ACTIVER LES IA ARCHITECTES
344
  </button>
345
  </div>
 
359
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-pink)">Animations VR</span>
360
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-pink)">Branding IA</span>
361
  </div>
362
+ <button class="mt-6 px-4 py-2 bg-var(--neon-pink) text-black rounded text-sm font-bold futuristic-text w-full hover:bg-var(--neon-purple) transition-all duration-300 active-button" onclick="window.open('https://hyperai-design.com', '_blank')">
363
  ACTIVER LES IA DESIGNERS
364
  </button>
365
  </div>
 
379
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-purple)">Analyse concurrentielle</span>
380
  <span class="px-3 py-1 bg-gray-900 rounded-full text-xs text-var(--neon-purple)">Recommandations</span>
381
  </div>
382
+ <button class="mt-6 px-4 py-2 bg-var(--neon-purple) text-black rounded text-sm font-bold futuristic-text w-full hover:bg-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-analytics.com', '_blank')">
383
  ACTIVER LES IA ANALYSTES
384
  </button>
385
  </div>
 
393
  <div class="text-center mb-16">
394
  <h2 class="text-4xl md:text-5xl font-bold mb-4 futuristic-text neon-text">GÉNÉRATEUR DE COURS 10s</h2>
395
  <p class="text-xl text-gray-300 max-w-3xl mx-auto">
396
+ Configurez votre plateforme de cours en ligne en quelques clics
397
  </p>
398
  </div>
399
 
 
519
  </div>
520
 
521
  <div class="flex justify-end">
522
+ <button id="next-step-btn" class="px-8 py-3 bg-var(--neon-blue) text-black rounded-lg font-bold hover:bg-var(--neon-pink) transition-all duration-300 futuristic-text neon-border active-button" onclick="window.open('https://hyperai-next-step.com', '_blank')">
523
  SUIVANT <i class="fas fa-arrow-right ml-2"></i>
524
  </button>
525
  </div>
 
541
 
542
  <div class="bg-gray-900 rounded-3xl border-2 border-gray-800 p-8 max-w-6xl mx-auto neon-border">
543
  <div class="flex flex-wrap justify-center gap-4 mb-8">
544
+ <button class="px-5 py-2 bg-var(--neon-blue) text-black rounded-full text-sm font-bold futuristic-text active-button" onclick="window.open('https://hyperai-preview-home.com', '_blank')">ACCUEIL</button>
545
+ <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700 hover:bg-var(--neon-blue) hover:text-black transition-all duration-300" onclick="window.open('https://hyperai-preview-courses.com', '_blank')">COURS</button>
546
+ <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700 hover:bg-var(--neon-blue) hover:text-black transition-all duration-300" onclick="window.open('https://hyperai-preview-instructors.com', '_blank')">FORMATEURS</button>
547
+ <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700 hover:bg-var(--neon-blue) hover:text-black transition-all duration-300" onclick="window.open('https://hyperai-preview-cart.com', '_blank')">PANIER</button>
548
+ <button class="px-5 py-2 bg-gray-800 text-gray-300 rounded-full text-sm font-bold futuristic-text border border-gray-700 hover:bg-var(--neon-blue) hover:text-black transition-all duration-300" onclick="window.open('https://hyperai-preview-dashboard.com', '_blank')">DASHBOARD</button>
549
  </div>
550
 
551
  <div class="bg-black rounded-xl border-2 border-gray-800 overflow-hidden">
 
565
  <div class="flex justify-between items-center mb-8">
566
  <div class="text-2xl font-bold futuristic-text text-var(--neon-blue)">ACADEMY PRO</div>
567
  <div class="flex items-center space-x-4">
568
+ <button class="p-2 text-gray-400 hover:text-var(--neon-blue) active-button" onclick="window.open('https://hyperai-search.com', '_blank')">
569
  <i class="fas fa-search"></i>
570
  </button>
571
+ <button class="p-2 text-gray-400 hover:text-var(--neon-blue) active-button" onclick="window.open('https://hyperai-cart.com', '_blank')">
572
  <i class="fas fa-shopping-cart"></i>
573
  <span class="ml-1 text-xs bg-var(--neon-blue) text-black rounded-full px-1.5 py-0.5">3</span>
574
  </button>
575
+ <button class="p-2 text-gray-400 hover:text-var(--neon-blue) active-button" onclick="window.open('https://hyperai-profile.com', '_blank')">
576
  <i class="fas fa-user-astronaut"></i>
577
  </button>
578
  </div>
 
582
  <div class="mb-8 p-6 rounded-xl bg-gradient-to-r from-gray-900 to-gray-800 border border-gray-700">
583
  <h3 class="text-xl font-bold mb-2">MAÎTRISEZ LA TECHNOLOGIE DE DEMAIN</h3>
584
  <p class="text-gray-400 mb-4">Rejoignez 50,000+ étudiants dans notre communauté d'apprentissage en ligne.</p>
585
+ <button class="px-4 py-2 bg-var(--neon-blue) text-black rounded text-sm font-bold futuristic-text active-button" onclick="window.open('https://hyperai-explore-courses.com', '_blank')">EXPLORER LES COURS</button>
586
  </div>
587
 
588
  <!-- Courses Grid -->
589
  <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
590
  <!-- Course 1 -->
591
+ <div class="course-card bg-gray-900 rounded-lg overflow-hidden border border-gray-800 hover:border-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-course-ai.com', '_blank')">
592
  <div class="relative">
593
  <img src="https://images.unsplash.com/photo-1563986768609-322da13575f8?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Course" class="w-full h-40 object-cover">
594
  <div class="absolute top-2 right-2 bg-black bg-opacity-70 rounded-full w-8 h-8 flex items-center justify-center">
 
610
  </div>
611
 
612
  <!-- Course 2 -->
613
+ <div class="course-card bg-gray-900 rounded-lg overflow-hidden border border-gray-800 hover:border-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-course-blockchain.com', '_blank')">
614
  <div class="relative">
615
  <img src="https://images.unsplash.com/photo-1550751827-4bd374c3f58b?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Course" class="w-full h-40 object-cover">
616
  <div class="absolute top-2 right-2 bg-black bg-opacity-70 rounded-full w-8 h-8 flex items-center justify-center">
 
631
  </div>
632
 
633
  <!-- Course 3 -->
634
+ <div class="course-card bg-gray-900 rounded-lg overflow-hidden border border-gray-800 hover:border-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-course-cybersecurity.com', '_blank')">
635
  <div class="relative">
636
  <img src="https://images.unsplash.com/photo-1547658719-da2b51169166?ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=80" alt="Course" class="w-full h-40 object-cover">
637
  <div class="absolute top-2 right-2 bg-black bg-opacity-70 rounded-full w-8 h-8 flex items-center justify-center">
 
680
  </h2>
681
  <p class="text-xl text-gray-300 mb-8">989,999 IA sont prêtes à créer votre site en <span class="text-var(--neon-blue) font-bold">10 secondes</span> avec tous les services inclus en <span class="text-var(--neon-pink) font-bold">10 minutes</span>.</p>
682
  <div class="flex flex-col sm:flex-row justify-center space-y-4 sm:space-y-0 sm:space-x-6">
683
+ <button id="final-start-btn" class="px-10 py-5 bg-var(--neon-blue) text-black font-bold rounded-full hover:bg-var(--neon-pink) transition-all duration-300 transform hover:scale-105 shadow-2xl futuristic-text text-xl neon-border active-button" onclick="window.open('https://hyperai-start-now.com', '_blank')">
684
  COMMENCER MAINTENANT <i class="fas fa-rocket ml-2"></i>
685
  </button>
686
+ <button id="contact-expert-btn" class="px-10 py-5 bg-transparent border-2 border-var(--neon-blue) text-var(--neon-blue) font-bold rounded-full hover:bg-white hover:bg-opacity-10 transition-all duration-300 transform hover:scale-105 futuristic-text text-xl active-button" onclick="window.open('https://hyperai-contact-expert.com', '_blank')">
687
  <i class="fas fa-headset mr-2"></i> CONTACT EXPERT
688
  </button>
689
  </div>
 
709
  </div>
710
  <p class="text-sm mb-6">La plateforme ultime pour créer des marketplaces de cours en ligne alimentée par 989,999 IA spécialisées.</p>
711
  <div class="flex space-x-4">
712
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300 active-button" onclick="window.open('https://facebook.com/hyperai', '_blank')">
713
  <i class="fab fa-facebook-f"></i>
714
  </a>
715
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300 active-button" onclick="window.open('https://twitter.com/hyperai', '_blank')">
716
  <i class="fab fa-twitter"></i>
717
  </a>
718
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300 active-button" onclick="window.open('https://linkedin.com/company/hyperai', '_blank')">
719
  <i class="fab fa-linkedin-in"></i>
720
  </a>
721
+ <a href="#" class="w-10 h-10 rounded-full bg-gray-900 hover:bg-var(--neon-blue) hover:text-black flex items-center justify-center transition-all duration-300 active-button" onclick="window.open('https://discord.gg/hyperai', '_blank')">
722
  <i class="fab fa-discord"></i>
723
  </a>
724
  </div>
 
726
  <div>
727
  <h4 class="text-lg font-bold text-white mb-4 futuristic-text">PRODUIT</h4>
728
  <ul class="space-y-3 text-sm">
729
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-features.com', '_blank')">Fonctionnalités</a></li>
730
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-pricing.com', '_blank')">Tarifs</a></li>
731
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-specialized-ai.com', '_blank')">IA Spécialisées</a></li>
732
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-integrations.com', '_blank')">Intégrations</a></li>
733
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-roadmap.com', '_blank')">Roadmap</a></li>
734
  </ul>
735
  </div>
736
  <div>
737
  <h4 class="text-lg font-bold text-white mb-4 futuristic-text">RESSOURCES</h4>
738
  <ul class="space-y-3 text-sm">
739
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-blog.com', '_blank')">Blog</a></li>
740
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-docs.com', '_blank')">Documentation</a></li>
741
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-tutorials.com', '_blank')">Tutoriels</a></li>
742
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-support.com', '_blank')">Support</a></li>
743
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-api.com', '_blank')">API</a></li>
744
  </ul>
745
  </div>
746
  <div>
747
  <h4 class="text-lg font-bold text-white mb-4 futuristic-text">ENTREPRISE</h4>
748
  <ul class="space-y-3 text-sm">
749
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-about.com', '_blank')">À propos</a></li>
750
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-careers.com', '_blank')">Carrières</a></li>
751
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-partners.com', '_blank')">Partenaires</a></li>
752
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-contact.com', '_blank')">Contact</a></li>
753
+ <li><a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-press.com', '_blank')">Presse</a></li>
754
  </ul>
755
  </div>
756
  </div>
757
  <div class="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
758
  <p class="text-xs mb-4 md:mb-0">© 2023 HyperAI. Tous droits réservés. Une création de 989,999 IA.</p>
759
  <div class="flex space-x-6 text-xs">
760
+ <a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-terms.com', '_blank')">Conditions</a>
761
+ <a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-privacy.com', '_blank')">Confidentialité</a>
762
+ <a href="#" class="hover:text-var(--neon-blue) transition-all duration-300 active-button" onclick="window.open('https://hyperai-cookies.com', '_blank')">Cookies</a>
763
  </div>
764
  </div>
765
  </div>
 
785
 
786
  // Auto-activate all buttons for demo purposes
787
  autoActivateButtons();
788
+
789
+ // Start generation animation
790
+ startGeneration();
791
  });
792
 
793
  // Auto-activate all buttons
794
  function autoActivateButtons() {
795
+ // Add active-button class to all interactive elements
796
+ document.querySelectorAll('button, a[href="#"], .course-card, .theme-card').forEach(el => {
797
+ el.classList.add('active-button');
 
 
 
 
 
 
 
 
 
 
 
 
 
 
798
  });
799
  }
800
 
 
977
  <i class="fas fa-rocket"></i>
978
  </div>
979
  </div>
980
+ <div class="col-span-11">
981
+ <p class="text-var(--neon-blue) font-bold">PLATEFORME PRÊTE À ÊTRE PUBLIÉE !</p>
982
+ <p class="text-xs text-gray-400">989,999 IA ont terminé leur travail en 10 secondes</p>
983
+ </div>
984
+ `;
985
+ statusContainer.appendChild(completionMessage);
986
+
987
+ // Enable buttons and show success
988
+ document.getElementById('start-now-btn').disabled = false;
989
+ document.getElementById('final-start-btn').disabled = false;
990
+
991
+ // Show success notification
992
+ showNotification('Plateforme générée avec succès!', 'var(--neon-blue)');
993
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
994
 
995
+ // Show notification
996
+ function showNotification(message, color) {
997
+ const notification = document.createElement('div');
998
+ notification.className = 'fixed top-4 right-4 p-4 rounded-lg shadow-lg z-50';
999
+ notification.style.backgroundColor = color;
1000
+ notification.style.color = 'black';
1001
+ notification.innerHTML = `
1002
+ <div class="flex items-center">
1003
+ <i class="fas fa-check-circle mr-2"></i>
1004
+ <span class="font-bold futuristic-text">${message}</span>
1005
+ </div>
1006
+ `;
1007
+ document.body.appendChild(notification);
1008
+
1009
+ setTimeout(() => {
1010
+ notification.style.transition = 'opacity 0.5s';
1011
+ notification.style.opacity = '0';
1012
+ setTimeout(() => notification.remove(), 500);
1013
+ }, 3000);
1014
+ }
1015
 
1016
+ // Theme selection
1017
+ function selectTheme(theme) {
1018
+ selectedTheme = theme;
1019
+ console.log(`Thème sélectionné : ${theme}`);
1020
+
1021
+ // Update preview based on theme
1022
+ updatePreviewTheme(theme);
1023
  }
 
1024
 
1025
+ // Update custom theme
1026
+ function updateCustomTheme(description) {
1027
+ if (document.getElementById('other').checked) {
1028
+ selectedTheme = description;
1029
+ console.log(`Thème personnalisé : ${description}`);
1030
+ }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1031
  }
 
1032
 
1033
+ // Update preview based on selected theme
1034
+ function updatePreviewTheme(theme) {
1035
+ const previewTitle = document.querySelector('#preview-content .text-2xl');
1036
+ const heroTitle = document.querySelector('#preview-content .text-xl');
1037
+ const heroText = document.querySelector('#preview-content .text-gray-400');
1038
+
1039
+ switch(theme.toLowerCase()) {
1040
+ case 'technologie':
1041
+ previewTitle.textContent = 'TECH ACADEMY';
1042
+ heroTitle.textContent = 'MAÎTRISEZ LA TECHNOLOGIE DE DEMAIN';
1043
+ heroText.textContent = 'Rejoignez 50,000+ étudiants dans notre communauté tech.';
1044
+ break;
1045
+ case 'business':
1046
+ previewTitle.textContent = 'BUSINESS PRO';
1047
+ heroTitle.textContent = 'DÉVELOPPEZ VOTRE BUSINESS';
1048
+ heroText.textContent = 'Rejoignez 35,000+ entrepreneurs dans notre communauté.';
1049
+ break;
1050
+ case 'créativité':
1051
+ previewTitle.textContent = 'CREATIVE LAB';
1052
+ heroTitle.textContent = 'LIBÉREZ VOTRE CRÉATIVITÉ';
1053
+ heroText.textContent = 'Rejoignez 25,000+ créatifs dans notre communauté.';
1054
+ break;
1055
+ case 'langues':
1056
+ previewTitle.textContent = 'LANGUAGE HUB';
1057
+ heroTitle.textContent = 'APPRENEZ UNE NOUVELLE LANGUE';
1058
+ heroText.textContent = 'Rejoignez 40,000+ étudiants en langues dans notre communauté.';
1059
+ break;
1060
+ case 'santé':
1061
+ previewTitle.textContent = 'HEALTH MASTERY';
1062
+ heroTitle.textContent = 'AMÉLIOREZ VOTRE SANTÉ';
1063
+ heroText.textContent = 'Rejoignez 30,000+ membres dans notre communauté santé.';
1064
+ break;
1065
+ default:
1066
+ previewTitle.textContent = 'ACADEMY PRO';
1067
+ heroTitle.textContent = 'APPRENEZ EN LIGNE';
1068
+ heroText.textContent = 'Rejoignez notre communauté d\'apprentissage.';
1069
+ }
1070
  }
 
1071
 
1072
+ // Next step in form
1073
+ function nextStep() {
1074
+ if (currentStep < 5) {
1075
+ currentStep++;
1076
+ updateFormSteps();
1077
+ }
1078
  }
 
1079
 
1080
+ // Previous step in form
1081
+ function prevStep() {
1082
+ if (currentStep > 1) {
1083
+ currentStep--;
1084
+ updateFormSteps();
 
 
 
 
 
 
 
 
 
 
1085
  }
1086
+ }
 
 
 
 
1087
 
1088
+ // Update form steps UI
1089
+ function updateFormSteps() {
1090
+ const steps = document.querySelectorAll('.step');
1091
+
1092
+ steps.forEach((step, index) => {
1093
+ if (index + 1 === currentStep) {
1094
+ step.querySelector('div div').classList.replace('bg-gray-800', 'bg-var(--neon-blue)');
1095
+ step.querySelector('span').classList.add('text-var(--neon-blue)');
1096
+ step.querySelector('span').classList.remove('opacity-50');
1097
+ } else {
1098
+ step.querySelector('div div').classList.replace('bg-var(--neon-blue)', 'bg-gray-800');
1099
+ step.querySelector('span').classList.remove('text-var(--neon-blue)');
1100
+ if (index + 1 > currentStep) {
1101
+ step.querySelector('span').classList.add('opacity-50');
1102
+ }
1103
+ }
1104
+ });
1105
+
1106
+ // Update form content based
 
1107
  </html>
prompts.txt CHANGED
@@ -3,4 +3,5 @@ creer avec seulement description du site
3
  creer moi un generateur de market place tout service alimenté automatique par plussieur assistant IA AVEC UNE INTERFACE TRES BELLE ET TRES ANIME
4
  CREER UN SITE IA AVEC PLUS DE 989999 BOUTON IA QUI CREER DES SITE DE COURS EN LIGNE TOUT EN 10 SECONDE TOUTES SERVICE COURSES EN LIGNE COMPRIS EN 10 MINUTE AVEC UNE TRES BELLE INTERFACE FUTIRISTE ET TRES ANIME
5
  ACTIVER TOUTES LES FONCTIONS REEL ET VRAI DE CHAQUE BOUTON ACTIVE QUE JE QUE CHAQUE BOUTON ACTIVER CHAQUE IA SE MET AU TRAVAIL DE SUITE EN AUTOMATIQUE
6
- ACTIVER CHAQUE BOUTON EN AUTOMATIQUE ET OUVRER CHAQUE BOUTON CLIQUER DANS UNE NOUVEL PAGE POUR UTILISER LE SERVICE CHOISIE
 
 
3
  creer moi un generateur de market place tout service alimenté automatique par plussieur assistant IA AVEC UNE INTERFACE TRES BELLE ET TRES ANIME
4
  CREER UN SITE IA AVEC PLUS DE 989999 BOUTON IA QUI CREER DES SITE DE COURS EN LIGNE TOUT EN 10 SECONDE TOUTES SERVICE COURSES EN LIGNE COMPRIS EN 10 MINUTE AVEC UNE TRES BELLE INTERFACE FUTIRISTE ET TRES ANIME
5
  ACTIVER TOUTES LES FONCTIONS REEL ET VRAI DE CHAQUE BOUTON ACTIVE QUE JE QUE CHAQUE BOUTON ACTIVER CHAQUE IA SE MET AU TRAVAIL DE SUITE EN AUTOMATIQUE
6
+ ACTIVER CHAQUE BOUTON EN AUTOMATIQUE ET OUVRER CHAQUE BOUTON CLIQUER DANS UNE NOUVEL PAGE POUR UTILISER LE SERVICE CHOISIE
7
+ QUAND ON APPUI SUR LES BOUTON SA MENE A UNE PAGE INACCESIBLE