Spaces:

docto41
/

nexusimport

Running

App Files Files Community

docto41 commited on May 18, 2025

Commit

59a4d44

verified ·

1 Parent(s): 1454434

Add 2 files

Browse files

Files changed (2) hide show

index.html +421 -349
prompts.txt +2 -1

index.html CHANGED Viewed

@@ -3,8 +3,9 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>NEXUS-978978 | Plateforme IA Futuriste</title>
     <script src="https://cdn.tailwindcss.com"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
         @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Rajdhani:wght@300;500;700&display=swap');
@@ -142,13 +143,6 @@
             color: var(--primary);
         }
-        .holographic {
-            background: linear-gradient(135deg, rgba(0, 240, 255, 0.1), rgba(123, 45, 255, 0.1));
-            backdrop-filter: blur(5px);
-            border-top: 1px solid rgba(0, 240, 255, 0.3);
-            border-bottom: 1px solid rgba(123, 45, 255, 0.3);
-        }
         .terminal {
             background: rgba(0, 0, 0, 0.7);
             border: 1px solid rgba(0, 240, 255, 0.3);
@@ -186,11 +180,39 @@
             opacity: 0.7;
         }
-        .grid-pattern {
-            background-image:
-                linear-gradient(rgba(0, 240, 255, 0.03) 1px, transparent 1px),
-                linear-gradient(90deg, rgba(0, 240, 255, 0.03) 1px, transparent 1px);
-            background-size: 30px 30px;
         }
     </style>
 </head>
@@ -212,9 +234,9 @@
                 </h1>
             </div>
             <div class="hidden md:flex space-x-6 items-center">
-                <a href="#" class="text-white hover:text-cyan-300 transition font-medium">Hub</a>
                 <a href="#" class="text-white hover:text-cyan-300 transition font-medium">Agents</a>
-                <a href="#" class="text-white hover:text-cyan-300 transition font-medium">Créations</a>
                 <a href="#" class="text-white hover:text-cyan-300 transition font-medium">API</a>
                 <div class="w-10 h-10 rounded-full bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center glow-button">
                     <i class="fas fa-user-astronaut"></i>
@@ -227,339 +249,236 @@
     </nav>
     <!-- Main Content -->
-    <main class="container mx-auto px-4 py-10 relative z-10">
-        <!-- Hero Section -->
-        <section class="text-center mb-20 relative">
-            <div class="absolute -top-20 -left-20 w-40 h-40 rounded-full bg-purple-900 opacity-20 blur-3xl"></div>
-            <div class="absolute -bottom-20 -right-20 w-60 h-60 rounded-full bg-cyan-900 opacity-20 blur-3xl"></div>
-            <h2 class="text-4xl md:text-6xl font-orbitron mb-6">
-                <span class="neon-text">PLATEFORME</span> <span class="text-purple-300">IA</span>
-            </h2>
-            <p class="text-xl md:text-2xl text-slate-300 max-w-4xl mx-auto mb-10">
-                <span class="neon-text">978978 agents IA</span> spécialisés dans la création de sites web, code et scripts en temps réel
-            </p>
-            <div class="flex flex-wrap justify-center gap-4 mb-16">
-                <button class="px-8 py-3 rounded-lg glow-button font-medium">
-                    <i class="fas fa-bolt mr-2"></i> Démarrer un projet
-                </button>
-                <button class="px-8 py-3 rounded-lg bg-slate-800 hover:bg-slate-700 border border-cyan-500 border-opacity-30 font-medium">
-                    <i class="fas fa-eye mr-2"></i> Voir démo
-                </button>
-            </div>
-            <div class="relative max-w-4xl mx-auto h-64 md:h-96 rounded-2xl overflow-hidden neon-border scanlines">
-                <div class="absolute inset-0 bg-gradient-to-br from-cyan-900 to-purple-900 opacity-30"></div>
-                <div class="absolute inset-0 flex items-center justify-center">
-                    <div class="text-center p-6">
-                        <div class="w-20 h-20 mx-auto mb-4 rounded-full bg-gradient-to-br from-cyan-500 to-purple-600 flex items-center justify-center ai-core floating">
-                            <i class="fas fa-robot text-2xl"></i>
-                        </div>
-                        <h3 class="text-xl md:text-2xl font-orbitron mb-2">Initialisation du réseau IA</h3>
-                        <p class="text-slate-300">Chargement des 978978 agents créatifs...</p>
-                    </div>
-                </div>
-            </div>
-        </section>
-        <!-- Agents Grid -->
-        <section class="mb-20">
-            <h3 class="text-2xl md:text-3xl font-orbitron mb-8 text-center">
-                <span class="neon-text">Réseau d'Agents</span> <span class="text-purple-300">Spécialisés</span>
-            </h3>
-            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-                <!-- Agent Card 1 -->
-                <div class="cyber-card rounded-xl p-6 relative overflow-hidden">
-                    <div class="absolute -right-10 -top-10 w-32 h-32 rounded-full bg-cyan-500 opacity-10"></div>
-                    <div class="flex items-start mb-4">
-                        <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center mr-4">
-                            <i class="fas fa-code"></i>
-                        </div>
-                        <div>
-                            <h4 class="font-orbitron text-lg">Générateur de Sites</h4>
-                            <span class="text-xs agent-id">AGENT#WEB-{random(10000,99999)}</span>
-                        </div>
-                    </div>
-                    <p class="text-slate-300 mb-4">Crée des sites web complets avec design responsive, animations et fonctionnalités avancées en quelques secondes.</p>
-                    <div class="flex flex-wrap gap-2">
-                        <span class="text-xs px-2 py-1 rounded bg-cyan-900 bg-opacity-30 text-cyan-300">HTML5</span>
-                        <span class="text-xs px-2 py-1 rounded bg-purple-900 bg-opacity-30 text-purple-300">CSS3</span>
-                        <span class="text-xs px-2 py-1 rounded bg-yellow-900 bg-opacity-30 text-yellow-300">JavaScript</span>
-                    </div>
-                </div>
-                <!-- Agent Card 2 -->
-                <div class="cyber-card rounded-xl p-6 relative overflow-hidden">
-                    <div class="absolute -right-10 -top-10 w-32 h-32 rounded-full bg-purple-500 opacity-10"></div>
-                    <div class="flex items-start mb-4">
-                        <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-purple-500 to-pink-600 flex items-center justify-center mr-4">
-                            <i class="fas fa-terminal"></i>
-                        </div>
-                        <div>
-                            <h4 class="font-orbitron text-lg">Générateur de Code</h4>
-                            <span class="text-xs agent-id">AGENT#CODE-{random(10000,99999)}</span>
-                        </div>
-                    </div>
-                    <p class="text-slate-300 mb-4">Produit du code optimisé dans tous les langages populaires avec documentation et exemples d'implémentation.</p>
-                    <div class="flex flex-wrap gap-2">
-                        <span class="text-xs px-2 py-1 rounded bg-blue-900 bg-opacity-30 text-blue-300">Python</span>
-                        <span class="text-xs px-2 py-1 rounded bg-red-900 bg-opacity-30 text-red-300">Java</span>
-                        <span class="text-xs px-2 py-1 rounded bg-green-900 bg-opacity-30 text-green-300">C++</span>
-                    </div>
-                </div>
-                <!-- Agent Card 3 -->
-                <div class="cyber-card rounded-xl p-6 relative overflow-hidden">
-                    <div class="absolute -right-10 -top-10 w-32 h-32 rounded-full bg-green-500 opacity-10"></div>
-                    <div class="flex items-start mb-4">
-                        <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-green-500 to-teal-600 flex items-center justify-center mr-4">
-                            <i class="fas fa-scroll"></i>
                         </div>
