Hugging Face's logo

Spaces:
docto41
/
prosite-builder
Running

App Files Community
docto41 commited on
Commit
25fc48a
·
verified ·
1 Parent(s): 1eca635

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +5 -3
  2. index.html +418 -19
  3. prompts.txt +2 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Prosite Builder
3
- emoji: 💻
4
  colorFrom: yellow
5
  colorTo: blue
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: prosite-builder
3
+ emoji: 🐳
4
  colorFrom: yellow
5
  colorTo: blue
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,418 @@
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>ProSite Builder - Générateur Professionnel</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .editor-bg {
11
+ background-color: #1e293b;
12
+ }
13
+ .sidebar-bg {
14
+ background-color: #0f172a;
15
+ }
16
+ .code-editor {
17
+ font-family: 'Courier New', monospace;
18
+ font-size: 14px;
19
+ line-height: 1.5;
20
+ tab-size: 2;
21
+ }
22
+ .preview-frame {
23
+ transform: scale(0.8);
24
+ transform-origin: top left;
25
+ width: 125%;
26
+ height: 125%;
27
+ }
28
+ .component-card:hover {
29
+ transform: translateY(-3px);
30
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
31
+ }
32
+ .draggable-component {
33
+ cursor: grab;
34
+ }
35
+ .draggable-component:active {
36
+ cursor: grabbing;
37
+ }
38
+ </style>
39
+ </head>
40
+ <body class="bg-gray-100 font-sans">
41
+ <!-- Top Navigation -->
42
+ <nav class="bg-gray-900 text-white shadow-lg">
43
+ <div class="container mx-auto px-6 py-3">
44
+ <div class="flex items-center justify-between">
45
+ <div class="flex items-center space-x-4">
46
+ <i class="fas fa-code text-2xl text-blue-400"></i>
47
+ <span class="text-xl font-bold">ProSite Builder</span>
48
+ <span class="hidden md:inline-block bg-blue-500 text-xs px-2 py-1 rounded-full">PRO</span>
49
+ </div>
50
+ <div class="flex items-center space-x-6">
51
+ <button class="bg-blue-600 hover:bg-blue-700 px-4 py-2 rounded-lg flex items-center">
52
+ <i class="fas fa-play mr-2"></i> Exécuter
53
+ </button>
54
+ <button class="bg-green-600 hover:bg-green-700 px-4 py-2 rounded-lg flex items-center">
55
+ <i class="fas fa-cloud-upload-alt mr-2"></i> Publier
56
+ </button>
57
+ <div class="hidden md:flex items-center space-x-2">
58
+ <img src="https://randomuser.me/api/portraits/men/32.jpg" alt="User" class="w-8 h-8 rounded-full">
59
+ <span>John Doe</span>
60
+ </div>
61
+ </div>
62
+ </div>
63
+ </div>
64
+ </nav>
65
+
66
+ <!-- Main Editor Area -->
67
+ <div class="flex h-screen pt-16 overflow-hidden">
68
+ <!-- Left Sidebar - Components -->
69
+ <div class="sidebar-bg text-gray-200 w-64 flex-shrink-0 overflow-y-auto">
70
+ <div class="p-4">
71
+ <h3 class="font-semibold text-lg mb-4 flex items-center">
72
+ <i class="fas fa-cubes mr-2 text-blue-400"></i> Composants
73
+ </h3>
74
+
75
+ <div class="mb-6">
76
+ <h4 class="text-sm uppercase font-medium mb-2 text-gray-400">Structure</h4>
77
+ <div class="space-y-2">
78
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="header">
79
+ <div class="flex items-center">
80
+ <i class="fas fa-heading text-blue-400 mr-2"></i>
81
+ <span>En-tête</span>
82
+ </div>
83
+ </div>
84
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="hero">
85
+ <div class="flex items-center">
86
+ <i class="fas fa-star text-yellow-400 mr-2"></i>
87
+ <span>Section Hero</span>
88
+ </div>
89
+ </div>
90
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="footer">
91
+ <div class="flex items-center">
92
+ <i class="fas fa-shoe-prints text-purple-400 mr-2"></i>
93
+ <span>Pied de page</span>
94
+ </div>
95
+ </div>
96
+ </div>
97
+ </div>
98
+
99
+ <div class="mb-6">
100
+ <h4 class="text-sm uppercase font-medium mb-2 text-gray-400">Contenu</h4>
101
+ <div class="space-y-2">
102
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="text">
103
+ <div class="flex items-center">
104
+ <i class="fas fa-paragraph text-green-400 mr-2"></i>
105
+ <span>Texte</span>
106
+ </div>
107
+ </div>
108
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="image">
109
+ <div class="flex items-center">
110
+ <i class="fas fa-image text-red-400 mr-2"></i>
111
+ <span>Image</span>
112
+ </div>
113
+ </div>
114
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="video">
115
+ <div class="flex items-center">
116
+ <i class="fas fa-video text-purple-400 mr-2"></i>
117
+ <span>Vidéo</span>
118
+ </div>
119
+ </div>
120
+ </div>
121
+ </div>
122
+
123
+ <div class="mb-6">
124
+ <h4 class="text-sm uppercase font-medium mb-2 text-gray-400">Avancé</h4>
125
+ <div class="space-y-2">
126
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="form">
127
+ <div class="flex items-center">
128
+ <i class="fas fa-envelope text-blue-400 mr-2"></i>
129
+ <span>Formulaire</span>
130
+ </div>
131
+ </div>
132
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="gallery">
133
+ <div class="flex items-center">
134
+ <i class="fas fa-th text-yellow-400 mr-2"></i>
135
+ <span>Galerie</span>
136
+ </div>
137
+ </div>
138
+ <div class="component-card draggable-component bg-gray-800 p-3 rounded-lg cursor-move" draggable="true" data-type="map">
139
+ <div class="flex items-center">
140
+ <i class="fas fa-map-marked-alt text-green-400 mr-2"></i>
141
+ <span>Carte</span>
142
+ </div>
143
+ </div>
144
+ </div>
145
+ </div>
146
+ </div>
147
+ </div>
148
+
149
+ <!-- Main Editor -->
150
+ <div class="flex-1 flex flex-col overflow-hidden">
151
+ <!-- Editor Tabs -->
152
+ <div class="editor-bg text-gray-300 border-b border-gray-700">
153
+ <div class="flex">
154
+ <div class="px-4 py-3 border-b-2 border-blue-500 text-white flex items-center">
155
+ <i class="fas fa-file-code mr-2"></i>
156
+ <span>index.html</span>
157
+ <button class="ml-2 text-gray-400 hover:text-white">
158
+ <i class="fas fa-times"></i>
159
+ </button>
160
+ </div>
161
+ <div class="px-4 py-3 hover:bg-gray-700 flex items-center">
162
+ <i class="fas fa-file-code mr-2"></i>
163
+ <span>style.css</span>
164
+ <button class="ml-2 text-gray-400 hover:text-white">
165
+ <i class="fas fa-times"></i>
166
+ </button>
167
+ </div>
168
+ <div class="px-4 py-3 hover:bg-gray-700 flex items-center">
169
+ <i class="fas fa-file-code mr-2"></i>
170
+ <span>script.js</span>
171
+ <button class="ml-2 text-gray-400 hover:text-white">
172
+ <i class="fas fa-times"></i>
173
+ </button>
174
+ </div>
175
+ <button class="px-3 text-gray-400 hover:text-white">
176
+ <i class="fas fa-plus"></i>
177
+ </button>
178
+ </div>
179
+ </div>
180
+
181
+ <!-- Code Editor -->
182
+ <div class="flex-1 flex overflow-hidden">
183
+ <div class="editor-bg flex-1 overflow-auto code-editor p-4 text-gray-300">
184
+ <div class="mb-4">
185
+ <span class="text-blue-400">&lt;!DOCTYPE html&gt;</span>
186
+ </div>
187
+ <div class="mb-4">
188
+ <span class="text-blue-400">&lt;html</span> <span class="text-green-400">lang=</span><span class="text-yellow-400">"fr"</span><span class="text-blue-400">&gt;</span>
189
+ </div>
190
+ <div class="mb-4 ml-4">
191
+ <span class="text-blue-400">&lt;head&gt;</span>
192
+ </div>
193
+ <div class="mb-4 ml-8">
194
+ <span class="text-blue-400">&lt;meta</span> <span class="text-green-400">charset=</span><span class="text-yellow-400">"UTF-8"</span><span class="text-blue-400">&gt;</span>
195
+ </div>
196
+ <div class="mb-4 ml-8">
197
+ <span class="text-blue-400">&lt;meta</span> <span class="text-green-400">name=</span><span class="text-yellow-400">"viewport"</span> <span class="text-green-400">content=</span><span class="text-yellow-400">"width=device-width, initial-scale=1.0"</span><span class="text-blue-400">&gt;</span>
198
+ </div>
199
+ <div class="mb-4 ml-8">
200
+ <span class="text-blue-400">&lt;title&gt;</span><span class="text-gray-300">Mon Site Professionnel</span><span class="text-blue-400">&lt;/title&gt;</span>
201
+ </div>
202
+ <div class="mb-4 ml-8">
203
+ <span class="text-blue-400">&lt;link</span> <span class="text-green-400">rel=</span><span class="text-yellow-400">"stylesheet"</span> <span class="text-green-400">href=</span><span class="text-yellow-400">"style.css"</span><span class="text-blue-400">&gt;</span>
204
+ </div>
205
+ <div class="mb-4 ml-4">
206
+ <span class="text-blue-400">&lt;/head&gt;</span>
207
+ </div>
208
+ <div class="mb-4 ml-4">
209
+ <span class="text-blue-400">&lt;body&gt;</span>
210
+ </div>
211
+ <div class="mb-4 ml-8">
212
+ <span class="text-blue-400">&lt;header</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"header"</span><span class="text-blue-400">&gt;</span>
213
+ </div>
214
+ <div class="mb-4 ml-12">
215
+ <span class="text-blue-400">&lt;nav&gt;</span>
216
+ </div>
217
+ <div class="mb-4 ml-16">
218
+ <span class="text-blue-400">&lt;div</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"container"</span><span class="text-blue-400">&gt;</span>
219
+ </div>
220
+ <div class="mb-4 ml-20">
221
+ <span class="text-blue-400">&lt;a</span> <span class="text-green-400">href=</span><span class="text-yellow-400">"#"</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"logo"</span><span class="text-blue-400">&gt;</span><span class="text-gray-300">MonLogo</span><span class="text-blue-400">&lt;/a&gt;</span>
222
+ </div>
223
+ <div class="mb-4 ml-20">
224
+ <span class="text-blue-400">&lt;ul</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"nav-links"</span><span class="text-blue-400">&gt;</span>
225
+ </div>
226
+ <div class="mb-4 ml-24">
227
+ <span class="text-blue-400">&lt;li&gt;</span><span class="text-blue-400">&lt;a</span> <span class="text-green-400">href=</span><span class="text-yellow-400">"#"</span><span class="text-blue-400">&gt;</span><span class="text-gray-300">Accueil</span><span class="text-blue-400">&lt;/a&gt;</span><span class="text-blue-400">&lt;/li&gt;</span>
228
+ </div>
229
+ <div class="mb-4 ml-24">
230
+ <span class="text-blue-400">&lt;li&gt;</span><span class="text-blue-400">&lt;a</span> <span class="text-green-400">href=</span><span class="text-yellow-400">"#"</span><span class="text-blue-400">&gt;</span><span class="text-gray-300">Services</span><span class="text-blue-400">&lt;/a&gt;</span><span class="text-blue-400">&lt;/li&gt;</span>
231
+ </div>
232
+ <div class="mb-4 ml-24">
233
+ <span class="text-blue-400">&lt;li&gt;</span><span class="text-blue-400">&lt;a</span> <span class="text-green-400">href=</span><span class="text-yellow-400">"#"</span><span class="text-blue-400">&gt;</span><span class="text-gray-300">Contact</span><span class="text-blue-400">&lt;/a&gt;</span><span class="text-blue-400">&lt;/li&gt;</span>
234
+ </div>
235
+ <div class="mb-4 ml-20">
236
+ <span class="text-blue-400">&lt;/ul&gt;</span>
237
+ </div>
238
+ <div class="mb-4 ml-16">
239
+ <span class="text-blue-400">&lt;/div&gt;</span>
240
+ </div>
241
+ <div class="mb-4 ml-12">
242
+ <span class="text-blue-400">&lt;/nav&gt;</span>
243
+ </div>
244
+ <div class="mb-4 ml-8">
245
+ <span class="text-blue-400">&lt;/header&gt;</span>
246
+ </div>
247
+ <div class="mb-4 ml-8">
248
+ <span class="text-blue-400">&lt;main&gt;</span>
249
+ </div>
250
+ <div class="mb-4 ml-12">
251
+ <span class="text-blue-400">&lt;section</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"hero"</span><span class="text-blue-400">&gt;</span>
252
+ </div>
253
+ <div class="mb-4 ml-16">
254
+ <span class="text-blue-400">&lt;div</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"container"</span><span class="text-blue-400">&gt;</span>
255
+ </div>
256
+ <div class="mb-4 ml-20">
257
+ <span class="text-blue-400">&lt;h1&gt;</span><span class="text-gray-300">Solution Professionnelle pour Votre Entreprise</span><span class="text-blue-400">&lt;/h1&gt;</span>
258
+ </div>
259
+ <div class="mb-4 ml-20">
260
+ <span class="text-blue-400">&lt;p&gt;</span><span class="text-gray-300">Nous créons des sites web haut de gamme avec des fonctionnalités avancées.</span><span class="text-blue-400">&lt;/p&gt;</span>
261
+ </div>
262
+ <div class="mb-4 ml-20">
263
+ <span class="text-blue-400">&lt;a</span> <span class="text-green-400">href=</span><span class="text-yellow-400">"#"</span> <span class="text-green-400">class=</span><span class="text-yellow-400">"btn"</span><span class="text-blue-400">&gt;</span><span class="text-gray-300">Démarrer</span><span class="text-blue-400">&lt;/a&gt;</span>
264
+ </div>
265
+ <div class="mb-4 ml-16">
266
+ <span class="text-blue-400">&lt;/div&gt;</span>
267
+ </div>
268
+ <div class="mb-4 ml-12">
269
+ <span class="text-blue-400">&lt;/section&gt;</span>
270
+ </div>
271
+ <div class="mb-4 ml-8">
272
+ <span class="text-blue-400">&lt;/main&gt;</span>
273
+ </div>
274
+ <div class="mb-4 ml-4">
275
+ <span class="text-blue-400">&lt;/body&gt;</span>
276
+ </div>
277
+ <div class="mb-4">
278
+ <span class="text-blue-400">&lt;/html&gt;</span>
279
+ </div>
280
+ </div>
281
+
282
+ <!-- Preview Panel -->
283
+ <div class="w-1/2 bg-white border-l border-gray-300 overflow-auto p-4">
284
+ <div class="flex justify-between items-center mb-4">
285
+ <h3 class="font-semibold text-gray-700">Aperçu en direct</h3>
286
+ <div class="flex space-x-2">
287
+ <button class="px-3 py-1 bg-gray-200 rounded hover:bg-gray-300">
288
+ <i class="fas fa-desktop"></i>
289
+ </button>
290
+ <button class="px-3 py-1 bg-gray-200 rounded hover:bg-gray-300">
291
+ <i class="fas fa-tablet-alt"></i>
292
+ </button>
293
+ <button class="px-3 py-1 bg-gray-200 rounded hover:bg-gray-300">
294
+ <i class="fas fa-mobile-alt"></i>
295
+ </button>
296
+ </div>
297
+ </div>
298
+
299
+ <div class="preview-frame border border-gray-300 rounded-lg overflow-hidden bg-white">
300
+ <iframe src="about:blank" id="livePreview" class="w-full h-full border-0"></iframe>
301
+ </div>
302
+ </div>
303
+ </div>
304
+ </div>
305
+ </div>
306
+
307
+ <!-- Bottom Status Bar -->
308
+ <div class="bg-gray-800 text-gray-400 text-sm px-4 py-2 flex justify-between items-center">
309
+ <div class="flex items-center space-x-4">
310
+ <div>
311
+ <i class="fas fa-circle text-green-500 mr-1"></i>
312
+ <span>Connecté</span>
313
+ </div>
314
+ <div>
315
+ <i class="fas fa-code-branch mr-1"></i>
316
+ <span>main</span>
317
+ </div>
318
+ </div>
319
+ <div class="flex items-center space-x-4">
320
+ <div>
321
+ <span>HTML</span>
322
+ </div>
323
+ <div>
324
+ <span>UTF-8</span>
325
+ </div>
326
+ <div>
327
+ <span>Ligne 42, Colonne 15</span>
328
+ </div>
329
+ </div>
330
+ </div>
331
+
332
+ <script>
333
+ // Drag and drop functionality
334
+ document.addEventListener('DOMContentLoaded', function() {
335
+ const draggables = document.querySelectorAll('.draggable-component');
336
+ const codeEditor = document.querySelector('.code-editor');
337
+
338
+ draggables.forEach(draggable => {
339
+ draggable.addEventListener('dragstart', () => {
340
+ draggable.classList.add('dragging');
341
+ });
342
+
343
+ draggable.addEventListener('dragend', () => {
344
+ draggable.classList.remove('dragging');
345
+ });
346
+ });
347
+
348
+ codeEditor.addEventListener('dragover', e => {
349
+ e.preventDefault();
350
+ const afterElement = getDragAfterElement(codeEditor, e.clientY);
351
+ const draggable = document.querySelector('.dragging');
352
+ if (afterElement == null) {
353
+ codeEditor.appendChild(draggable);
354
+ } else {
355
+ codeEditor.insertBefore(draggable, afterElement);
356
+ }
357
+ });
358
+
359
+ function getDragAfterElement(container, y) {
360
+ const draggableElements = [...container.querySelectorAll('.draggable-component:not(.dragging)')];
361
+
362
+ return draggableElements.reduce((closest, child) => {
363
+ const box = child.getBoundingClientRect();
364
+ const offset = y - box.top - box.height / 2;
365
+ if (offset < 0 && offset > closest.offset) {
366
+ return { offset: offset, element: child };
367
+ } else {
368
+ return closest;
369
+ }
370
+ }, { offset: Number.NEGATIVE_INFINITY }).element;
371
+ }
372
+
373
+ // Update preview
374
+ function updatePreview() {
375
+ const previewFrame = document.getElementById('livePreview');
376
+ const htmlCode = document.querySelector('.code-editor').innerText;
377
+
378
+ previewFrame.srcdoc = `
379
+ <!DOCTYPE html>
380
+ <html>
381
+ <head>
382
+ <style>
383
+ body { font-family: Arial, sans-serif; margin: 0; padding: 0; }
384
+ .header { background: #1e293b; color: white; padding: 1rem 0; }
385
+ .container { width: 90%; max-width: 1200px; margin: 0 auto; }
386
+ nav { display: flex; justify-content: space-between; align-items: center; }
387
+ .logo { color: white; text-decoration: none; font-weight: bold; font-size: 1.5rem; }
388
+ .nav-links { display: flex; list-style: none; }
389
+ .nav-links li { margin-left: 2rem; }
390
+ .nav-links a { color: white; text-decoration: none; }
391
+ .hero { padding: 4rem 0; text-align: center; background: #f8fafc; }
392
+ .btn { display: inline-block; background: #3b82f6; color: white; padding: 0.5rem 1rem; border-radius: 0.25rem; text-decoration: none; }
393
+ </style>
394
+ </head>
395
+ <body>
396
+ <header class="header">
397
+ <nav>
398
+ <div class="container">
399
+ <a href="#" class="logo">MonLogo</a>
400
+ <ul class="nav-links">
401
+ <li><a href="#">Accueil</a></li>
402
+ <li><a href="#">Services</a></li>
403
+ <li><a href="#">Contact</a></li>
404
+ </ul>
405
+ </div>
406
+ </nav>
407
+ </header>
408
+ <main>
409
+ <section class="hero">
410
+ <div class="container">
411
+ <h1>Solution Professionnelle pour Votre Entreprise</h1>
412
+ <p>Nous créons des sites web haut de gamme avec des fonctionnalités avancées.</p>
413
+ <a href="#" class="btn">Démarrer</a>
414
+ </div>
415
+ </section>
416
+ </main>
417
+ <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/prosite-builder" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
418
+ </html>
prompts.txt ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ GÉNÉRATEUR AUTOMATIQUE DE SITES WEB avec belle interface
2
+ je veux creer que des vrais site , professionne pouvant creer des site tres puissant de plus de 1500 ligne , pas des site vitrine que par description et visuel automatique de la creation du site avec une tres belle interface