Hugging Face's logo

Spaces:
docto41
/
hyper-dns-pro
Running

App Files Community
docto41 commited on
Commit
eb31ede
·
verified ·
1 Parent(s): 5455daa

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +615 -5
  2. prompts.txt +2 -1
index.html CHANGED
@@ -28,6 +28,26 @@
28
  .progress-bar {
29
  transition: width 0.6s ease;
30
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
31
  </style>
32
  </head>
33
  <body class="font-sans bg-gray-50">
@@ -57,8 +77,330 @@
57
  </div>
58
  </div>
59
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
60
  <!-- Main Interface -->
61
- <div class="min-h-screen">
62
  <!-- Hero Section -->
63
  <header class="hero-gradient text-white">
64
  <div class="container mx-auto px-6 py-24 text-center">
@@ -76,8 +418,8 @@
76
  <button onclick="showDeployModal()" class="bg-white text-blue-600 font-bold py-3 px-8 rounded-full hover:bg-gray-100 transition duration-200">
77
  <i class="fas fa-rocket mr-2"></i> Déployer en 1 clic
78
  </button>
79
- <button onclick="showAdminLogin()" class="bg-transparent border-2 border-white text-white font-bold py-3 px-8 rounded-full hover:bg-white hover:text-blue-600 transition duration-200">
80
- <i class="fas fa-lock mr-2"></i> Accès Admin
81
  </button>
82
  </div>
83
  </div>
@@ -306,6 +648,120 @@
306
  </div>
307
  </section>
308
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
309
  <!-- CTA Section -->
310
  <section class="gradient-bg text-white py-20">
311
  <div class="container mx-auto px-6 text-center">
@@ -489,6 +945,10 @@
489
  "[email protected]": "Admin270574@"
490
  };
491
 
 
 
 
 
492
  // Show admin login
493
  function showAdminLogin() {
494
  document.getElementById('admin-login').classList.remove('hidden');
@@ -499,6 +959,18 @@
499
  document.getElementById('admin-login').classList.add('hidden');
500
  }
501
 
 
 
 
 
 
 
 
 
 
 
 
 
502
  // Handle login form submission