-                        <div>
-                            <h4 class="font-orbitron text-lg">Générateur de Scripts</h4>
-                            <span class="text-xs agent-id">AGENT#SCRIPT-{random(10000,99999)}</span>
                         </div>
-                    </div>
-                    <p class="text-slate-300 mb-4">Développe des scripts automatisés pour toutes les plateformes avec gestion des erreurs et logging.</p>
-                    <div class="flex flex-wrap gap-2">
-                        <span class="text-xs px-2 py-1 rounded bg-emerald-900 bg-opacity-30 text-emerald-300">Bash</span>
-                        <span class="text-xs px-2 py-1 rounded bg-orange-900 bg-opacity-30 text-orange-300">PowerShell</span>
-                        <span class="text-xs px-2 py-1 rounded bg-pink-900 bg-opacity-30 text-pink-300">Ruby</span>
-                    </div>
-                </div>
-                <!-- Agent Card 4 -->
-                <div class="cyber-card rounded-xl p-6 relative overflow-hidden">
-                    <div class="absolute -right-10 -top-10 w-32 h-32 rounded-full bg-pink-500 opacity-10"></div>
-                    <div class="flex items-start mb-4">
-                        <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-pink-500 to-red-600 flex items-center justify-center mr-4">
-                            <i class="fas fa-database"></i>
                         </div>
-                        <div>
-                            <h4 class="font-orbitron text-lg">Architecte de Bases de Données</h4>
-                            <span class="text-xs agent-id">AGENT#DB-{random(10000,99999)}</span>
                         </div>
                     </div>
-                    <p class="text-slate-300 mb-4">Conçoit des schémas de base de données optimisés avec requêtes SQL et ORM prêts à l'emploi.</p>
-                    <div class="flex flex-wrap gap-2">
-                        <span class="text-xs px-2 py-1 rounded bg-indigo-900 bg-opacity-30 text-indigo-300">PostgreSQL</span>
-                        <span class="text-xs px-2 py-1 rounded bg-amber-900 bg-opacity-30 text-amber-300">MongoDB</span>
-                        <span class="text-xs px-2 py-1 rounded bg-rose-900 bg-opacity-30 text-rose-300">Redis</span>
-                    </div>
                 </div>
-                <!-- Agent Card 5 -->
-                <div class="cyber-card rounded-xl p-6 relative overflow-hidden">
-                    <div class="absolute -right-10 -top-10 w-32 h-32 rounded-full bg-yellow-500 opacity-10"></div>
-                    <div class="flex items-start mb-4">
-                        <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-yellow-500 to-amber-600 flex items-center justify-center mr-4">
-                            <i class="fas fa-shield-alt"></i>
                         </div>
-                        <div>
-                            <h4 class="font-orbitron text-lg">Spécialiste Sécurité</h4>
-                            <span class="text-xs agent-id">AGENT#SEC-{random(10000,99999)}</span>
-                        </div>
-                    </div>
-                    <p class="text-slate-300 mb-4">Implémente des protocoles de sécurité avancés et détecte les vulnérabilités potentielles.</p>
-                    <div class="flex flex-wrap gap-2">
-                        <span class="text-xs px-2 py-1 rounded bg-red-900 bg-opacity-30 text-red-300">OWASP</span>
-                        <span class="text-xs px-2 py-1 rounded bg-blue-900 bg-opacity-30 text-blue-300">SSL/TLS</span>
-                        <span class="text-xs px-2 py-1 rounded bg-gray-900 bg-opacity-30 text-gray-300">Pentest</span>
-                    </div>
-                </div>
-                <!-- Agent Card 6 -->
-                <div class="cyber-card rounded-xl p-6 relative overflow-hidden">
-                    <div class="absolute -right-10 -top-10 w-32 h-32 rounded-full bg-red-500 opacity-10"></div>
-                    <div class="flex items-start mb-4">
-                        <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-red-500 to-orange-600 flex items-center justify-center mr-4">
-                            <i class="fas fa-cloud"></i>
                         </div>
-                        <div>
-                            <h4 class="font-orbitron text-lg">Expert Déploiement</h4>
-                            <span class="text-xs agent-id">AGENT#DEPLOY-{random(10000,99999)}</span>
                         </div>
                     </div>
-                    <p class="text-slate-300 mb-4">Automatise les pipelines CI/CD et configure les environnements cloud pour un déploiement sans faille.</p>
-                    <div class="flex flex-wrap gap-2">
-                        <span class="text-xs px-2 py-1 rounded bg-cyan-900 bg-opacity-30 text-cyan-300">Docker</span>
-                        <span class="text-xs px-2 py-1 rounded bg-orange-900 bg-opacity-30 text-orange-300">Kubernetes</span>
-                        <span class="text-xs px-2 py-1 rounded bg-purple-900 bg-opacity-30 text-purple-300">AWS</span>
-                    </div>
                 </div>
             </div>
