Hugging Face's logo

Spaces:
docto41
/
ia-boot
Running

App Files Community
docto41 commited on
Commit
626ab27
·
verified ·
1 Parent(s): a51ad83

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +986 -19
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Ia Boot
3
- emoji: 🌍
4
- colorFrom: red
5
- colorTo: pink
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: ia-boot
3
+ emoji: 🐳
4
+ colorFrom: purple
5
+ colorTo: yellow
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,986 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="fr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>AI Marketplace - Boutique d'Assistance IA</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
9
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
10
+ <style>
11
+ @keyframes float {
12
+ 0% { transform: translateY(0px); }
13
+ 50% { transform: translateY(-20px); }
14
+ 100% { transform: translateY(0px); }
15
+ }
16
+ .floating {
17
+ animation: float 6s ease-in-out infinite;
18
+ }
19
+ .gradient-bg {
20
+ background: linear-gradient(135deg, #6e8efb, #a777e3);
21
+ }
22
+ .card-hover:hover {
23
+ transform: translateY(-10px);
24
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
25
+ }
26
+ .transition-all {
27
+ transition: all 0.3s ease;
28
+ }
29
+ .blur-effect {
30
+ backdrop-filter: blur(10px);
31
+ background-color: rgba(255, 255, 255, 0.1);
32
+ }
33
+ .admin-badge {
34
+ position: absolute;
35
+ top: -10px;
36
+ right: -10px;
37
+ background-color: #f59e0b;
38
+ color: white;
39
+ border-radius: 9999px;
40
+ width: 24px;
41
+ height: 24px;
42
+ display: flex;
43
+ align-items: center;
44
+ justify-content: center;
45
+ font-size: 12px;
46
+ }
47
+ </style>
48
+ </head>
49
+ <body class="gradient-bg min-h-screen text-white">
50
+ <!-- Navigation -->
51
+ <nav class="blur-effect fixed w-full z-50">
52
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
53
+ <div class="flex items-center justify-between h-16">
54
+ <div class="flex items-center">
55
+ <div class="flex-shrink-0">
56
+ <span class="text-xl font-bold">AI Marketplace</span>
57
+ </div>
58
+ <div class="hidden md:block">
59
+ <div class="ml-10 flex items-baseline space-x-4">
60
+ <a href="#services" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-white hover:bg-opacity-20">Services</a>
61
+ <a href="#dashboard" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-white hover:bg-opacity-20">Tableau de bord</a>
62
+ <a href="#cart" class="px-3 py-2 rounded-md text-sm font-medium hover:bg-white hover:bg-opacity-20">Panier</a>
63
+ </div>
64
+ </div>
65
+ </div>
66
+ <div class="hidden md:block">
67
+ <div class="ml-4 flex items-center md:ml-6">
68
+ <button id="user-menu" class="p-1 rounded-full text-white hover:text-white focus:outline-none">
69
+ <span class="sr-only">Open user menu</span>
70
+ <i class="fas fa-user-circle text-2xl"></i>
71
+ <span id="user-status" class="ml-2 text-sm hidden md:inline">Non connecté</span>
72
+ </button>
73
+ </div>
74
+ </div>
75
+ <div class="-mr-2 flex md:hidden">
76
+ <button type="button" id="mobile-menu-button" class="inline-flex items-center justify-center p-2 rounded-md text-white hover:text-white focus:outline-none">
77
+ <span class="sr-only">Open main menu</span>
78
+ <i class="fas fa-bars"></i>
79
+ </button>
80
+ </div>
81
+ </div>
82
+ </div>
83
+
84
+ <!-- Mobile menu -->
85
+ <div id="mobile-menu" class="hidden md:hidden">
86
+ <div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
87
+ <a href="#services" class="block px-3 py-2 rounded-md text-base font-medium hover:bg-white hover:bg-opacity-20">Services</a>
88
+ <a href="#dashboard" class="block px-3 py-2 rounded-md text-base font-medium hover:bg-white hover:bg-opacity-20">Tableau de bord</a>
89
+ <a href="#cart" class="block px-3 py-2 rounded-md text-base font-medium hover:bg-white hover:bg-opacity-20">Panier</a>
90
+ </div>
91
+ <div class="pt-4 pb-3 border-t border-white border-opacity-20">
92
+ <div class="flex items-center px-5">
93
+ <div class="flex-shrink-0">
94
+ <i class="fas fa-user-circle text-2xl"></i>
95
+ </div>
96
+ <div class="ml-3">
97
+ <div id="mobile-user-status" class="text-base font-medium">Non connecté</div>
98
+ </div>
99
+ </div>
100
+ <div class="mt-3 px-2 space-y-1">
101
+ <a href="#" id="mobile-login-btn" class="block px-3 py-2 rounded-md text-base font-medium hover:bg-white hover:bg-opacity-20">Connexion</a>
102
+ <a href="#" id="mobile-logout-btn" class="hidden block px-3 py-2 rounded-md text-base font-medium hover:bg-white hover:bg-opacity-20">Déconnexion</a>
103
+ </div>
104
+ </div>
105
+ </div>
106
+ </nav>
107
+
108
+ <!-- Login Modal -->
109
+ <div id="login-modal" class="fixed inset-0 z-50 hidden overflow-y-auto">
110
+ <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
111
+ <div class="fixed inset-0 transition-opacity" aria-hidden="true">
112
+ <div class="absolute inset-0 bg-gray-900 opacity-75"></div>
113
+ </div>
114
+ <span class="hidden sm:inline-block sm:align-middle sm:h-screen" aria-hidden="true">&#8203;</span>
115
+ <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
116
+ <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
117
+ <div class="sm:flex sm:items-start">
118
+ <div class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-indigo-100 sm:mx-0 sm:h-10 sm:w-10">
119
+ <i class="fas fa-sign-in-alt text-indigo-600"></i>
120
+ </div>
121
+ <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
122
+ <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">
123
+ Connexion à votre compte
124
+ </h3>
125
+ <div class="mt-2">
126
+ <p class="text-sm text-gray-500">
127
+ Connectez-vous pour accéder à tous les services.
128
+ </p>
129
+ <form class="mt-4 space-y-4">
130
+ <div>
131
+ <label for="login-email" class="block text-sm font-medium text-gray-700">Email</label>
132
+ <input type="email" id="login-email" name="email" class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md p-2 border">
133
+ </div>
134
+ <div>
135
+ <label for="login-password" class="block text-sm font-medium text-gray-700">Mot de passe</label>
136
+ <input type="password" id="login-password" name="password" class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm sm:text-sm border-gray-300 rounded-md p-2 border">
137
+ </div>
138
+ <div class="flex items-center">
139
+ <input id="remember-me" name="remember-me" type="checkbox" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500 border-gray-300 rounded">
140
+ <label for="remember-me" class="ml-2 block text-sm text-gray-700">
141
+ Se souvenir de moi
142
+ </label>
143
+ </div>
144
+ </form>
145
+ </div>
146
+ </div>
147
+ </div>
148
+ </div>
149
+ <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
150
+ <button type="button" id="confirm-login" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-indigo-600 text-base font-medium text-white hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:ml-3 sm:w-auto sm:text-sm">
151
+ Se connecter
152
+ </button>
153
+ <button type="button" id="cancel-login" class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
154
+ Annuler
155
+ </button>
156
+ </div>
157
+ </div>
158
+ </div>
159
+ </div>
160
+
161
+ <!-- Subscription Modal -->
162
+ <div id="subscribe-modal" class="fixed inset-0 z-50 hidden overflow-y-auto">
163
+ <div class="flex items-center justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
164
+ <div class="fixed inset-0 transition-opacity" aria-hidden="true">
165
+ <div class="absolute inset-0 bg-gray-500 opacity-75"></div>
166
+ </div>
167
+ <span class="hidden sm:inline-block sm:align-middle sm:h-screen" aria-hidden="true">&#8203;</span>
168
+ <div class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full">
169
+ <div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
170
+ <div class="sm:flex sm:items-start">
171
+ <div class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-indigo-100 sm:mx-0 sm:h-10 sm:w-10">
172
+ <i class="fas fa-user-plus text-indigo-600"></i>
173
+ </div>
174
+ <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
175
+ <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">
176
+ Abonnement Premium
177
+ </h3>
178
+ <div class="mt-2">
179
+ <p class="text-sm text-gray-500">
180
+ Vous devez souscrire à un abonnement pour accéder à nos services IA.
181
+ </p>
182
+ <div class="mt-4 grid grid-cols-1 gap-4">
183
+ <div class="border rounded-lg p-4 hover:border-indigo-500 transition-all">
184
+ <div class="flex items-center">
185
+ <input id="monthly-plan" name="subscription-plan" type="radio" checked class="h-4 w-4 text-indigo-600 focus:ring-indigo-500 border-gray-300">
186
+ <label for="monthly-plan" class="ml-3 block">
187
+ <span class="font-medium">Abonnement Mensuel</span>
188
+ <span class="block text-sm text-gray-500">19.99€/mois - Accès illimité</span>
189
+ </label>
190
+ </div>
191
+ </div>
192
+ <div class="border rounded-lg p-4 hover:border-indigo-500 transition-all">
193
+ <div class="flex items-center">
194
+ <input id="yearly-plan" name="subscription-plan" type="radio" class="h-4 w-4 text-indigo-600 focus:ring-indigo-500 border-gray-300">
195
+ <label for="yearly-plan" class="ml-3 block">
196
+ <span class="font-medium">Abonnement Annuel</span>
197
+ <span class="block text-sm text-gray-500">199.99€/an (16.66€/mois) - Économisez 20%</span>
198
+ </label>
199
+ </div>
200
+ </div>
201
+ </div>
202
+ </div>
203
+ </div>
204
+ </div>
205
+ </div>
206
+ <div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
207
+ <button type="button" id="confirm-subscribe" class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-indigo-600 text-base font-medium text-white hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:ml-3 sm:w-auto sm:text-sm">
208
+ S'abonner
209
+ </button>
210
+ <button type="button" id="cancel-subscribe" class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
211
+ Annuler
212
+ </button>
213
+ </div>
214
+ </div>
215
+ </div>
216
+ </div>
217
+
218
+ <!-- Hero Section -->
219
+ <div class="relative pt-32 pb-20 px-4 sm:px-6 lg:px-8">
220
+ <div class="max-w-7xl mx-auto">
221
+ <div class="text-center">
222
+ <h1 class="text-4xl tracking-tight font-extrabold sm:text-5xl md:text-6xl">
223
+ <span class="block">Boutique d'Assistance IA</span>
224
+ <span class="block text-indigo-200">986200 Services Disponibles</span>
225
+ </h1>
226
+ <p class="mt-3 max-w-md mx-auto text-base text-indigo-100 sm:text-lg md:mt-5 md:text-xl md:max-w-3xl">
227
+ Accédez à notre puissante intelligence artificielle pour automatiser vos tâches et booster votre productivité.
228
+ </p>
229
+ <div class="mt-5 max-w-md mx-auto sm:flex sm:justify-center md:mt-8">
230
+ <div class="rounded-md shadow">
231
+ <button id="subscribe-btn" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-indigo-600 bg-white hover:bg-indigo-50 md:py-4 md:text-lg md:px-10 transition-all">
232
+ S'abonner Maintenant
233
+ </button>
234
+ </div>
235
+ <div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
236
+ <a href="#services" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-500 hover:bg-indigo-600 md:py-4 md:text-lg md:px-10 transition-all">
237
+ Voir les Services
238
+ </a>
239
+ </div>
240
+ </div>
241
+ </div>
242
+ </div>
243
+ <div class="absolute top-0 left-0 w-full h-full overflow-hidden pointer-events-none">
244
+ <div class="absolute top-20 right-20 w-64 h-64 rounded-full bg-indigo-400 opacity-20 floating" style="animation-delay: 0s;"></div>
245
+ <div class="absolute top-1/3 left-1/4 w-48 h-48 rounded-full bg-purple-400 opacity-20 floating" style="animation-delay: 1s;"></div>
246
+ <div class="absolute bottom-20 right-1/4 w-32 h-32 rounded-full bg-pink-400 opacity-20 floating" style="animation-delay: 2s;"></div>
247
+ </div>
248
+ </div>
249
+
250
+ <!-- Services Section -->
251
+ <section id="services" class="py-12 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto">
252
+ <div class="text-center mb-12">
253
+ <h2 class="text-3xl font-extrabold tracking-tight sm:text-4xl">
254
+ Nos Services IA
255
+ </h2>
256
+ <p class="mt-3 max-w-2xl mx-auto text-xl text-indigo-100 sm:mt-4">
257
+ Choisissez parmi nos 986200 services d'assistance IA spécialisés
258
+ </p>
259
+ </div>
260
+
261
+ <div class="grid grid-cols-1 gap-8 sm:grid-cols-2 lg:grid-cols-3">
262
+ <!-- Service Card 1 -->
263
+ <div class="bg-white bg-opacity-10 rounded-lg overflow-hidden shadow-lg card-hover transition-all relative">
264
+ <div class="admin-badge hidden">
265
+ <i class="fas fa-crown"></i>
266
+ </div>
267
+ <div class="p-5">
268
+ <div class="flex items-center">
269
+ <div class="flex-shrink-0 bg-indigo-500 rounded-md p-3">
270
+ <i class="fas fa-robot text-white text-xl"></i>
271
+ </div>
272
+ <div class="ml-4">
273
+ <h3 class="text-lg font-medium">Assistant IA Général</h3>
274
+ <p class="mt-1 text-sm text-indigo-100">Réponses intelligentes à toutes vos questions</p>
275
+ </div>
276
+ </div>
277
+ <div class="mt-4">
278
+ <p class="text-sm text-indigo-100">
279
+ Notre IA avancée peut répondre à toutes vos questions, analyser des documents et fournir des insights pertinents.
280
+ </p>
281
+ </div>
282
+ <div class="mt-6 flex items-center justify-between">
283
+ <span class="text-2xl font-bold">9.99€</span>
284
+ <button onclick="addToCart('Assistant IA Général', 9.99, 'service1')" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
285
+ Ajouter au panier
286
+ </button>
287
+ <button id="free-access-btn" class="hidden px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all">
288
+ Accès Gratuit
289
+ </button>
290
+ </div>
291
+ </div>
292
+ </div>
293
+
294
+ <!-- Service Card 2 -->
295
+ <div class="bg-white bg-opacity-10 rounded-lg overflow-hidden shadow-lg card-hover transition-all relative">
296
+ <div class="admin-badge hidden">
297
+ <i class="fas fa-crown"></i>
298
+ </div>
299
+ <div class="p-5">
300
+ <div class="flex items-center">
301
+ <div class="flex-shrink-0 bg-purple-500 rounded-md p-3">
302
+ <i class="fas fa-chart-line text-white text-xl"></i>
303
+ </div>
304
+ <div class="ml-4">
305
+ <h3 class="text-lg font-medium">Analyse de Données</h3>
306
+ <p class="mt-1 text-sm text-indigo-100">Analyse avancée de vos datasets</p>
307
+ </div>
308
+ </div>
309
+ <div class="mt-4">
310
+ <p class="text-sm text-indigo-100">
311
+ Notre IA peut analyser vos données, identifier des tendances et générer des rapports détaillés en quelques secondes.
312
+ </p>
313
+ </div>
314
+ <div class="mt-6 flex items-center justify-between">
315
+ <span class="text-2xl font-bold">14.99€</span>
316
+ <button onclick="addToCart('Analyse de Données', 14.99, 'service2')" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
317
+ Ajouter au panier
318
+ </button>
319
+ <button id="free-access-btn" class="hidden px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all">
320
+ Accès Gratuit
321
+ </button>
322
+ </div>
323
+ </div>
324
+ </div>
325
+
326
+ <!-- Service Card 3 -->
327
+ <div class="bg-white bg-opacity-10 rounded-lg overflow-hidden shadow-lg card-hover transition-all relative">
328
+ <div class="admin-badge hidden">
329
+ <i class="fas fa-crown"></i>
330
+ </div>
331
+ <div class="p-5">
332
+ <div class="flex items-center">
333
+ <div class="flex-shrink-0 bg-pink-500 rounded-md p-3">
334
+ <i class="fas fa-language text-white text-xl"></i>
335
+ </div>
336
+ <div class="ml-4">
337
+ <h3 class="text-lg font-medium">Traduction IA</h3>
338
+ <p class="mt-1 text-sm text-indigo-100">Traduction précise en 50+ langues</p>
339
+ </div>
340
+ </div>
341
+ <div class="mt-4">
342
+ <p class="text-sm text-indigo-100">
343
+ Traduction de haute qualité avec compréhension contextuelle pour des résultats naturels et précis.
344
+ </p>
345
+ </div>
346
+ <div class="mt-6 flex items-center justify-between">
347
+ <span class="text-2xl font-bold">7.99€</span>
348
+ <button onclick="addToCart('Traduction IA', 7.99, 'service3')" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
349
+ Ajouter au panier
350
+ </button>
351
+ <button id="free-access-btn" class="hidden px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all">
352
+ Accès Gratuit
353
+ </button>
354
+ </div>
355
+ </div>
356
+ </div>
357
+
358
+ <!-- Service Card 4 -->
359
+ <div class="bg-white bg-opacity-10 rounded-lg overflow-hidden shadow-lg card-hover transition-all relative">
360
+ <div class="admin-badge hidden">
361
+ <i class="fas fa-crown"></i>
362
+ </div>
363
+ <div class="p-5">
364
+ <div class="flex items-center">
365
+ <div class="flex-shrink-0 bg-blue-500 rounded-md p-3">
366
+ <i class="fas fa-code text-white text-xl"></i>
367
+ </div>
368
+ <div class="ml-4">
369
+ <h3 class="text-lg font-medium">Génération de Code</h3>
370
+ <p class="mt-1 text-sm text-indigo-100">Code propre et fonctionnel en 10+ langages</p>
371
+ </div>
372
+ </div>
373
+ <div class="mt-4">
374
+ <p class="text-sm text-indigo-100">
375
+ Générez du code à partir de descriptions en langage naturel. Support pour Python, JavaScript, Java, C++ et plus.
376
+ </p>
377
+ </div>
378
+ <div class="mt-6 flex items-center justify-between">
379
+ <span class="text-2xl font-bold">12.99€</span>
380
+ <button onclick="addToCart('Génération de Code', 12.99, 'service4')" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
381
+ Ajouter au panier
382
+ </button>
383
+ <button id="free-access-btn" class="hidden px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all">
384
+ Accès Gratuit
385
+ </button>
386
+ </div>
387
+ </div>
388
+ </div>
389
+
390
+ <!-- Service Card 5 -->
391
+ <div class="bg-white bg-opacity-10 rounded-lg overflow-hidden shadow-lg card-hover transition-all relative">
392
+ <div class="admin-badge hidden">
393
+ <i class="fas fa-crown"></i>
394
+ </div>
395
+ <div class="p-5">
396
+ <div class="flex items-center">
397
+ <div class="flex-shrink-0 bg-green-500 rounded-md p-3">
398
+ <i class="fas fa-image text-white text-xl"></i>
399
+ </div>
400
+ <div class="ml-4">
401
+ <h3 class="text-lg font-medium">Génération d'Images</h3>
402
+ <p class="mt-1 text-sm text-indigo-100">Créez des images uniques à partir de texte</p>
403
+ </div>
404
+ </div>
405
+ <div class="mt-4">
406
+ <p class="text-sm text-indigo-100">
407
+ Générez des images haute résolution à partir de descriptions textuelles. Parfait pour le marketing et le design.
408
+ </p>
409
+ </div>
410
+ <div class="mt-6 flex items-center justify-between">
411
+ <span class="text-2xl font-bold">5.99€</span>
412
+ <button onclick="addToCart('Génération d\'Images', 5.99, 'service5')" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
413
+ Ajouter au panier
414
+ </button>
415
+ <button id="free-access-btn" class="hidden px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all">
416
+ Accès Gratuit
417
+ </button>
418
+ </div>
419
+ </div>
420
+ </div>
421
+
422
+ <!-- Service Card 6 -->
423
+ <div class="bg-white bg-opacity-10 rounded-lg overflow-hidden shadow-lg card-hover transition-all relative">
424
+ <div class="admin-badge hidden">
425
+ <i class="fas fa-crown"></i>
426
+ </div>
427
+ <div class="p-5">
428
+ <div class="flex items-center">
429
+ <div class="flex-shrink-0 bg-yellow-500 rounded-md p-3">
430
+ <i class="fas fa-video text-white text-xl"></i>
431
+ </div>
432
+ <div class="ml-4">
433
+ <h3 class="text-lg font-medium">Édition Vidéo IA</h3>
434
+ <p class="mt-1 text-sm text-indigo-100">Montage vidéo automatisé et intelligent</p>
435
+ </div>
436
+ </div>
437
+ <div class="mt-4">
438
+ <p class="text-sm text-indigo-100">
439
+ Notre IA peut éditer vos vidéos automatiquement, ajouter des transitions, des effets et même générer des sous-titres.
440
+ </p>
441
+ </div>
442
+ <div class="mt-6 flex items-center justify-between">
443
+ <span class="text-2xl font-bold">19.99€</span>
444
+ <button onclick="addToCart('Édition Vidéo IA', 19.99, 'service6')" class="px-4 py-2 bg-indigo-600 text-white text-sm font-medium rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
445
+ Ajouter au panier
446
+ </button>
447
+ <button id="free-access-btn" class="hidden px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-md hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all">
448
+ Accès Gratuit
449
+ </button>
450
+ </div>
451
+ </div>
452
+ </div>
453
+ </div>
454
+
455
+ <div class="mt-12 text-center">
456
+ <button class="px-6 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 transition-all">
457
+ Voir tous les 986200 services
458
+ </button>
459
+ </div>
460
+ </section>
461
+
462
+ <!-- Dashboard Section -->
463
+ <section id="dashboard" class="py-12 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto bg-white bg-opacity-10 rounded-xl mt-12">
464
+ <div class="text-center mb-12">
465
+ <h2 class="text-3xl font-extrabold tracking-tight sm:text-4xl">
466
+ Tableau de Bord
467
+ </h2>
468
+ <p class="mt-3 max-w-2xl mx-auto text-xl text-indigo-100 sm:mt-4">
469
+ Gérez vos paiements et vos services
470
+ </p>
471
+ </div>
472
+
473
+ <div class="grid grid-cols-1 gap-8 lg:grid-cols-2">
474
+ <!-- Payment Methods -->
475
+ <div class="bg-white bg-opacity-5 rounded-lg p-6">
476
+ <h3 class="text-xl font-semibold mb-4">Méthodes de Paiement</h3>
477
+
478
+ <div class="space-y-4">
479
+ <div class="flex items-center justify-between p-4 bg-white bg-opacity-10 rounded-lg">
480
+ <div class="flex items-center">
481
+ <i class="fab fa-cc-paypal text-3xl text-blue-500 mr-3"></i>
482
+ <div>
483
+ <h4 class="font-medium">PayPal</h4>
484
+ <p class="text-sm text-indigo-100">Paiements sécurisés via PayPal</p>
485
+ </div>
486
+ </div>
487
+ <button onclick="window.open('https://www.paypal.com/paypalme/yourusername', '_blank')" class="px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-md hover:bg-blue-700 transition-all">
488
+ Configurer
489
+ </button>
490
+ </div>
491
+
492
+ <div class="flex items-center justify-between p-4 bg-white bg-opacity-10 rounded-lg">
493
+ <div class="flex items-center">
494
+ <i class="fab fa-cc-stripe text-3xl text-purple-500 mr-3"></i>
495
+ <div>
496
+ <h4 class="font-medium">Stripe</h4>
497
+ <p class="text-sm text-indigo-100">Paiements par carte bancaire</p>
498
+ </div>
499
+ </div>
500
+ <button onclick="window.open('https://dashboard.stripe.com/account', '_blank')" class="px-4 py-2 bg-purple-600 text-white text-sm font-medium rounded-md hover:bg-purple-700 transition-all">
501
+ Configurer
502
+ </button>
503
+ </div>
504
+ </div>
505
+ </div>
506
+
507
+ <!-- Payment Stats -->
508
+ <div class="bg-white bg-opacity-5 rounded-lg p-6">
509
+ <h3 class="text-xl font-semibold mb-4">Statistiques de Paiement</h3>
510
+
511
+ <div class="grid grid-cols-2 gap-4 mb-6">
512
+ <div class="bg-white bg-opacity-10 p-4 rounded-lg">
513
+ <p class="text-sm text-indigo-100">Revenus Totaux</p>
514
+ <p class="text-2xl font-bold">1,245.50€</p>
515
+ </div>
516
+ <div class="bg-white bg-opacity-10 p-4 rounded-lg">
517
+ <p class="text-sm text-indigo-100">Paiements ce mois</p>
518
+ <p class="text-2xl font-bold">325.97€</p>
519
+ </div>
520
+ </div>
521
+
522
+ <canvas id="paymentChart" height="200"></canvas>
523
+ </div>
524
+ </div>
525
+
526
+ <!-- Recent Payments -->
527
+ <div class="mt-8 bg-white bg-opacity-5 rounded-lg p-6">
528
+ <h3 class="text-xl font-semibold mb-4">Paiements Récents</h3>
529
+
530
+ <div class="overflow-x-auto">
531
+ <table class="min-w-full divide-y divide-white divide-opacity-20">
532
+ <thead>
533
+ <tr>
534
+ <th class="px-6 py-3 text-left text-xs font-medium text-indigo-100 uppercase tracking-wider">Date</th>
535
+ <th class="px-6 py-3 text-left text-xs font-medium text-indigo-100 uppercase tracking-wider">Service</th>
536
+ <th class="px-6 py-3 text-left text-xs font-medium text-indigo-100 uppercase tracking-wider">Montant</th>
537
+ <th class="px-6 py-3 text-left text-xs font-medium text-indigo-100 uppercase tracking-wider">Méthode</th>
538
+ <th class="px-6 py-3 text-left text-xs font-medium text-indigo-100 uppercase tracking-wider">Statut</th>
539
+ </tr>
540
+ </thead>
541
+ <tbody class="divide-y divide-white divide-opacity-10">
542
+ <tr>
543
+ <td class="px-6 py-4 whitespace-nowrap text-sm">15/06/2023</td>
544
+ <td class="px-6 py-4 whitespace-nowrap text-sm">Assistant IA Général</td>
545
+ <td class="px-6 py-4 whitespace-nowrap text-sm">9.99€</td>
546
+ <td class="px-6 py-4 whitespace-nowrap text-sm">
547
+ <span class="flex items-center">
548
+ <i class="fab fa-cc-paypal text-blue-500 mr-2"></i> PayPal
549
+ </span>
550
+ </td>
551
+ <td class="px-6 py-4 whitespace-nowrap text-sm">
552
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
553
+ Complété
554
+ </span>
555
+ </td>
556
+ </tr>
557
+ <tr>
558
+ <td class="px-6 py-4 whitespace-nowrap text-sm">10/06/2023</td>
559
+ <td class="px-6 py-4 whitespace-nowrap text-sm">Analyse de Données</td>
560
+ <td class="px-6 py-4 whitespace-nowrap text-sm">14.99€</td>
561
+ <td class="px-6 py-4 whitespace-nowrap text-sm">
562
+ <span class="flex items-center">
563
+ <i class="fab fa-cc-stripe text-purple-500 mr-2"></i> Stripe
564
+ </span>
565
+ </td>
566
+ <td class="px-6 py-4 whitespace-nowrap text-sm">
567
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">
568
+ Complété
569
+ </span>
570
+ </td>
571
+ </tr>
572
+ <tr>
573
+ <td class="px-6 py-4 whitespace-nowrap text-sm">05/06/2023</td>
574
+ <td class="px-6 py-4 whitespace-nowrap text-sm">Génération de Code</td>
575
+ <td class="px-6 py-4 whitespace-nowrap text-sm">12.99€</td>
576
+ <td class="px-6 py-4 whitespace-nowrap text-sm">
577
+ <span class="flex items-center">
578
+ <i class="fab fa-cc-paypal text-blue-500 mr-2"></i> PayPal
579
+ </span>
580
+ </td>
581
+ <td class="px-6 py-4 whitespace-nowrap text-sm">
582
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-yellow-100 text-yellow-800">
583
+ En attente
584
+ </span>
585
+ </td>
586
+ </tr>
587
+ </tbody>
588
+ </table>
589
+ </div>
590
+ </div>
591
+ </section>
592
+
593
+ <!-- Cart Section -->
594
+ <section id="cart" class="py-12 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto mt-12">
595
+ <div class="bg-white bg-opacity-10 rounded-xl p-6">
596
+ <h2 class="text-3xl font-extrabold tracking-tight mb-8">
597
+ Votre Panier
598
+ </h2>
599
+
600
+ <div id="cart-items" class="space-y-4">
601
+ <!-- Cart items will be added here dynamically -->
602
+ <p class="text-center text-indigo-100" id="empty-cart-message">Votre panier est vide</p>
603
+ </div>
604
+
605
+ <div class="mt-8 border-t border-white border-opacity-20 pt-6">
606
+ <div class="flex justify-between">
607
+ <span class="text-xl font-medium">Total</span>
608
+ <span id="cart-total" class="text-xl font-bold">0.00€</span>
609
+ </div>
610
+
611
+ <div class="mt-6 grid grid-cols-1 gap-4 sm:grid-cols-2">
612
+ <button onclick="window.open('https://www.paypal.com/checkoutnow?token=YOUR_TOKEN', '_blank')" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 transition-all">
613
+ <i class="fab fa-cc-paypal mr-2"></i> Payer avec PayPal
614
+ </button>
615
+ <button onclick="window.open('https://checkout.stripe.com/pay/YOUR_SESSION_ID', '_blank')" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 transition-all">
616
+ <i class="fab fa-cc-stripe mr-2"></i> Payer avec Stripe
617
+ </button>
618
+ </div>
619
+ </div>
620
+ </div>
621
+ </section>
622
+
623
+ <!-- Footer -->
624
+ <footer class="bg-white bg-opacity-10 mt-20">
625
+ <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
626
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8">
627
+ <div>
628
+ <h3 class="text-sm font-semibold uppercase tracking-wider">Services</h3>
629
+ <ul class="mt-4 space-y-2">
630
+ <li><a href="#" class="text-indigo-100 hover:text-white">Tous les services</a></li>
631
+ <li><a href="#" class="text-indigo-100 hover:text-white">Nouveautés</a></li>
632
+ <li><a href="#" class="text-indigo-100 hover:text-white">Populaires</a></li>
633
+ </ul>
634
+ </div>
635
+ <div>
636
+ <h3 class="text-sm font-semibold uppercase tracking-wider">Support</h3>
637
+ <ul class="mt-4 space-y-2">
638
+ <li><a href="#" class="text-indigo-100 hover:text-white">Centre d'aide</a></li>
639
+ <li><a href="#" class="text-indigo-100 hover:text-white">Contact</a></li>
640
+ <li><a href="#" class="text-indigo-100 hover:text-white">FAQ</a></li>
641
+ </ul>
642
+ </div>
643
+ <div>
644
+ <h3 class="text-sm font-semibold uppercase tracking-wider">Entreprise</h3>
645
+ <ul class="mt-4 space-y-2">
646
+ <li><a href="#" class="text-indigo-100 hover:text-white">À propos</a></li>
647
+ <li><a href="#" class="text-indigo-100 hover:text-white">Blog</a></li>
648
+ <li><a href="#" class="text-indigo-100 hover:text-white">Carrières</a></li>
649
+ </ul>
650
+ </div>
651
+ <div>
652
+ <h3 class="text-sm font-semibold uppercase tracking-wider">Légal</h3>
653
+ <ul class="mt-4 space-y-2">
654
+ <li><a href="#" class="text-indigo-100 hover:text-white">Confidentialité</a></li>
655
+ <li><a href="#" class="text-indigo-100 hover:text-white">Conditions</a></li>
656
+ <li><a href="#" class="text-indigo-100 hover:text-white">Cookies</a></li>
657
+ </ul>
658
+ </div>
659
+ </div>
660
+ <div class="mt-12 border-t border-white border-opacity-20 pt-8 flex flex-col items-center">
661
+ <p class="text-indigo-100 text-sm">
662
+ &copy; 2023 AI Marketplace. Tous droits réservés.
663
+ </p>
664
+ <div class="mt-4 flex space-x-6">
665
+ <a href="#" class="text-indigo-100 hover:text-white">
666
+ <i class="fab fa-facebook-f"></i>
667
+ </a>
668
+ <a href="#" class="text-indigo-100 hover:text-white">
669
+ <i class="fab fa-twitter"></i>
670
+ </a>
671
+ <a href="#" class="text-indigo-100 hover:text-white">
672
+ <i class="fab fa-instagram"></i>
673
+ </a>
674
+ <a href="#" class="text-indigo-100 hover:text-white">
675
+ <i class="fab fa-linkedin-in"></i>
676
+ </a>
677
+ </div>
678
+ </div>
679
+ </div>
680
+ </footer>
681
+
682
+ <script>
683
+ // Admin accounts
684
+ const adminAccounts = [
685
+ { email: "[email protected]", password: "Admin270574@" },
686
+ { email: "[email protected]", password: "Admin270574@" }
687
+ ];
688
+
689
+ // Mobile menu toggle
690
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
691
+ const menu = document.getElementById('mobile-menu');
692
+ menu.classList.toggle('hidden');
693
+ });
694
+
695
+ // Login modal
696
+ document.getElementById('user-menu').addEventListener('click', function() {
697
+ if (localStorage.getItem('loggedIn')) {
698
+ // Show user dropdown if logged in
699
+ alert('Vous êtes déjà connecté');
700
+ } else {
701
+ document.getElementById('login-modal').classList.remove('hidden');
702
+ }
703
+ });
704
+
705
+ document.getElementById('mobile-login-btn').addEventListener('click', function(e) {
706
+ e.preventDefault();
707
+ document.getElementById('login-modal').classList.remove('hidden');
708
+ });
709
+
710
+ document.getElementById('cancel-login').addEventListener('click', function() {
711
+ document.getElementById('login-modal').classList.add('hidden');
712
+ });
713
+
714
+ document.getElementById('confirm-login').addEventListener('click', function() {
715
+ const email = document.getElementById('login-email').value;
716
+ const password = document.getElementById('login-password').value;
717
+
718
+ if (!email || !password) {
719
+ alert('Veuillez remplir tous les champs');
720
+ return;
721
+ }
722
+
723
+ // Check if it's an admin account
724
+ const isAdmin = adminAccounts.some(account =>
725
+ account.email === email && account.password === password
726
+ );
727
+
728
+ if (isAdmin) {
729
+ localStorage.setItem('loggedIn', 'true');
730
+ localStorage.setItem('isAdmin', 'true');
731
+ localStorage.setItem('userEmail', email);
732
+
733
+ updateUserStatus();
734
+ document.getElementById('login-modal').classList.add('hidden');
735
+
736
+ // Show admin badges and free access buttons
737
+ document.querySelectorAll('.admin-badge').forEach(badge => {
738
+ badge.classList.remove('hidden');
739
+ });
740
+
741
+ document.querySelectorAll('#free-access-btn').forEach(btn => {
742
+ btn.classList.remove('hidden');
743
+ btn.previousElementSibling.classList.add('hidden');
744
+ });
745
+
746
+ alert('Bienvenue Administrateur! Vous avez accès à tous les services gratuitement.');
747
+ } else {
748
+ // For regular users, show subscription modal
749
+ localStorage.setItem('loggedIn', 'true');
750
+ localStorage.setItem('isAdmin', 'false');
751
+ localStorage.setItem('userEmail', email);
752
+
753
+ updateUserStatus();
754
+ document.getElementById('login-modal').classList.add('hidden');
755
+
756
+ // Show subscription modal for regular users
757
+ document.getElementById('subscribe-modal').classList.remove('hidden');
758
+ }
759
+ });
760
+
761
+ // Subscription modal
762
+ document.getElementById('subscribe-btn').addEventListener('click', function() {
763
+ if (!localStorage.getItem('loggedIn')) {
764
+ document.getElementById('login-modal').classList.remove('hidden');
765
+ } else if (localStorage.getItem('isAdmin') === 'true') {
766
+ alert('Vous êtes administrateur, vous avez déjà accès à tous les services gratuitement.');
767
+ } else {
768
+ document.getElementById('subscribe-modal').classList.remove('hidden');
769
+ }
770
+ });
771
+
772
+ document.getElementById('cancel-subscribe').addEventListener('click', function() {
773
+ document.getElementById('subscribe-modal').classList.add('hidden');
774
+ });
775
+
776
+ document.getElementById('confirm-subscribe').addEventListener('click', function() {
777
+ const plan = document.querySelector('input[name="subscription-plan"]:checked').id;
778
+ const price = plan === 'monthly-plan' ? '19.99€/mois' : '199.99€/an';
779
+
780
+ localStorage.setItem('subscribed', 'true');
781
+ localStorage.setItem('subscriptionPlan', plan);
782
+
783
+ document.getElementById('subscribe-modal').classList.add('hidden');
784
+ alert(`Merci pour votre abonnement ${price}! Vous avez maintenant accès à tous les services.`);
785
+
786
+ updateUserStatus();
787
+ });
788
+
789
+ // Logout functionality
790
+ document.getElementById('mobile-logout-btn').addEventListener('click', function(e) {
791
+ e.preventDefault();
792
+ logout();
793
+ });
794
+
795
+ function logout() {
796
+ localStorage.removeItem('loggedIn');
797
+ localStorage.removeItem('isAdmin');
798
+ localStorage.removeItem('userEmail');
799
+ localStorage.removeItem('subscribed');
800
+ localStorage.removeItem('subscriptionPlan');
801
+
802
+ updateUserStatus();
803
+
804
+ // Hide admin badges and free access buttons
805
+ document.querySelectorAll('.admin-badge').forEach(badge => {
806
+ badge.classList.add('hidden');
807
+ });
808
+
809
+ document.querySelectorAll('#free-access-btn').forEach(btn => {
810
+ btn.classList.add('hidden');
811
+ btn.previousElementSibling.classList.remove('hidden');
812
+ });
813
+
814
+ alert('Vous avez été déconnecté avec succès.');
815
+ }
816
+
817
+ function updateUserStatus() {
818
+ const isLoggedIn = localStorage.getItem('loggedIn') === 'true';
819
+ const isAdmin = localStorage.getItem('isAdmin') === 'true';
820
+ const isSubscribed = localStorage.getItem('subscribed') === 'true';
821
+ const userEmail = localStorage.getItem('userEmail');
822
+
823
+ if (isLoggedIn) {
824
+ let statusText = isAdmin ? 'Admin' : (isSubscribed ? 'Abonné' : 'Connecté');
825
+ statusText += ` (${userEmail})`;
826
+
827
+ document.getElementById('user-status').textContent = statusText;
828
+ document.getElementById('user-status').classList.remove('hidden');
829
+ document.getElementById('mobile-user-status').textContent = statusText;
830
+
831
+ document.getElementById('mobile-login-btn').classList.add('hidden');
832
+ document.getElementById('mobile-logout-btn').classList.remove('hidden');
833
+ } else {
834
+ document.getElementById('user-status').textContent = 'Non connecté';
835
+ document.getElementById('mobile-user-status').textContent = 'Non connecté';
836
+
837
+ document.getElementById('mobile-login-btn').classList.remove('hidden');
838
+ document.getElementById('mobile-logout-btn').classList.add('hidden');
839
+ }
840
+ }
841
+
842
+ // Cart functionality
843
+ let cart = [];
844
+
845
+ function addToCart(name, price, id) {
846
+ // Check if user is logged in
847
+ if (!localStorage.getItem('loggedIn')) {
848
+ document.getElementById('login-modal').classList.remove('hidden');
849
+ return;
850
+ }
851
+
852
+ // Check if user is admin (free access)
853
+ if (localStorage.getItem('isAdmin') === 'true') {
854
+ alert('En tant qu\'administrateur, vous avez accès gratuit à ce service.');
855
+ return;
856
+ }
857
+
858
+ // Check if user is subscribed
859
+ if (localStorage.getItem('subscribed') !== 'true') {
860
+ document.getElementById('subscribe-modal').classList.remove('hidden');
861
+ return;
862
+ }
863
+
864
+ const existingItem = cart.find(item => item.id === id);
865
+
866
+ if (existingItem) {
867
+ existingItem.quantity += 1;
868
+ } else {
869
+ cart.push({
870
+ id,
871
+ name,
872
+ price,
873
+ quantity: 1
874
+ });
875
+ }
876
+
877
+ updateCartDisplay();
878
+ }
879
+
880
+ function removeFromCart(id) {
881
+ cart = cart.filter(item => item.id !== id);
882
+ updateCartDisplay();
883
+ }
884
+
885
+ function updateCartDisplay() {
886
+ const cartItemsContainer = document.getElementById('cart-items');
887
+ const emptyCartMessage = document.getElementById('empty-cart-message');
888
+ const cartTotal = document.getElementById('cart-total');
889
+
890
+ if (cart.length === 0) {
891
+ emptyCartMessage.classList.remove('hidden');
892
+ cartItemsContainer.innerHTML = '';
893
+ cartTotal.textContent = '0.00€';
894
+ return;
895
+ }
896
+
897
+ emptyCartMessage.classList.add('hidden');
898
+
899
+ let itemsHTML = '';
900
+ let total = 0;
901
+
902
+ cart.forEach(item => {
903
+ total += item.price * item.quantity;
904
+
905
+ itemsHTML += `
906
+ <div class="flex items-center justify-between p-4 bg-white bg-opacity-10 rounded-lg">
907
+ <div>
908
+ <h4 class="font-medium">${item.name}</h4>
909
+ <p class="text-sm text-indigo-100">${item.price.toFixed(2)}€ x ${item.quantity}</p>
910
+ </div>
911
+ <div class="flex items-center">
912
+ <span class="font-medium mr-4">${(item.price * item.quantity).toFixed(2)}€</span>
913
+ <button onclick="removeFromCart('${item.id}')" class="p-1 text-red-400 hover:text-red-300">
914
+ <i class="fas fa-trash"></i>
915
+ </button>
916
+ </div>
917
+ </div>
918
+ `;
919
+ });
920
+
921
+ cartItemsContainer.innerHTML = itemsHTML;
922
+ cartTotal.textContent = total.toFixed(2) + '€';
923
+ }
924
+
925
+ // Payment chart
926
+ document.addEventListener('DOMContentLoaded', function() {
927
+ // Initialize user status
928
+ updateUserStatus();
929
+
930
+ const ctx = document.getElementById('paymentChart').getContext('2d');
931
+ const chart = new Chart(ctx, {
932
+ type: 'line',
933
+ data: {
934
+ labels: ['Jan', 'Fév', 'Mar', 'Avr', 'Mai', 'Juin'],
935
+ datasets: [{
936
+ label: 'Revenus (€)',
937
+ data: [320, 450, 580, 620, 750, 890],
938
+ backgroundColor: 'rgba(165, 180, 252, 0.2)',
939
+ borderColor: 'rgba(165, 180, 252, 1)',
940
+ borderWidth: 2,
941
+ tension: 0.4,
942
+ fill: true
943
+ }]
944
+ },
945
+ options: {
946
+ responsive: true,
947
+ plugins: {
948
+ legend: {
949
+ display: false
950
+ }
951
+ },
952
+ scales: {
953
+ y: {
954
+ beginAtZero: true,
955
+ grid: {
956
+ color: 'rgba(255, 255, 255, 0.1)'
957
+ },
958
+ ticks: {
959
+ color: 'rgba(255, 255, 255, 0.7)'
960
+ }
961
+ },
962
+ x: {
963
+ grid: {
964
+ color: 'rgba(255, 255, 255, 0.1)'
965
+ },
966
+ ticks: {
967
+ color: 'rgba(255, 255, 255, 0.7)'
968
+ }
969
+ }
970
+ }
971
+ }
972
+ });
973
+ });
974
+
975
+ // Free access buttons functionality
976
+ document.querySelectorAll('#free-access-btn').forEach(btn => {
977
+ btn.addEventListener('click', function() {
978
+ if (localStorage.getItem('isAdmin') === 'true') {
979
+ const serviceName = this.parentNode.querySelector('span').textContent.replace('€', '').trim();
980
+ alert(`Accès gratuit accordé au service: ${serviceName}`);
981
+ }
982
+ });
983
+ });
984
+ </script>
985
+ <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/ia-boot" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
986
+ </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ creer un site de marketplace composer de 986200 bouton d'assisat IA TRES puissant avec des vrais bouton reel et actif pas des bouton d'exemple je veux un vrais site avec des bouton reel : ajouter bouton paypal , stripe , avec mes information pour etre payer , ajouter panier d'achat , obligatio de sabonner pour utiliser le site gratuitement ajouter tableau de bord avec les information de paiement paypal, stripe, avec bouton stripe ,bouton paypal etc.. plus panier d'achat pour les information de paiement pour recevoir mes paiement : le tout en automatique ouvrer chaque bouton cliquéé dans une nouvel fenetre , je veut un tres belle interface tres animer et un jolie arriere plant
2
+ je veux acces et toute produit pour moi seul les autre devront payer un abonnement : [email protected] : Admin270574@ et [email protected] : Admin270574@