503
  document.getElementById('login-form').addEventListener('submit', function(e) {
504
  e.preventDefault();
@@ -506,9 +978,9 @@
506
  const password = document.getElementById('admin-password').value;
507
 
508
  if (adminCredentials[email] && adminCredentials[email] === password) {
509
- // Successful login - redirect to admin panel (simulated)
510
- alert('Connexion admin réussie! Accès aux fonctions avancées activé.');
511
  hideAdminLogin();
 
512
  } else {
513
  // Show error
514
  document.getElementById('login-error').classList.remove('hidden');
@@ -694,6 +1166,144 @@
694
  document.getElementById('progress-modal').classList.add('hidden');
695
  alert('Votre infrastructure web est maintenant opérationnelle!');
696
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
697
  </script>
698
  <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/hyper-dns-pro" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
699
  </html>
 
28
  .progress-bar {
29
  transition: width 0.6s ease;
30
  }
31
+ .cart-item {
32
+ transition: all 0.3s ease;
33
+ }
34
+ .cart-item:hover {
35
+ background-color: #f8fafc;
36
+ }
37
+ .payment-method {
38
+ border: 2px solid transparent;
39
+ transition: all 0.3s ease;
40
+ }
41
+ .payment-method:hover {
42
+ border-color: #3b82f6;
43
+ }
44
+ .payment-method.selected {
45
+ border-color: #3b82f6;
46
+ background-color: #eff6ff;
47
+ }
48
+ .dashboard-nav {
49
+ box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
50
+ }
51
  </style>
52
  </head>
53
  <body class="font-sans bg-gray-50">
 
77
  </div>
78
  </div>
79
 
80
+ <!-- Dashboard (hidden by default) -->
81
+ <div id="dashboard" class="hidden">
82
+ <!-- Dashboard Header -->
83
+ <header class="bg-white dashboard-nav">
84
+ <div class="container mx-auto px-6 py-4 flex justify-between items-center">
85
+ <div class="flex items-center">
86
+ <i class="fas fa-bolt text-2xl text-blue-500 mr-3"></i>
87
+ <h1 class="text-xl font-bold">HyperDNS Pro</h1>
88
+ </div>
89
+ <div class="flex items-center space-x-4">
90
+ <button id="cart-button" class="relative p-2 text-gray-600 hover:text-blue-500">
91
+ <i class="fas fa-shopping-cart text-xl"></i>
92
+ <span id="cart-count" class="absolute -top-1 -right-1 bg-blue-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center">0</span>
93
+ </button>
94
+ <div class="relative">
95
+ <button id="user-menu-button" class="flex items-center space-x-2 focus:outline-none">
96
+ <img src="https://randomuser.me/api/portraits/men/1.jpg" alt="User" class="w-8 h-8 rounded-full">
97
+ <span class="hidden md:inline">John Doe</span>
98
+ </button>
99
+ <div id="user-menu" class="hidden absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg py-1 z-50">
100
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Profil</a>
101
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Paramètres</a>
102
+ <a href="#" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">Déconnexion</a>
103
+ </div>
104
+ </div>
105
+ </div>
106
+ </div>
107
+ </header>
108
+
109
+ <!-- Dashboard Content -->
110
+ <div class="container mx-auto px-6 py-8">
111
+ <div class="flex flex-col lg:flex-row gap-8">
112
+ <!-- Main Content -->
113
+ <div class="lg:w-3/4">
114
+ <!-- Welcome Banner -->
115
+ <div class="bg-gradient-to-r from-blue-500 to-purple-600 rounded-xl p-6 text-white mb-8">
116
+ <h2 class="text-2xl font-bold mb-2">Bonjour, John Doe</h2>
117
+ <p class="mb-4">Gérez votre infrastructure web automatisée en toute simplicité</p>
118
+ <div class="flex flex-wrap gap-2">
119
+ <span class="bg-white bg-opacity-20 px-3 py-1 rounded-full text-sm">3 domaines actifs</span>
120
+ <span class="bg-white bg-opacity-20 px-3 py-1 rounded-full text-sm">SSL automatique</span>
121
+ <span class="bg-white bg-opacity-20 px-3 py-1 rounded-full text-sm">DNS ultra-rapide</span>
122
+ </div>
123
+ </div>
124
+
125
+ <!-- Quick Actions -->
126
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
127
+ <button onclick="showDeployModal()" class="bg-white border border-gray-200 rounded-xl p-4 text-center hover:bg-gray-50 transition duration-200">
128
+ <i class="fas fa-plus-circle text-3xl text-blue-500 mb-2"></i>
129
+ <h3 class="font-bold">Ajouter un domaine</h3>
130
+ </button>
131
+ <button class="bg-white border border-gray-200 rounded-xl p-4 text-center hover:bg-gray-50 transition duration-200">
132
+ <i class="fas fa-cog text-3xl text-purple-500 mb-2"></i>
133
+ <h3 class="font-bold">Configurer DNS</h3>
134
+ </button>
135
+ <button class="bg-white border border-gray-200 rounded-xl p-4 text-center hover:bg-gray-50 transition duration-200">
136
+ <i class="fas fa-shield-alt text-3xl text-green-500 mb-2"></i>
137
+ <h3 class="font-bold">Renouveler SSL</h3>
138
+ </button>
139
+ </div>
140
+
141
+ <!-- Active Domains -->
142
+ <div class="bg-white rounded-xl shadow-sm p-6 mb-8">
143
+ <div class="flex justify-between items-center mb-6">
144
+ <h2 class="text-xl font-bold">Vos domaines actifs</h2>
145
+ <button class="text-blue-500 hover:text-blue-700">
146
+ <i class="fas fa-sync-alt mr-1"></i> Actualiser
147
+ </button>
148
+ </div>
149
+ <div class="overflow-x-auto">
150
+ <table class="min-w-full divide-y divide-gray-200">
151
+ <thead class="bg-gray-50">
152
+ <tr>
153
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Domaine</th>
154
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Statut</th>
155
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Expiration</th>
156
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
157
+ </tr>
158
+ </thead>
159
+ <tbody class="bg-white divide-y divide-gray-200">
160
+ <tr>
161
+ <td class="px-6 py-4 whitespace-nowrap">
162
+ <div class="flex items-center">
163
+ <i class="fas fa-globe text-blue-500 mr-3"></i>
164
+ <span class="font-medium">example.com</span>
165
+ </div>
166
+ </td>
167
+ <td class="px-6 py-4 whitespace-nowrap">
168
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Actif</span>
169
+ </td>
170
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">15/06/2024</td>
171
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
172
+ <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button>
173
+ <button class="text-green-600 hover:text-green-900 mr-3"><i class="fas fa-edit"></i></button>
174
+ <button class="text-red-600 hover:text-red-900"><i class="fas fa-trash-alt"></i></button>
175
+ </td>
176
+ </tr>
177
+ <tr>
178
+ <td class="px-6 py-4 whitespace-nowrap">
179
+ <div class="flex items-center">
180
+ <i class="fas fa-globe text-blue-500 mr-3"></i>
181
+ <span class="font-medium">mon-site.fr</span>
182
+ </div>
183
+ </td>
184
+ <td class="px-6 py-4 whitespace-nowrap">
185
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Actif</span>
186
+ </td>
187
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">22/09/2023</td>
188
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
189
+ <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button>
190
+ <button class="text-green-600 hover:text-green-900 mr-3"><i class="fas fa-edit"></i></button>
191
+ <button class="text-red-600 hover:text-red-900"><i class="fas fa-trash-alt"></i></button>
192
+ </td>
193
+ </tr>
194
+ <tr>
195
+ <td class="px-6 py-4 whitespace-nowrap">
196
+ <div class="flex items-center">
197
+ <i class="fas fa-globe text-blue-500 mr-3"></i>
198
+ <span class="font-medium">test.io</span>
199
+ </div>
200
+ </td>
201
+ <td class="px-6 py-4 whitespace-nowrap">
202
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-100 text-yellow-800">En attente</span>
203
+ </td>
204
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">30/11/2023</td>
205
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">
206
+ <button class="text-blue-600 hover:text-blue-900 mr-3"><i class="fas fa-eye"></i></button>
207
+ <button class="text-green-600 hover:text-green-900 mr-3"><i class="fas fa-edit"></i></button>
208
+ <button class="text-red-600 hover:text-red-900"><i class="fas fa-trash-alt"></i></button>
209
+ </td>
210
+ </tr>
211
+ </tbody>
212
+ </table>
213
+ </div>
214
+ </div>
215
+
216
+ <!-- Payment History -->
217
+ <div class="bg-white rounded-xl shadow-sm p-6">
218
+ <h2 class="text-xl font-bold mb-6">Historique des paiements</h2>
219
+ <div class="overflow-x-auto">
220
+ <table class="min-w-full divide-y divide-gray-200">
221
+ <thead class="bg-gray-50">
222
+ <tr>
223
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Date</th>
224
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Description</th>
225
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Méthode</th>
226
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Montant</th>
227
+ <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Statut</th>
228
+ </tr>
229
+ </thead>
230
+ <tbody class="bg-white divide-y divide-gray-200">
231
+ <tr>
232
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">15/06/2023</td>
233
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">Renouvellement domaine example.com</td>
234
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
235
+ <i class="fab fa-cc-paypal text-blue-500 mr-1"></i> PayPal
236
+ </td>
237
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">$14.99</td>
238
+ <td class="px-6 py-4 whitespace-nowrap">
239
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Complété</span>
240
+ </td>
241
+ </tr>
242
+ <tr>
243
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">10/05/2023</td>
244
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">Enregistrement mon-site.fr</td>
245
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
246
+ <i class="fab fa-cc-stripe text-purple-500 mr-1"></i> Stripe
247
+ </td>
248
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">$9.99</td>
249
+ <td class="px-6 py-4 whitespace-nowrap">
250
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Complété</span>
251
+ </td>
252
+ </tr>
253
+ <tr>
254
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">22/04/2023</td>
255
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium">Pack Premium SSL</td>
256
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
257
+ <i class="fab fa-cc-paypal text-blue-500 mr-1"></i> PayPal
258
+ </td>
259
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">$29.99</td>
260
+ <td class="px-6 py-4 whitespace-nowrap">
261
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Complété</span>
262
+ </td>
263
+ </tr>
264
+ </tbody>
265
+ </table>
266
+ </div>
267
+ </div>
268
+ </div>
269
+
270
+ <!-- Sidebar -->
271
+ <div class="lg:w-1/4">
272
+ <!-- Payment Methods -->
273
+ <div class="bg-white rounded-xl shadow-sm p-6 mb-8">
274
+ <h2 class="text-xl font-bold mb-4">Méthodes de paiement</h2>
275
+
276
+ <div class="space-y-3 mb-6">
277
+ <div class="payment-method bg-white border border-gray-200 rounded-lg p-4 cursor-pointer selected">
278
+ <div class="flex items-center">
279
+ <div class="mr-3">
280
+ <i class="fab fa-cc-stripe text-3xl text-purple-500"></i>
281
+ </div>
282
+ <div>
283
+ <h3 class="font-medium">Stripe</h3>
284
+ <p class="text-sm text-gray-500">Carte se terminant par 4242</p>
285
+ </div>
286
+ </div>
287
+ </div>
288
+ <div class="payment-method bg-white border border-gray-200 rounded-lg p-4 cursor-pointer">
289
+ <div class="flex items-center">
290
+ <div class="mr-3">
291
+ <i class="fab fa-cc-paypal text-3xl text-blue-500"></i>
292
+ </div>
293
+ <div>
294
+ <h3 class="font-medium">PayPal</h3>
295
+ <p class="text-sm text-gray-500">[email protected]</p>
296
+ </div>
297
+ </div>
298
+ </div>
299
+ </div>
300
+
301
+ <button class="w-full bg-gray-100 text-gray-700 py-2 px-4 rounded-lg hover:bg-gray-200 transition duration-200">
302
+ <i class="fas fa-plus mr-2"></i> Ajouter une méthode
303
+ </button>
304
+ </div>
305
+
306
+ <!-- Quick Stats -->
307
+ <div class="bg-white rounded-xl shadow-sm p-6 mb-8">
308
+ <h2 class="text-xl font-bold mb-4">Statistiques rapides</h2>
309
+ <div class="space-y-4">
310
+ <div>
311
+ <p class="text-sm text-gray-500">Prochain paiement</p>
312
+ <p class="font-medium">$14.99 - 15/09/2023</p>
313
+ </div>
314
+ <div>
315
+ <p class="text-sm text-gray-500">Solde actuel</p>
316
+ <p class="font-medium text-green-500">$45.67</p>
317
+ </div>
318
+ <div>
319
+ <p class="text-sm text-gray-500">Dépenses ce mois-ci</p>
320
+ <p class="font-medium">$24.98</p>
321
+ </div>
322
+ </div>
323
+ </div>
324
+
325
+ <!-- Support -->
326
+ <div class="bg-gradient-to-r from-blue-500 to-purple-600 rounded-xl p-6 text-white">
327
+ <h2 class="text-xl font-bold mb-2">Besoin d'aide?</h2>
328
+ <p class="mb-4">Notre équipe est disponible 24/7 pour répondre à vos questions</p>
329
+ <button class="w-full bg-white text-blue-600 py-2 px-4 rounded-lg hover:bg-gray-100 transition duration-200">
330
+ <i class="fas fa-headset mr-2"></i> Contacter le support
331
+ </button>
332
+ </div>
333
+ </div>
334
+ </div>
335
+ </div>
336
+ </div>
337
+
338
+ <!-- Shopping Cart Sidebar -->
339
+ <div id="cart-sidebar" class="fixed inset-y-0 right-0 w-full md:w-96 bg-white shadow-xl transform translate-x-full transition-transform duration-300 ease-in-out z-50">
340
+ <div class="flex flex-col h-full">
341
+ <!-- Cart Header -->
342
+ <div class="flex justify-between items-center border-b p-4">
343
+ <h3 class="text-lg font-bold">
344
+ <i class="fas fa-shopping-cart mr-2"></i> Votre panier
345
+ </h3>
346
+ <button id="close-cart" class="text-gray-500 hover:text-gray-700">
347
+ <i class="fas fa-times"></i>
348
+ </button>
349
+ </div>
350
+
351
+ <!-- Cart Items -->
352
+ <div class="flex-1 overflow-y-auto p-4">
353
+ <div id="cart-items" class="space-y-4">
354
+ <!-- Empty Cart Message -->
355
+ <div id="empty-cart-message" class="text-center py-10">
356
+ <i class="fas fa-shopping-cart text-4xl text-gray-300 mb-4"></i>
357
+ <p class="text-gray-500">Votre panier est vide</p>
358
+ </div>
359
+
360
+ <!-- Cart Item Template (hidden) -->
361
+ <div id="cart-item-template" class="cart-item hidden bg-gray-50 rounded-lg p-4">
362
+ <div class="flex justify-between">
363
+ <div class="flex-1">
364
+ <h4 class="font-medium">Enregistrement de domaine</h4>
365
+ <p class="text-sm text-gray-500">example.com</p>
366
+ </div>
367
+ <div class="text-right">
368
+ <p class="font-medium">$9.99</p>
369
+ <button class="remove-item text-xs text-red-500 hover:text-red-700">
370
+ <i class="fas fa-trash-alt mr-1"></i> Supprimer
371
+ </button>
372
+ </div>
373
+ </div>
374
+ </div>
375
+ </div>
376
+ </div>
377
+
378
+ <!-- Cart Footer -->
379
+ <div class="border-t p-4">
380
+ <div class="flex justify-between mb-4">
381
+ <span>Total:</span>
382
+ <span id="cart-total" class="font-bold">$0.00</span>
383
+ </div>
384
+
385
+ <!-- Payment Buttons -->
386
+ <div class="space-y-3">
387
+ <button id="pay-with-stripe" class="w-full bg-purple-600 text-white py-2 px-4 rounded-lg hover:bg-purple-700 transition duration-200 flex items-center justify-center">
388
+ <i class="fab fa-cc-stripe text-xl mr-2"></i> Payer avec Stripe
389
+ </button>
390
+ <button id="pay-with-paypal" class="w-full bg-blue-500 text-white py-2 px-4 rounded-lg hover:bg-blue-600 transition duration-200 flex items-center justify-center">
391
+ <i class="fab fa-cc-paypal text-xl mr-2"></i> Payer avec PayPal
392
+ </button>
393
+ </div>
394
+
395
+ <p class="text-xs text-gray-500 mt-3 text-center">
396
+ <i class="fas fa-lock mr-1"></i> Paiement sécurisé SSL 256-bit
397
+ </p>
398
+ </div>
399
+ </div>
400
+ </div>
401
+
402
  <!-- Main Interface -->
403
+ <div id="main-interface" class="min-h-screen">
404
  <!-- Hero Section -->
405
  <header class="hero-gradient text-white">
406
  <div class="container mx-auto px-6 py-24 text-center">
 
418
  <button onclick="showDeployModal()" class="bg-white text-blue-600 font-bold py-3 px-8 rounded-full hover:bg-gray-100 transition duration-200">
419
  <i class="fas fa-rocket mr-2"></i> Déployer en 1 clic
420
  </button>
421
+ <button onclick="showDashboard()" class="bg-transparent border-2 border-white text-white font-bold py-3 px-8 rounded-full hover:bg-white hover:text-blue-600 transition duration-200">
422
+ <i class="fas fa-tachometer-alt mr-2"></i> Tableau de bord
423
  </button>
424
  </div>
425
  </div>
 
648
  </div>
649
  </section>
650
 
651
+ <!-- Pricing Section -->
652
+ <section class="py-20 bg-gray-100">
653
+ <div class="container mx-auto px-6">
654
+ <h2 class="text-3xl font-bold text-center mb-6">Nos Tarifs Transparents</h2>
655
+ <p class="text-xl text-center text-gray-600 max-w-3xl mx-auto mb-16">
656
+ Des prix simples sans frais cachés, avec une facturation claire
657
+ </p>
658
+
659
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
660
+ <!-- Basic Plan -->
661
+ <div class="bg-white rounded-xl shadow-md overflow-hidden">
662
+ <div class="px-6 py-4 bg-gray-50">
663
+ <h3 class="text-xl font-bold text-center">Basique</h3>
664
+ <div class="text-center my-4">
665
+ <span class="text-4xl font-bold">$9.99</span>
666
+ <span class="text-gray-500">/mois</span>
667
+ </div>
668
+ </div>
669
+ <div class="px-6 py-4">
670
+ <ul class="space-y-3 mb-6">
671
+ <li class="flex items-center">
672
+ <i class="fas fa-check text-green-500 mr-2"></i>
673
+ <span>1 domaine inclus</span>
674
+ </li>
675
+ <li class="flex items-center">
676
+ <i class="fas fa-check text-green-500 mr-2"></i>
677
+ <span>SSL Let's Encrypt</span>
678
+ </li>
679
+ <li class="flex items-center">
680
+ <i class="fas fa-check text-green-500 mr-2"></i>
681
+ <span>DNS Basic</span>
682
+ </li>
683
+ <li class="flex items-center text-gray-400">
684
+ <i class="fas fa-times text-red-400 mr-2"></i>
685
+ <span>Intégration Google</span>
686
+ </li>
687
+ </ul>
688
+ <button onclick="addToCart('Basique', 9.99)" class="w-full bg-blue-500 text-white py-2 px-4 rounded-lg hover:bg-blue-600 transition duration-200">
689
+ <i class="fas fa-cart-plus mr-2"></i> Ajouter au panier
690
+ </button>
691
+ </div>
692
+ </div>
693
+
694
+ <!-- Pro Plan -->
695
+ <div class="bg-white rounded-xl shadow-lg overflow-hidden transform scale-105">
696
+ <div class="px-6 py-4 bg-blue-500 text-white">
697
+ <h3 class="text-xl font-bold text-center">Professionnel</h3>
698
+ <div class="text-center my-4">
699
+ <span class="text-4xl font-bold">$19.99</span>
700
+ <span class="text-blue-100">/mois</span>
701
+ </div>
702
+ </div>
703
+ <div class="px-6 py-4">
704
+ <ul class="space-y-3 mb-6">
705
+ <li class="flex items-center">
706
+ <i class="fas fa-check text-green-500 mr-2"></i>
707
+ <span>3 domaines inclus</span>
708
+ </li>
709
+ <li class="flex items-center">
710
+ <i class="fas fa-check text-green-500 mr-2"></i>
711
+ <span>SSL Premium</span>
712
+ </li>
713
+ <li class="flex items-center">
714
+ <i class="fas fa-check text-green-500 mr-2"></i>
715
+ <span>DNS Ultra-Rapide</span>
716
+ </li>
717
+ <li class="flex items-center">
718
+ <i class="fas fa-check text-green-500 mr-2"></i>
719
+ <span>Intégration Google</span>
720
+ </li>
721
+ </ul>
722
+ <button onclick="addToCart('Professionnel', 19.99)" class="w-full bg-blue-600 text-white py-2 px-4 rounded-lg hover:bg-blue-700 transition duration-200">
723
+ <i class="fas fa-cart-plus mr-2"></i> Ajouter au panier
724
+ </button>
725
+ </div>
726
+ </div>
727
+
728
+ <!-- Enterprise Plan -->
729
+ <div class="bg-white rounded-xl shadow-md overflow-hidden">
730
+ <div class="px-6 py-4 bg-gray-50">
731
+ <h3 class="text-xl font-bold text-center">Entreprise</h3>
732
+ <div class="text-center my-4">
733
+ <span class="text-4xl font-bold">$49.99</span>
734
+ <span class="text-gray-500">/mois</span>
735
+ </div>
736
+ </div>
737
+ <div class="px-6 py-4">
738
+ <ul class="space-y-3 mb-6">
739
+ <li class="flex items-center">
740
+ <i class="fas fa-check text-green-500 mr-2"></i>
741
+ <span>Domaines illimités</span>
742
+ </li>
743
+ <li class="flex items-center">
744
+ <i class="fas fa-check text-green-500 mr-2"></i>
745
+ <span>SSL EV (Extended Validation)</span>
746
+ </li>
747
+ <li class="flex items-center">
748
+ <i class="fas fa-check text-green-500 mr-2"></i>
749
+ <span>DNS Premium + Anycast</span>
750
+ </li>
751
+ <li class="flex items-center">
752
+ <i class="fas fa-check text-green-500 mr-2"></i>
753
+ <span>Intégration Google avancée</span>
754
+ </li>
755
+ </ul>
756
+ <button onclick="addToCart('Entreprise', 49.99)" class="w-full bg-blue-500 text-white py-2 px-4 rounded-lg hover:bg-blue-600 transition duration-200">
757
+ <i class="fas fa-cart-plus mr-2"></i> Ajouter au panier
758
+ </button>
759
+ </div>
760
+ </div>
761
+ </div>
762
+ </div>
763
+ </section>
764
+
765
  <!-- CTA Section -->
766
  <section class="gradient-bg text-white py-20">
767
  <div class="container mx-auto px-6 text-center">
 
945
  "[email protected]": "Admin270574@"
946
  };
947
 
948
+ // Shopping cart
949
+ let cart = [];
950
+ let cartTotal = 0;
951
+
952
  // Show admin login
953
  function showAdminLogin() {
954
  document.getElementById('admin-login').classList.remove('hidden');
 
959
  document.getElementById('admin-login').classList.add('hidden');
960
  }
961
 
962
+ // Show dashboard
963
+ function showDashboard() {
964
+ document.getElementById('main-interface').classList.add('hidden');
965
+ document.getElementById('dashboard').classList.remove('hidden');
966
+ }
967
+
968
+ // Show main interface
969
+ function showMainInterface() {
970
+ document.getElementById('dashboard').classList.add('hidden');
971
+ document.getElementById('main-interface').classList.remove('hidden');
972
+ }
973
+
974
  // Handle login form submission
975
  document.getElementById('login-form').addEventListener('submit', function(e) {
976
  e.preventDefault();
 
978
  const password = document.getElementById('admin-password').value;
979
 
980
  if (adminCredentials[email] && adminCredentials[email] === password) {
981
+ // Successful login - show dashboard
 
982
  hideAdminLogin();
983
+ showDashboard();
984
  } else {
985
  // Show error
986
  document.getElementById('login-error').classList.remove('hidden');
 
1166
  document.getElementById('progress-modal').classList.add('hidden');
1167
  alert('Votre infrastructure web est maintenant opérationnelle!');
1168
  }
1169
+
1170
+ // Add item to cart
1171
+ function addToCart(name, price) {
1172
+ // Check if item already in cart
1173
+ const existingItem = cart.find(item => item.name === name);
1174
+
1175
+ if (existingItem) {
1176
+ existingItem.quantity += 1;
1177
+ } else {
1178
+ cart.push({
1179
+ name: name,
1180
+ price: price,
1181
+ quantity: 1
1182
+ });
1183
+ }
1184
+
1185
+ updateCart();
1186
+ openCart();
1187
+ }
1188
+
1189
+ // Remove item from cart
1190
+ function removeFromCart(index) {
1191
+ cart.splice(index, 1);
1192
+ updateCart();
1193
+ }
1194
+
1195
+ // Update cart UI
1196
+ function updateCart() {
1197
+ const cartItemsContainer = document.getElementById('cart-items');
1198
+ const emptyCartMessage = document.getElementById('empty-cart-message');
1199
+ const cartCount = document.getElementById('cart-count');
1200
+ const cartTotalElement = document.getElementById('cart-total');
1201
+
1202
+ // Clear existing items
1203
+ cartItemsContainer.innerHTML = '';
1204
+
1205
+ if (cart.length === 0) {
1206
+ emptyCartMessage.classList.remove('hidden');
1207
+ cartCount.textContent = '0';
1208
+ cartTotalElement.textContent = '$0.00';
1209
+ return;
1210
+ }
1211
+
1212
+ emptyCartMessage.classList.add('hidden');
1213
+
1214
+ // Calculate total
1215
+ let total = 0;
1216
+ let itemCount = 0;
1217
+
1218
+ // Add items to cart
1219
+ cart.forEach((item, index) => {
1220
+ const itemTemplate = document.getElementById('cart-item-template').cloneNode(true);
1221
+ itemTemplate.classList.remove('hidden');
1222
+
1223
+ itemTemplate.querySelector('h4').textContent = item.name;
1224
+ itemTemplate.querySelector('p').textContent = `Quantité: ${item.quantity}`;
1225
+ itemTemplate.querySelector('.font-medium').textContent = `$${(item.price * item.quantity).toFixed(2)}`;
1226
+
1227
+ itemTemplate.querySelector('.remove-item').addEventListener('click', () => {
1228
+ removeFromCart(index);
1229
+ });
1230
+
1231
+ cartItemsContainer.appendChild(itemTemplate);
1232
+
1233
+ total += item.price * item.quantity;
1234
+ itemCount += item.quantity;
1235
+ });
1236
+
1237
+ // Update totals
1238
+ cartCount.textContent = itemCount;
1239
+ cartTotalElement.textContent = `$${total.toFixed(2)}`;
1240
+ }
1241
+
1242
+ // Open cart sidebar
1243
+ function openCart() {
1244
+ document.getElementById('cart-sidebar').classList.remove('translate-x-full');
1245
+ }
1246
+
1247
+ // Close cart sidebar
1248
+ function closeCart() {
1249
+ document.getElementById('cart-sidebar').classList.add('translate-x-full');
1250
+ }
1251
+
1252
+ // Initialize event listeners
1253
+ document.addEventListener('DOMContentLoaded', function() {
1254
+ // User menu toggle
1255
+ document.getElementById('user-menu-button').addEventListener('click', function() {
1256
+ document.getElementById('user-menu').classList.toggle('hidden');
1257
+ });
1258
+
1259
+ // Close user menu when clicking outside
1260
+ document.addEventListener('click', function(event) {
1261
+ if (!event.target.closest('#user-menu-button')) {
1262
+ document.getElementById('user-menu').classList.add('hidden');
1263
+ }
1264
+ });
1265
+
1266
+ // Cart button
1267
+ document.getElementById('cart-button').addEventListener('click', openCart);
1268
+
1269
+ // Close cart button
1270
+ document.getElementById('close-cart').addEventListener('click', closeCart);
1271
+
1272
+ // Payment method selection
1273
+ document.querySelectorAll('.payment-method').forEach(method => {
1274
+ method.addEventListener('click', function() {
1275
+ document.querySelectorAll('.payment-method').forEach(m => {
1276
+ m.classList.remove('selected');
1277
+ });
1278
+ this.classList.add('selected');
1279
+ });
1280
+ });
1281
+
1282
+ // Pay with Stripe
1283
+ document.getElementById('pay-with-stripe').addEventListener('click', function() {
1284
+ if (cart.length === 0) {
1285
+ alert('Votre panier est vide');
1286
+ return;
1287
+ }
1288
+
1289
+ alert('Redirection vers Stripe pour le paiement');
1290
+ // In a real app, you would redirect to Stripe checkout
1291
+ });
1292
+
1293
+ // Pay with PayPal
1294
+ document.getElementById('pay-with-paypal').addEventListener('click', function() {
1295
+ if (cart.length === 0) {
1296
+ alert('Votre panier est vide');
1297
+ return;
1298
+ }
1299
+
1300
+ alert('Redirection vers PayPal pour le paiement');
1301
+ // In a real app, you would redirect to PayPal checkout
1302
+ });
1303
+
1304
+ // Initialize empty cart
1305
+ updateCart();
1306
+ });
1307
  </script>
1308
  <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/hyper-dns-pro" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
1309
  </html>
prompts.txt CHANGED
@@ -14,4 +14,5 @@ ouvrer toutes les bouton dans une nouvel page
14
  active toutes bouton , recongigue
15
  activer les bouton
16
  probleme des boutons non cliquable veuillez corriger toutes les erreur des boutons qui ne foctionne pas activer toutes les boutons non fonctionnel , réparer toute et refaire une mise a jours pour toute corriger les problelme de fonctionnement :ajouter bouton paypal , stripe , avec mes information pour etre payer , ajouter panier d'achat , obligatio de sabonner pour utiliser le site gratuitement : je veux acces gratuite pour moi seulement administrateur : [email protected] : Admin270574@ et [email protected] : Admin270574@
17
- Infrastructure Web Automatisée en 1 Click Enregistrement instantané de domaine, déploiement SSL, DNS ultra-rapide et intégration Google - le tout automatisé 24h/24 et 7j/7 avec propagation mondiale en secondes.
 
 
14
  active toutes bouton , recongigue
15
  activer les bouton
16
  probleme des boutons non cliquable veuillez corriger toutes les erreur des boutons qui ne foctionne pas activer toutes les boutons non fonctionnel , réparer toute et refaire une mise a jours pour toute corriger les problelme de fonctionnement :ajouter bouton paypal , stripe , avec mes information pour etre payer , ajouter panier d'achat , obligatio de sabonner pour utiliser le site gratuitement : je veux acces gratuite pour moi seulement administrateur : [email protected] : Admin270574@ et [email protected] : Admin270574@
17
+ Infrastructure Web Automatisée en 1 Click Enregistrement instantané de domaine, déploiement SSL, DNS ultra-rapide et intégration Google - le tout automatisé 24h/24 et 7j/7 avec propagation mondiale en secondes.
18
+ ajouter tableau de bord avec les information de paiement paypal, stripe, avec bouton stripe ,bouton paypal etc.. plus panier d'achat