-        </section>
-        <!-- Creation Interface -->
-        <section class="mb-20">
-            <h3 class="text-2xl md:text-3xl font-orbitron mb-8 text-center">
-                <span class="neon-text">Interface</span> <span class="text-purple-300">de Création</span>
-            </h3>
-            <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
-                <!-- Input Panel -->
-                <div class="cyber-card rounded-xl p-6 lg:col-span-1">
-                    <h4 class="font-orbitron text-lg mb-4">Paramètres du Projet</h4>
-                    <div class="mb-4">
-                        <label class="block text-sm text-slate-400 mb-2">Type de création</label>
-                        <select class="w-full bg-slate-800 border border-cyan-500 border-opacity-30 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500">
-                            <option>Site Web</option>
-                            <option>Application Web</option>
-                            <option>Script</option>
-                            <option>API</option>
-                            <option>Base de données</option>
-                        </select>
                     </div>
-                    <div class="mb-4">
-                        <label class="block text-sm text-slate-400 mb-2">Nom du projet</label>
-                        <input type="text" class="w-full bg-slate-800 border border-cyan-500 border-opacity-30 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500" placeholder="MonProjetInnovant">
                     </div>
-                    <div class="mb-4">
                         <label class="block text-sm text-slate-400 mb-2">Description</label>
-                        <textarea class="w-full bg-slate-800 border border-cyan-500 border-opacity-30 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500" rows="3" placeholder="Décrivez votre projet..."></textarea>
                     </div>
                     <div class="mb-6">
                         <label class="block text-sm text-slate-400 mb-2">Technologies</label>
-                        <div class="flex flex-wrap gap-2">
-                            <span class="text-xs px-2 py-1 rounded-full bg-cyan-900 bg-opacity-30 text-cyan-300 flex items-center">
-                                React <button class="ml-1 text-cyan-500 hover:text-cyan-300"><i class="fas fa-times text-xs"></i></button>
-                            </span>
-                            <span class="text-xs px-2 py-1 rounded-full bg-purple-900 bg-opacity-30 text-purple-300 flex items-center">
-                                Node.js <button class="ml-1 text-purple-500 hover:text-purple-300"><i class="fas fa-times text-xs"></i></button>
-                            </span>
-                            <button class="text-xs px-2 py-1 rounded-full bg-slate-800 border border-dashed border-cyan-500 border-opacity-30 text-cyan-300 hover:bg-slate-700">
-                                <i class="fas fa-plus mr-1"></i> Ajouter
                             </button>
                         </div>
                     </div>
-                    <button class="w-full py-3 rounded-lg glow-button font-medium">
-                        <i class="fas fa-cogs mr-2"></i> Configurer les Agents
-                    </button>
                 </div>
-                <!-- Code Preview -->
-                <div class="cyber-card rounded-xl p-0 overflow-hidden lg:col-span-2">
                     <div class="h-12 bg-slate-800 border-b border-cyan-500 border-opacity-30 flex items-center px-4">
-                        <div class="flex space-x-2">
                             <div class="w-3 h-3 rounded-full bg-red-500"></div>
                             <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
                             <div class="w-3 h-3 rounded-full bg-green-500"></div>
                         </div>
-                        <div class="ml-4 text-sm font-mono text-slate-400">
-                            generated-code.js
                         </div>
                     </div>
                     <div class="terminal p-4 h-96 overflow-auto">
-                        <pre class="text-sm">
-<span class="text-purple-400">import</span> <span class="text-cyan-400">React</span> <span class="text-purple-400">from</span> <span class="text-amber-300">'react'</span>;
-<span class="text-purple-400">import</span> { <span class="text-cyan-400">useState</span>, <span class="text-cyan-400">useEffect</span> } <span class="text-purple-400">from</span> <span class="text-amber-300">'react'</span>;
-<span class="text-purple-400">import</span> <span class="text-cyan-400">styled</span> <span class="text-purple-400">from</span> <span class="text-amber-300">'styled-components'</span>;
-<span class="text-gray-500">// Composant futuriste généré par NEXUS-978978</span>
-<span class="text-purple-400">const</span> <span class="text-cyan-400">CyberButton</span> = <span class="text-cyan-400">styled</span>.<span class="text-cyan-300">button</span>`
-  <span class="text-green-400">background</span>: <span class="text-amber-300">linear-gradient</span>(<span class="text-purple-400">135deg</span>, <span class="text-amber-300">#00f0ff</span> <span class="text-purple-400">0%</span>, <span class="text-amber-300">#7b2dff</span> <span class="text-purple-400">100%</span>);
-  <span class="text-green-400">box-shadow</span>: <span class="text-amber-300">0</span> <span class="text-purple-400">0</span> <span class="text-amber-300">15px</span> <span class="text-amber-300">rgba</span>(<span class="text-purple-400">0, 240, 255, 0.5</span>);
-  <span class="text-green-400">transition</span>: <span class="text-amber-300">all</span> <span class="text-purple-400">0.3s</span> <span class="text-amber-300">ease</span>;
-  <span class="text-amber-300">&:hover</span> {
-    <span class="text-green-400">box-shadow</span>: <span class="text-amber-300">0</span> <span class="text-purple-400">0</span> <span class="text-amber-300">25px</span> <span class="text-amber-300">rgba</span>(<span class="text-purple-400">123, 45, 255, 0.7</span>);
-    <span class="text-green-400">transform</span>: <span class="text-amber-300">translateY</span>(<span class="text-purple-400">-2px</span>);
-  }
-`;
-<span class="text-purple-400">export</span> <span class="text-purple-400">default</span> <span class="text-purple-400">function</span> <span class="text-cyan-400">App</span>() {
-  <span class="text-purple-400">const</span> [<span class="text-cyan-400">count</span>, <span class="text-cyan-400">setCount</span>] = <span class="text-cyan-300">useState</span>(<span class="text-purple-400">0</span>);
-  <span class="text-cyan-300">useEffect</span>(() => {
-    <span class="text-purple-400">const</span> <span class="text-cyan-400">timer</span> = <span class="text-cyan-300">setInterval</span>(() => {
-      <span class="text-cyan-300">setCount</span>(<span class="text-cyan-400">c</span> => <span class="text-cyan-400">c</span> + <span class="text-purple-400">1</span>);
-    }, <span class="text-purple-400">1000</span>);
-    <span class="text-purple-400">return</span> () => <span class="text-cyan-300">clearInterval</span>(<span class="text-cyan-400">timer</span>);
-  }, []);
-  <span class="text-purple-400">return</span> (
-    <span class="text-amber-300">&lt;div className="app"&gt;</span>
-      <span class="text-amber-300">&lt;CyberButton onClick=</span>{<span class="text-purple-400">()</span> => <span class="text-cyan-300">setCount</span>(<span class="text-purple-400">0</span>)}<span class="text-amber-300">&gt;</span>
-        Compteur: {<span class="text-cyan-400">count</span>}
-      <span class="text-amber-300">&lt;/CyberButton&gt;</span>
-    <span class="text-amber-300">&lt;/div&gt;</span>
-  );
-}</pre>
                     </div>
                 </div>
-            </div>
-        </section>
-        <!-- Agent Network Visualization -->
-        <section class="mb-20">
-            <h3 class="text-2xl md:text-3xl font-orbitron mb-8 text-center">
-                <span class="neon-text">Réseau</span> <span class="text-purple-300">d'Agents</span>
-            </h3>
-            <div class="cyber-card rounded-xl p-6 h-96 relative overflow-hidden">
-                <div class="absolute inset-0 flex items-center justify-center">
-                    <div class="text-center">
-                        <div class="w-32 h-32 mx-auto mb-6 rounded-full bg-gradient-to-br from-cyan-500 to-purple-600 flex items-center justify-center ai-core">
-                            <i class="fas fa-network-wired text-4xl"></i>
                         </div>
-                        <h4 class="text-xl md:text-2xl font-orbitron mb-2">978978 Agents Connectés</h4>
-                        <p class="text-slate-300 max-w-lg mx-auto">Visualisation en temps réel des interactions entre les agents IA spécialisés</p>
                     </div>
-                </div>
-                <!-- Network nodes animation -->
-                <div class="absolute inset-0">
-                    <div class="absolute top-1/4 left-1/4 w-8 h-8 rounded-full bg-cyan-500 opacity-70 pulse"></div>
-                    <div class="absolute top-1/3 right-1/3 w-6 h-6 rounded-full bg-purple-500 opacity-70 pulse" style="animation-delay: 0.5s;"></div>
-                    <div class="absolute bottom-1/4 left-1/3 w-5 h-5 rounded-full bg-pink-500 opacity-70 pulse" style="animation-delay: 1s;"></div>
-                    <div class="absolute top-1/2 right-1/4 w-7 h-7 rounded-full bg-green-500 opacity-70 pulse" style="animation-delay: 1.5s;"></div>
-                    <div class="absolute bottom-1/3 left-1/2 w-6 h-6 rounded-full bg-yellow-500 opacity-70 pulse" style="animation-delay: 0.7s;"></div>
-                    <!-- Connecting lines -->
-                    <svg class="absolute inset-0 w-full h-full" xmlns="http://www.w3.org/2000/svg">
-                        <line x1="25%" y1="25%" x2="33%" y2="33%" stroke="rgba(0, 240, 255, 0.3)" stroke-width="1" />
-                        <line x1="33%" y1="33%" x2="50%" y2="33%" stroke="rgba(123, 45, 255, 0.3)" stroke-width="1" />
-                        <line x1="50%" y1="33%" x2="75%" y2="25%" stroke="rgba(255, 0, 128, 0.3)" stroke-width="1" />
-                        <line x1="25%" y1="25%" x2="25%" y2="50%" stroke="rgba(0, 255, 157, 0.3)" stroke-width="1" />
-                        <line x1="25%" y1="50%" x2="33%" y2="66%" stroke="rgba(255, 230, 0, 0.3)" stroke-width="1" />
-                    </svg>
-                </div>
-            </div>
-        </section>
-        <!-- Stats Section -->
-        <section class="mb-20">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
-                <div class="cyber-card rounded-xl p-6 text-center">
-                    <div class="text-4xl font-orbitron neon-text mb-2">978,978</div>
-                    <div class="text-slate-400">Agents IA</div>
-                </div>
-                <div class="cyber-card rounded-xl p-6 text-center">
-                    <div class="text-4xl font-orbitron text-purple-300 mb-2">24/7</div>
-                    <div class="text-slate-400">Disponibilité</div>
-                </div>
-                <div class="cyber-card rounded-xl p-6 text-center">
-                    <div class="text-4xl font-orbitron text-cyan-300 mb-2">0.001s</div>
-                    <div class="text-slate-400">Temps de réponse</div>
-                </div>
-                <div class="cyber-card rounded-xl p-6 text-center">
-                    <div class="text-4xl font-orbitron text-green-300 mb-2">∞</div>
-                    <div class="text-slate-400">Possibilités</div>
                 </div>
             </div>
-        </section>
     </main>
     <!-- Floating Action Panel -->
-    <div class="floating-toolbar flex items-center">
         <div class="w-10 h-10 rounded-full bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center mr-3">
             <i class="fas fa-robot"></i>
         </div>
@@ -567,72 +486,225 @@
             <div class="text-xs text-cyan-300">AGENT ACTIF</div>
             <div class="text-sm font-medium">NEXUS-CORE#978978</div>
         </div>
-        <button class="px-4 py-2 rounded-full bg-gradient-to-r from-cyan-600 to-blue-700 text-white text-sm font-medium">
-            <i class="fas fa-comment-alt mr-1"></i> Communiquer
         </button>
     </div>
-    <!-- Footer -->
-    <footer class="border-t border-slate-800 py-8 relative z-10">
-        <div class="container mx-auto px-4">
-            <div class="flex flex-col md:flex-row justify-between items-center">
-                <div class="flex items-center space-x-3 mb-4 md:mb-0">
-                    <div class="w-10 h-10 rounded-lg bg-gradient-to-br from-indigo-900 to-purple-900 flex items-center justify-center">
-                        <span class="text-xs font-bold">978978</span>
                     </div>
-                    <h1 class="text-xl font-orbitron">
-                        <span class="neon-text">NEXUS</span>-<span class="text-purple-400">978978</span>
-                    </h1>
-                </div>
-                <div class="flex space-x-6">
-                    <a href="#" class="text-slate-400 hover:text-cyan-300 transition">Termes</a>
-                    <a href="#" class="text-slate-400 hover:text-cyan-300 transition">Confidentialité</a>
-                    <a href="#" class="text-slate-400 hover:text-cyan-300 transition">Documentation</a>
-                    <a href="#" class="text-slate-400 hover:text-cyan-300 transition">Contact</a>
                 </div>
             </div>
-            <div class="mt-8 text-center text-slate-500 text-sm">
-                © 2023 NEXUS-978978 Platform. Tous droits réservés.
             </div>
         </div>
-    </footer>
     <script>
-        // Random agent ID generator
-        function random(min, max) {
-            return Math.floor(Math.random() * (max - min + 1)) + min;
-        }
-        // Update all agent IDs on page
-        document.querySelectorAll('.agent-id').forEach(el => {
-            const prefix = el.textContent.split('-')[0];
-            el.textContent = `${prefix}-${random(10000, 99999)}`;
         });
-        // Interactive terminal effect
-        const terminal = document.querySelector('.terminal pre');
-        if (terminal) {
-            let i = 0;
-            const code = terminal.innerHTML;
-            terminal.innerHTML = '';
-            function typeWriter() {
-                if (i < code.length) {
-                    terminal.innerHTML += code.charAt(i);
-                    i++;
-                    terminal.scrollTop = terminal.scrollHeight;
-                    setTimeout(typeWriter, random(0, 10));
                 }
             }
-            setTimeout(typeWriter, 1000);
         }
-        // Floating nodes animation
-        const nodes = document.querySelectorAll('.pulse');
-        nodes.forEach((node, index) => {
-            node.style.animationDelay = `${index * 0.3}s`;
-        });
-    </script>
 <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=docto41/nexusimport" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
 </html>

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>NEXUS-978978 | Plateforme IA Professionnelle</title>
     <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
     <style>
         @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Rajdhani:wght@300;500;700&display=swap');
             color: var(--primary);
         }
         .terminal {
             background: rgba(0, 0, 0, 0.7);
             border: 1px solid rgba(0, 240, 255, 0.3);
             opacity: 0.7;
         }
+        .floating-toolbar {
+            position: fixed;
+            bottom: 30px;
+            right: 30px;
+            background: rgba(10, 10, 26, 0.9);
+            border: 1px solid rgba(0, 240, 255, 0.3);
+            border-radius: 50px;
+            padding: 10px 15px;
+            box-shadow: 0 0 20px rgba(0, 240, 255, 0.2);
+            z-index: 100;
+            backdrop-filter: blur(10px);
+        }
+        .project-item {
+            transition: all 0.3s ease;
+            border-left: 3px solid transparent;
+        }
+        .project-item:hover {
+            border-left: 3px solid var(--primary);
+            background: rgba(0, 240, 255, 0.05);
+        }
+        .loading-dots:after {
+            content: '.';
+            animation: dots 1.5s steps(5, end) infinite;
+        }
+        @keyframes dots {
+            0%, 20% { content: '.'; }
+            40% { content: '..'; }
+            60% { content: '...'; }
+            80%, 100% { content: ''; }
         }
     </style>
 </head>
                 </h1>
             </div>
             <div class="hidden md:flex space-x-6 items-center">
+                <a href="#" class="text-white hover:text-cyan-300 transition font-medium">Dashboard</a>
+                <a href="#" class="text-white hover:text-cyan-300 transition font-medium">Projets</a>
                 <a href="#" class="text-white hover:text-cyan-300 transition font-medium">Agents</a>
                 <a href="#" class="text-white hover:text-cyan-300 transition font-medium">API</a>
                 <div class="w-10 h-10 rounded-full bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center glow-button">
                     <i class="fas fa-user-astronaut"></i>
     </nav>
     <!-- Main Content -->
+    <main class="container mx-auto px-4 py-8 relative z-10">
+        <div class="grid grid-cols-1 lg:grid-cols-4 gap-6">
+            <!-- Sidebar -->
+            <div class="lg:col-span-1">
+                <div class="cyber-card rounded-xl p-6 mb-6">
+                    <h3 class="font-orbitron text-lg mb-4">Nouveau Projet</h3>
+                    <button id="newProjectBtn" class="w-full py-3 rounded-lg glow-button font-medium mb-4">
+                        <i class="fas fa-plus mr-2"></i> Créer
+                    </button>
+                    <div class="space-y-2">
+                        <div class="flex items-center text-slate-400 hover:text-white cursor-pointer">
+                            <i class="fas fa-home mr-3"></i> Accueil
                         </div>
+                        <div class="flex items-center text-slate-400 hover:text-white cursor-pointer">
+                            <i class="fas fa-project-diagram mr-3"></i> Mes Projets
                         </div>
+                        <div class="flex items-center text-slate-400 hover:text-white cursor-pointer">
+                            <i class="fas fa-robot mr-3"></i> Agents IA
                         </div>
+                        <div class="flex items-center text-slate-400 hover:text-white cursor-pointer">
+                            <i class="fas fa-cog mr-3"></i> Paramètres
                         </div>
                     </div>
                 </div>
+                <div class="cyber-card rounded-xl p-6">
+                    <h3 class="font-orbitron text-lg mb-4">Projets Récents</h3>
+                    <div class="space-y-3">
+                        <div class="project-item p-3 rounded-lg cursor-pointer">
+                            <div class="font-medium">Portfolio React</div>
+                            <div class="text-xs text-slate-400">Modifié il y a 2h</div>
                         </div>
+                        <div class="project-item p-3 rounded-lg cursor-pointer">
+                            <div class="font-medium">API Node.js</div>
+                            <div class="text-xs text-slate-400">Modifié hier</div>
                         </div>
+                        <div class="project-item p-3 rounded-lg cursor-pointer">
+                            <div class="font-medium">Script Python</div>
+                            <div class="text-xs text-slate-400">Modifié il y a 3 jours</div>
                         </div>
                     </div>
                 </div>
             </div>
+            <!-- Main Panel -->
+            <div class="lg:col-span-3">
+                <!-- Project Creation Panel (hidden by default) -->
+                <div id="projectCreationPanel" class="cyber-card rounded-xl p-6 mb-6 hidden">
+                    <div class="flex justify-between items-center mb-6">
+                        <h3 class="font-orbitron text-xl">Nouveau Projet</h3>
+                        <button id="closeProjectPanel" class="text-slate-400 hover:text-white">
+                            <i class="fas fa-times"></i>
+                        </button>
                     </div>
+                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
+                        <div>
+                            <label class="block text-sm text-slate-400 mb-2">Type de projet</label>
+                            <select id="projectType" class="w-full bg-slate-800 border border-cyan-500 border-opacity-30 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500">
+                                <option value="website">Site Web</option>
+                                <option value="webapp">Application Web</option>
+                                <option value="api">API</option>
+                                <option value="script">Script</option>
+                                <option value="database">Base de Données</option>
+                            </select>
+                        </div>
+                        <div>
+                            <label class="block text-sm text-slate-400 mb-2">Nom du projet</label>
+                            <input type="text" id="projectName" class="w-full bg-slate-800 border border-cyan-500 border-opacity-30 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500" placeholder="MonProjetInnovant">
+                        </div>
                     </div>
+                    <div class="mb-6">
                         <label class="block text-sm text-slate-400 mb-2">Description</label>
+                        <textarea id="projectDescription" class="w-full bg-slate-800 border border-cyan-500 border-opacity-30 rounded-lg px-4 py-3 text-white focus:outline-none focus:ring-2 focus:ring-cyan-500" rows="3" placeholder="Décrivez votre projet..."></textarea>
                     </div>
                     <div class="mb-6">
                         <label class="block text-sm text-slate-400 mb-2">Technologies</label>
+                        <div id="techTags" class="flex flex-wrap gap-2 mb-2">
+                            <!-- Tags will be added here -->
+                        </div>
+                        <div class="flex">
+                            <input type="text" id="newTech" class="flex-grow bg-slate-800 border border-cyan-500 border-opacity-30 rounded-l-lg px-4 py-2 text-white focus:outline-none" placeholder="Ajouter une technologie">
+                            <button id="addTechBtn" class="px-4 py-2 bg-cyan-600 rounded-r-lg hover:bg-cyan-500">
+                                <i class="fas fa-plus"></i>
                             </button>
                         </div>
                     </div>
+                    <div class="flex justify-end space-x-4">
+                        <button id="cancelProjectBtn" class="px-6 py-2 rounded-lg bg-slate-800 hover:bg-slate-700 border border-cyan-500 border-opacity-30">
+                            Annuler
+                        </button>
+                        <button id="generateProjectBtn" class="px-6 py-2 rounded-lg glow-button">
+                            <i class="fas fa-bolt mr-2"></i> Générer
+                        </button>
+                    </div>
                 </div>
+                <!-- Code Generation Panel -->
+                <div id="codeGenerationPanel" class="cyber-card rounded-xl p-0 overflow-hidden mb-6 hidden">
                     <div class="h-12 bg-slate-800 border-b border-cyan-500 border-opacity-30 flex items-center px-4">
+                        <div class="flex space-x-2 mr-4">
                             <div class="w-3 h-3 rounded-full bg-red-500"></div>
                             <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
                             <div class="w-3 h-3 rounded-full bg-green-500"></div>
                         </div>
+                        <div class="flex-grow text-sm font-mono text-slate-400" id="filenameDisplay">
+                            selectionnez-un-projet.js
+                        </div>
+                        <div class="flex items-center space-x-3">
+                            <button class="text-slate-400 hover:text-cyan-300" title="Copier">
+                                <i class="fas fa-copy"></i>
+                            </button>
+                            <button class="text-slate-400 hover:text-cyan-300" title="Télécharger">
+                                <i class="fas fa-download"></i>
+                            </button>
                         </div>
                     </div>
                     <div class="terminal p-4 h-96 overflow-auto">
+                        <pre id="codeOutput" class="text-sm">// Bienvenue sur NEXUS-978978
+// Sélectionnez un projet ou créez-en un nouveau pour commencer
+// Agents IA disponibles: 978978
+// Temps de réponse moyen: 0.001s
+// Mémoire totale: ∞</pre>
                     </div>
                 </div>
+                <!-- Agent Selection Panel -->
+                <div id="agentSelectionPanel" class="cyber-card rounded-xl p-6">
+                    <h3 class="font-orbitron text-xl mb-6">Sélectionnez vos Agents IA</h3>
+                    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mb-6">
+                        <div class="cyber-card rounded-lg p-4 cursor-pointer agent-card" data-specialty="frontend">
+                            <div class="flex items-center mb-2">
+                                <div class="w-8 h-8 rounded-full bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center mr-3">
+                                    <i class="fas fa-code"></i>
+                                </div>
+                                <div>
+                                    <div class="font-medium">Frontend</div>
+                                    <div class="text-xs text-slate-400">HTML/CSS/JS</div>
+                                </div>
+                            </div>
+                            <div class="text-xs text-slate-300">Crée des interfaces utilisateur réactives et modernes</div>
+                        </div>
+                        <div class="cyber-card rounded-lg p-4 cursor-pointer agent-card" data-specialty="backend">
+                            <div class="flex items-center mb-2">
+                                <div class="w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 to-pink-600 flex items-center justify-center mr-3">
+                                    <i class="fas fa-server"></i>
+                                </div>
+                                <div>
+                                    <div class="font-medium">Backend</div>
+                                    <div class="text-xs text-slate-400">Node.js/Python/Java</div>
+                                </div>
+                            </div>
+                            <div class="text-xs text-slate-300">Développe la logique métier et les API</div>
+                        </div>
+                        <div class="cyber-card rounded-lg p-4 cursor-pointer agent-card" data-specialty="database">
+                            <div class="flex items-center mb-2">
+                                <div class="w-8 h-8 rounded-full bg-gradient-to-br from-green-500 to-teal-600 flex items-center justify-center mr-3">
+                                    <i class="fas fa-database"></i>
+                                </div>
+                                <div>
+                                    <div class="font-medium">Database</div>
+                                    <div class="text-xs text-slate-400">SQL/NoSQL</div>
+                                </div>
+                            </div>
+                            <div class="text-xs text-slate-300">Conçoit et optimise les schémas de données</div>
+                        </div>
+                        <div class="cyber-card rounded-lg p-4 cursor-pointer agent-card" data-specialty="devops">
+                            <div class="flex items-center mb-2">
+                                <div class="w-8 h-8 rounded-full bg-gradient-to-br from-yellow-500 to-amber-600 flex items-center justify-center mr-3">
+                                    <i class="fas fa-cloud"></i>
+                                </div>
+                                <div>
+                                    <div class="font-medium">DevOps</div>
+                                    <div class="text-xs text-slate-400">Docker/K8s/AWS</div>
+                                </div>
+                            </div>
+                            <div class="text-xs text-slate-300">Automatise le déploiement et la mise à l'échelle</div>
+                        </div>
+                        <div class="cyber-card rounded-lg p-4 cursor-pointer agent-card" data-specialty="security">
+                            <div class="flex items-center mb-2">
+                                <div class="w-8 h-8 rounded-full bg-gradient-to-br from-red-500 to-orange-600 flex items-center justify-center mr-3">
+                                    <i class="fas fa-shield-alt"></i>
+                                </div>
+                                <div>
+                                    <div class="font-medium">Sécurité</div>
+                                    <div class="text-xs text-slate-400">OWASP/SSL/Pentest</div>
+                                </div>
+                            </div>
+                            <div class="text-xs text-slate-300">Implémente les meilleures pratiques de sécurité</div>
+                        </div>
+                        <div class="cyber-card rounded-lg p-4 cursor-pointer agent-card" data-specialty="ai">
+                            <div class="flex items-center mb-2">
+                                <div class="w-8 h-8 rounded-full bg-gradient-to-br from-pink-500 to-purple-600 flex items-center justify-center mr-3">
+                                    <i class="fas fa-brain"></i>
+                                </div>
+                                <div>
+                                    <div class="font-medium">IA/ML</div>
+                                    <div class="text-xs text-slate-400">TensorFlow/PyTorch</div>
+                                </div>
+                            </div>
+                            <div class="text-xs text-slate-300">Intègre des modèles d'intelligence artificielle</div>
                         </div>
                     </div>
+                    <div class="flex justify-between items-center">
+                        <div class="text-sm text-slate-400">
+                            <span id="selectedAgentsCount">0</span>/978978 agents sélectionnés
+                        </div>
+                        <button id="generateWithAgentsBtn" class="px-6 py-2 rounded-lg glow-button disabled:opacity-50" disabled>
+                            <i class="fas fa-cogs mr-2"></i> Générer avec Agents
+                        </button>
+                    </div>
                 </div>
             </div>
+        </div>
     </main>
     <!-- Floating Action Panel -->
+    <div class="floating-toolbar">
         <div class="w-10 h-10 rounded-full bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center mr-3">
             <i class="fas fa-robot"></i>
         </div>
             <div class="text-xs text-cyan-300">AGENT ACTIF</div>
             <div class="text-sm font-medium">NEXUS-CORE#978978</div>
         </div>
+        <button id="aiAssistantBtn" class="px-4 py-2 rounded-full bg-gradient-to-r from-cyan-600 to-blue-700 text-white text-sm font-medium">
+            <i class="fas fa-comment-alt mr-1"></i> Assistant
         </button>
     </div>
+    <!-- AI Assistant Modal -->
+    <div id="aiAssistantModal" class="fixed inset-0 bg-black bg-opacity-70 flex items-center justify-center z-50 hidden">
+        <div class="cyber-card rounded-xl w-full max-w-2xl max-h-[80vh] flex flex-col">
+            <div class="p-4 border-b border-cyan-500 border-opacity-30 flex justify-between items-center">
+                <h3 class="font-orbitron">Assistant IA NEXUS-978978</h3>
+                <button id="closeAIModal" class="text-slate-400 hover:text-white">
+                    <i class="fas fa-times"></i>
+                </button>
+            </div>
+            <div class="p-4 overflow-y-auto flex-grow" id="aiChat">
+                <div class="flex mb-4">
+                    <div class="w-8 h-8 rounded-full bg-gradient-to-br from-cyan-500 to-blue-600 flex items-center justify-center mr-3 flex-shrink-0">
+                        <i class="fas fa-robot"></i>
+                    </div>
+                    <div class="bg-slate-800 rounded-lg p-3 text-sm">
+                        Bonjour ! Je suis votre assistant IA NEXUS-978978. Comment puis-je vous aider aujourd'hui ?
                     </div>
                 </div>
             </div>
+            <div class="p-4 border-t border-cyan-500 border-opacity-30">
+                <div class="flex">
+                    <input type="text" id="aiMessageInput" class="flex-grow bg-slate-800 border border-cyan-500 border-opacity-30 rounded-l-lg px-4 py-3 text-white focus:outline-none" placeholder="Posez votre question...">
+                    <button id="sendAIMessage" class="px-4 py-3 bg-cyan-600 rounded-r-lg hover:bg-cyan-500">
+                        <i class="fas fa-paper-plane"></i>
+                    </button>
+                </div>
             </div>
         </div>
+    </div>
     <script>
+        // DOM Elements
+        const newProjectBtn = document.getElementById('newProjectBtn');
+        const projectCreationPanel = document.getElementById('projectCreationPanel');
+        const closeProjectPanel = document.getElementById('closeProjectPanel');
+        const cancelProjectBtn = document.getElementById('cancelProjectBtn');
+        const generateProjectBtn = document.getElementById('generateProjectBtn');
+        const codeGenerationPanel = document.getElementById('codeGenerationPanel');
+        const filenameDisplay = document.getElementById('filenameDisplay');
+        const codeOutput = document.getElementById('codeOutput');
+        const projectType = document.getElementById('projectType');
+        const projectName = document.getElementById('projectName');
+        const projectDescription = document.getElementById('projectDescription');
+        const techTags = document.getElementById('techTags');
+        const newTech = document.getElementById('newTech');
+        const addTechBtn = document.getElementById('addTechBtn');
+        const agentCards = document.querySelectorAll('.agent-card');
+        const generateWithAgentsBtn = document.getElementById('generateWithAgentsBtn');
+        const selectedAgentsCount = document.getElementById('selectedAgentsCount');
+        const aiAssistantBtn = document.getElementById('aiAssistantBtn');
+        const aiAssistantModal = document.getElementById('aiAssistantModal');
+        const closeAIModal = document.getElementById('closeAIModal');
+        const aiChat = document.getElementById('aiChat');
+        const aiMessageInput = document.getElementById('aiMessageInput');
+        const sendAIMessage = document.getElementById('sendAIMessage');
+        // State
+        let selectedAgents = new Set();
+        let selectedTechnologies = new Set(['HTML5', 'CSS3', 'JavaScript']);
+        // Initialize tech tags
+        selectedTechnologies.forEach(tech => {
+            addTechTag(tech);
         });
+        // Event Listeners
+        newProjectBtn.addEventListener('click', () => {
+            projectCreationPanel.classList.remove('hidden');
+            codeGenerationPanel.classList.add('hidden');
+        });
+        closeProjectPanel.addEventListener('click', () => {
+            projectCreationPanel.classList.add('hidden');
+        });
+        cancelProjectBtn.addEventListener('click', () => {
+            projectCreationPanel.classList.add('hidden');
+        });
+        generateProjectBtn.addEventListener('click', generateProject);
+        addTechBtn.addEventListener('click', () => {
+            const tech = newTech.value.trim();
+            if (tech && !selectedTechnologies.has(tech)) {
+                selectedTechnologies.add(tech);
+                addTechTag(tech);
+                newTech.value = '';
+            }
+        });
+        newTech.addEventListener('keypress', (e) => {
+            if (e.key === 'Enter') {
+                addTechBtn.click();
+            }
+        });
+        agentCards.forEach(card => {
+            card.addEventListener('click', () => {
+                const specialty = card.dataset.specialty;
+                if (selectedAgents.has(specialty)) {
+                    selectedAgents.delete(specialty);
+                    card.classList.remove('border-cyan-500', 'border');
+                } else {
+                    selectedAgents.add(specialty);
+                    card.classList.add('border-cyan-500', 'border');
                 }
+                updateSelectedAgentsCount();
+            });
+        });
+        generateWithAgentsBtn.addEventListener('click', generateProject);
+        aiAssistantBtn.addEventListener('click', () => {
+            aiAssistantModal.classList.remove('hidden');
+        });
+        closeAIModal.addEventListener('click', () => {
+            aiAssistantModal.classList.add('hidden');
+        });
+        sendAIMessage.addEventListener('click', sendAIMessageHandler);
+        aiMessageInput.addEventListener('keypress', (e) => {
+            if (e.key === 'Enter') {
+                sendAIMessageHandler();
             }
+        });
+        // Functions
+        function addTechTag(tech) {
+            const tag = document.createElement('span');
+            tag.className = 'text-xs px-2 py-1 rounded-full bg-cyan-900 bg-opacity-30 text-cyan-300 flex items-center';
+            tag.innerHTML = `${tech} <button class="ml-1 text-cyan-500 hover:text-cyan-300"><i class="fas fa-times text-xs"></i></button>`;
+            tag.querySelector('button').addEventListener('click', () => {
+                selectedTechnologies.delete(tech);
+                tag.remove();
+            });
+            techTags.appendChild(tag);
         }
+        function updateSelectedAgentsCount() {
+            const count = selectedAgents.size;
+            selectedAgentsCount.textContent = count;
+            if (count > 0) {
+                generateWithAgentsBtn.disabled = false;
+            } else {
+                generateWithAgentsBtn.disabled = true;
+            }
+        }
+        function generateProject() {
+            const type = projectType.value;
+            const name = projectName.value || 'MonProjet';
+            const description = projectDescription.value || 'Un projet généré par NEXUS-978978';
+            // Show loading state
+            codeOutput.innerHTML = '<span class="text-purple-400">// Initialisation des agents IA</span>\n<span class="text-cyan-400">Chargement</span><span class="loading-dots"></span>';
+            // Show code panel
+            projectCreationPanel.classList.add('hidden');
+            codeGenerationPanel.classList.remove('hidden');
+            // Update filename
+            let extension = '.js';
+            if (type === 'website') extension = '.html';
+            else if (type === 'webapp') extension = '.jsx';
+            else if (type === 'api') extension = '.py';
+            else if (type === 'script') extension = '.sh';
+            else if (type === 'database') extension = '.sql';
+            filenameDisplay.textContent = name.toLowerCase().replace(/\s+/g, '-') + extension;
+            // Simulate AI generation (in a real app, this would be an API call)
+            setTimeout(() => {
+                generateCode(type, name, description);
+            }, 1500);
+        }
+        function generateCode(type, name, description) {
+            let code = '';
+            const date = new Date().toLocaleString();
+            // Generate different code based on project type
+            switch(type) {
+                case 'website':
+                    code = `<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>${name}</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <style>
+        body {
+            font-family: 'Inter', sans-serif;
+            background-color: #0f172a;
+            color: white;
+        }
+    </style>
+</head>
+<body>
+    <div class="min-h-screen flex items-center justify-center">
+        <div class="text-center">
+            <h1 class="text-4xl font-bold mb-4">${name}</h1>
+            <p class="text-xl text-slate-300 mb-8">${description}</p>
+            <button class="px-6 py-3 bg-cyan-600 rounded-lg hover:bg-cyan-500 transition">
+                Commencer
+            </button>
+        </div>
+    </div>
 <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=docto41/nexusimport" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
 </html>

prompts.txt CHANGED Viewed

@@ -9,4 +9,5 @@ générateur des site a partir des url
 généré le site en automatique
 LE BOUTON AJOUTER NE FONCTIONNE PAS ATIVER EN MODE AUTOMATIQUE
 le bouton ajouter ne fonctionne pas
-CREER MOI UNE PLATEFORME DE 978978 AGENT IA CREATEUR DE SITE . DE CODE . DE SCRYPT . EN MODE FUTURISTE

 généré le site en automatique
 LE BOUTON AJOUTER NE FONCTIONNE PAS ATIVER EN MODE AUTOMATIQUE
 le bouton ajouter ne fonctionne pas
+CREER MOI UNE PLATEFORME DE 978978 AGENT IA CREATEUR DE SITE . DE CODE . DE SCRYPT . EN MODE FUTURISTE
+je veux pas des site d'exemple je veux un vrai site