Hugging Face's logo

Spaces:
basmeinen
/
leerplatform
Running

App Files Community
basmeinen commited on
Commit
d97bc8f
·
verified ·
1 Parent(s): f08fc7d

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +470 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Leerplatform
3
- emoji: 💻
4
- colorFrom: yellow
5
  colorTo: green
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: leerplatform
3
+ emoji: 🐳
4
+ colorFrom: pink
5
  colorTo: green
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,470 @@
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="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>DataMaster | Consultancy Learning Platform</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
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #6b73ff 0%, #000dff 100%);
12
+ }
13
+ .course-card:hover {
14
+ transform: translateY(-5px);
15
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
16
+ }
17
+ .progress-ring__circle {
18
+ transition: stroke-dashoffset 0.5s;
19
+ transform: rotate(-90deg);
20
+ transform-origin: 50% 50%;
21
+ }
22
+ .sidebar {
23
+ transition: all 0.3s ease;
24
+ }
25
+ @media (max-width: 768px) {
26
+ .sidebar {
27
+ transform: translateX(-100%);
28
+ }
29
+ .sidebar.open {
30
+ transform: translateX(0);
31
+ }
32
+ }
33
+ </style>
34
+ </head>
35
+ <body class="bg-gray-50 font-sans">
36
+ <!-- Mobile Menu Button -->
37
+ <button id="menuToggle" class="md:hidden fixed top-4 left-4 z-50 bg-white p-2 rounded-lg shadow-lg">
38
+ <i class="fas fa-bars text-blue-600 text-xl"></i>
39
+ </button>
40
+
41
+ <!-- Sidebar Navigation -->
42
+ <div id="sidebar" class="sidebar fixed inset-y-0 left-0 w-64 bg-white shadow-lg z-40">
43
+ <div class="flex items-center justify-center h-16 px-4 gradient-bg">
44
+ <h1 class="text-white text-xl font-bold">DataMaster</h1>
45
+ </div>
46
+ <nav class="mt-6">
47
+ <div class="px-4">
48
+ <div class="flex items-center px-4 py-3 bg-blue-50 text-blue-600 rounded-lg">
49
+ <i class="fas fa-home mr-3"></i>
50
+ <span class="font-medium">Dashboard</span>
51
+ </div>
52
+ <div class="flex items-center px-4 py-3 text-gray-600 hover:bg-blue-50 hover:text-blue-600 rounded-lg mt-1">
53
+ <i class="fas fa-book mr-3"></i>
54
+ <span class="font-medium">Courses</span>
55
+ </div>
56
+ <div class="flex items-center px-4 py-3 text-gray-600 hover:bg-blue-50 hover:text-blue-600 rounded-lg mt-1">
57
+ <i class="fas fa-chart-bar mr-3"></i>
58
+ <span class="font-medium">Progress</span>
59
+ </div>
60
+ <div class="flex items-center px-4 py-3 text-gray-600 hover:bg-blue-50 hover:text-blue-600 rounded-lg mt-1">
61
+ <i class="fas fa-trophy mr-3"></i>
62
+ <span class="font-medium">Achievements</span>
63
+ </div>
64
+ <div class="flex items-center px-4 py-3 text-gray-600 hover:bg-blue-50 hover:text-blue-600 rounded-lg mt-1">
65
+ <i class="fas fa-cog mr-3"></i>
66
+ <span class="font-medium">Settings</span>
67
+ </div>
68
+ </div>
69
+
70
+ <div class="absolute bottom-0 w-full px-4 py-6 border-t border-gray-200">
71
+ <div class="flex items-center">
72
+ <img class="h-10 w-10 rounded-full" src="https://randomuser.me/api/portraits/women/44.jpg" alt="Profile">
73
+ <div class="ml-3">
74
+ <p class="text-sm font-medium text-gray-700">Sarah Johnson</p>
75
+ <p class="text-xs text-gray-500">Senior Consultant</p>
76
+ </div>
77
+ </div>
78
+ </div>
79
+ </nav>
80
+ </div>
81
+
82
+ <!-- Main Content -->
83
+ <div class="md:ml-64">
84
+ <!-- Header -->
85
+ <header class="gradient-bg shadow-md">
86
+ <div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 lg:px-8 flex justify-between items-center">
87
+ <h1 class="text-2xl font-bold text-white">Learning Dashboard</h1>
88
+ <div class="relative">
89
+ <input type="text" placeholder="Search courses..." class="pl-10 pr-4 py-2 rounded-full text-sm focus:outline-none focus:ring-2 focus:ring-blue-300">
90
+ <i class="fas fa-search absolute left-3 top-2.5 text-gray-400"></i>
91
+ </div>
92
+ </div>
93
+ </header>
94
+
95
+ <!-- Main Content Area -->
96
+ <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
97
+ <!-- Welcome Banner -->
98
+ <div class="bg-white rounded-xl shadow-md overflow-hidden mb-8">
99
+ <div class="md:flex">
100
+ <div class="md:flex-shrink-0 gradient-bg md:w-1/3 flex items-center justify-center p-8">
101
+ <i class="fas fa-chart-line text-white text-6xl"></i>
102
+ </div>
103
+ <div class="p-8">
104
+ <div class="uppercase tracking-wide text-sm text-blue-600 font-semibold">Welcome back</div>
105
+ <h2 class="mt-2 text-2xl font-bold text-gray-800">Enhance your data consultancy skills</h2>
106
+ <p class="mt-2 text-gray-600">Complete courses, generate datasets, and tackle real-world challenges to level up your expertise in data platforms, algorithms, and analytics.</p>
107
+ <div class="mt-4">
108
+ <button class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition duration-300">
109
+ Continue Learning
110
+ </button>
111
+ </div>
112
+ </div>
113
+ </div>
114
+ </div>
115
+
116
+ <!-- Progress Overview -->
117
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
118
+ <div class="bg-white rounded-xl shadow-md p-6">
119
+ <div class="flex items-center justify-between">
120
+ <div>
121
+ <p class="text-gray-500">Courses Completed</p>
122
+ <h3 class="text-2xl font-bold mt-1">12</h3>
123
+ </div>
124
+ <div class="relative w-16 h-16">
125
+ <svg class="w-full h-full" viewBox="0 0 36 36">
126
+ <path
127
+ d="M18 2.0845
128
+ a 15.9155 15.9155 0 0 1 0 31.831
129
+ a 15.9155 15.9155 0 0 1 0 -31.831"
130
+ fill="none"
131
+ stroke="#e6e6e6"
132
+ stroke-width="3"
133
+ />
134
+ <path
135
+ class="progress-ring__circle"
136
+ d="M18 2.0845
137
+ a 15.9155 15.9155 0 0 1 0 31.831
138
+ a 15.9155 15.9155 0 0 1 0 -31.831"
139
+ fill="none"
140
+ stroke="#4f46e5"
141
+ stroke-width="3"
142
+ stroke-dasharray="75, 100"
143
+ />
144
+ </svg>
145
+ <div class="absolute inset-0 flex items-center justify-center">
146
+ <span class="text-sm font-bold text-blue-600">75%</span>
147
+ </div>
148
+ </div>
149
+ </div>
150
+ </div>
151
+ <div class="bg-white rounded-xl shadow-md p-6">
152
+ <div class="flex items-center justify-between">
153
+ <div>
154
+ <p class="text-gray-500">Current Level</p>
155
+ <h3 class="text-2xl font-bold mt-1">Advanced</h3>
156
+ </div>
157
+ <div class="text-blue-600 text-4xl">
158
+ <i class="fas fa-medal"></i>
159
+ </div>
160
+ </div>
161
+ </div>
162
+ <div class="bg-white rounded-xl shadow-md p-6">
163
+ <div class="flex items-center justify-between">
164
+ <div>
165
+ <p class="text-gray-500">Datasets Generated</p>
166
+ <h3 class="text-2xl font-bold mt-1">24</h3>
167
+ </div>
168
+ <div class="text-blue-600 text-4xl">
169
+ <i class="fas fa-database"></i>
170
+ </div>
171
+ </div>
172
+ </div>
173
+ </div>
174
+
175
+ <!-- Course Categories -->
176
+ <div class="mb-8">
177
+ <div class="flex justify-between items-center mb-4">
178
+ <h2 class="text-xl font-bold text-gray-800">Browse Learning Paths</h2>
179
+ <button class="text-blue-600 hover:text-blue-800 font-medium">View All</button>
180
+ </div>
181
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
182
+ <div class="course-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
183
+ <div class="gradient-bg p-6 text-white">
184
+ <i class="fas fa-chart-pie text-3xl mb-2"></i>
185
+ <h3 class="font-bold text-lg">Data Visualization</h3>
186
+ </div>
187
+ <div class="p-6">
188
+ <p class="text-gray-600 text-sm mb-4">Master PowerBI, Tableau and other visualization tools with real-world datasets.</p>
189
+ <div class="flex justify-between items-center">
190
+ <span class="text-xs font-medium text-blue-600">5 Courses</span>
191
+ <button class="text-blue-600 hover:text-blue-800 text-sm font-medium">Explore</button>
192
+ </div>
193
+ </div>
194
+ </div>
195
+ <div class="course-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
196
+ <div class="gradient-bg p-6 text-white">
197
+ <i class="fas fa-brain text-3xl mb-2"></i>
198
+ <h3 class="font-bold text-lg">Machine Learning</h3>
199
+ </div>
200
+ <div class="p-6">
201
+ <p class="text-gray-600 text-sm mb-4">Learn predictive modeling and algorithm implementation with practical challenges.</p>
202
+ <div class="flex justify-between items-center">
203
+ <span class="text-xs font-medium text-blue-600">8 Courses</span>
204
+ <button class="text-blue-600 hover:text-blue-800 text-sm font-medium">Explore</button>
205
+ </div>
206
+ </div>
207
+ </div>
208
+ <div class="course-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
209
+ <div class="gradient-bg p-6 text-white">
210
+ <i class="fas fa-broom text-3xl mb-2"></i>
211
+ <h3 class="font-bold text-lg">Data Quality</h3>
212
+ </div>
213
+ <div class="p-6">
214
+ <p class="text-gray-600 text-sm mb-4">Identify, clean and transform messy datasets into reliable sources.</p>
215
+ <div class="flex justify-between items-center">
216
+ <span class="text-xs font-medium text-blue-600">4 Courses</span>
217
+ <button class="text-blue-600 hover:text-blue-800 text-sm font-medium">Explore</button>
218
+ </div>
219
+ </div>
220
+ </div>
221
+ <div class="course-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
222
+ <div class="gradient-bg p-6 text-white">
223
+ <i class="fas fa-server text-3xl mb-2"></i>
224
+ <h3 class="font-bold text-lg">Data Platforms</h3>
225
+ </div>
226
+ <div class="p-6">
227
+ <p class="text-gray-600 text-sm mb-4">Understand modern data architectures and integration challenges.</p>
228
+ <div class="flex justify-between items-center">
229
+ <span class="text-xs font-medium text-blue-600">6 Courses</span>
230
+ <button class="text-blue-600 hover:text-blue-800 text-sm font-medium">Explore</button>
231
+ </div>
232
+ </div>
233
+ </div>
234
+ </div>
235
+ </div>
236
+
237
+ <!-- Dataset Generator -->
238
+ <div class="bg-white rounded-xl shadow-md overflow-hidden mb-8">
239
+ <div class="p-6 border-b border-gray-200">
240
+ <h2 class="text-xl font-bold text-gray-800">Custom Dataset Generator</h2>
241
+ <p class="text-gray-600 mt-1">Generate practice datasets tailored to your learning objectives and difficulty level.</p>
242
+ </div>
243
+ <div class="p-6">
244
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
245
+ <div>
246
+ <label class="block text-sm font-medium text-gray-700 mb-1">Learning Objective</label>
247
+ <select class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-300">
248
+ <option>Select objective</option>
249
+ <option>Data Visualization (PowerBI)</option>
250
+ <option>Predictive Modeling</option>
251
+ <option>Data Cleaning</option>
252
+ <option>Time Series Analysis</option>
253
+ <option>Anomaly Detection</option>
254
+ </select>
255
+ </div>
256
+ <div>
257
+ <label class="block text-sm font-medium text-gray-700 mb-1">Difficulty Level</label>
258
+ <select class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-300">
259
+ <option>Beginner</option>
260
+ <option selected>Intermediate</option>
261
+ <option>Advanced</option>
262
+ <option>Expert</option>
263
+ </select>
264
+ </div>
265
+ <div>
266
+ <label class="block text-sm font-medium text-gray-700 mb-1">Dataset Size</label>
267
+ <div class="flex items-center">
268
+ <input type="range" min="100" max="10000" value="1000" step="100" class="w-full mr-2">
269
+ <span class="text-sm font-medium">1,000 rows</span>
270
+ </div>
271
+ </div>
272
+ </div>
273
+ <div class="mt-6">
274
+ <label class="block text-sm font-medium text-gray-700 mb-1">Additional Parameters</label>
275
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
276
+ <div class="flex items-center">
277
+ <input type="checkbox" id="missingData" class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">
278
+ <label for="missingData" class="ml-2 block text-sm text-gray-700">Include missing data</label>
279
+ </div>
280
+ <div class="flex items-center">
281
+ <input type="checkbox" id="outliers" class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded" checked>
282
+ <label for="outliers" class="ml-2 block text-sm text-gray-700">Include outliers</label>
283
+ </div>
284
+ <div class="flex items-center">
285
+ <input type="checkbox" id="timeSeries" class="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded">
286
+ <label for="timeSeries" class="ml-2 block text-sm text-gray-700">Time series data</label>
287
+ </div>
288
+ </div>
289
+ </div>
290
+ <div class="mt-8 flex justify-center">
291
+ <button id="generateDataset" class="gradient-bg hover:opacity-90 text-white font-bold py-3 px-8 rounded-lg transition duration-300 flex items-center">
292
+ <i class="fas fa-download mr-2"></i> Generate Dataset (.CSV)
293
+ </button>
294
+ </div>
295
+ </div>
296
+ </div>
297
+
298
+ <!-- Recommended Courses -->
299
+ <div class="mb-8">
300
+ <div class="flex justify-between items-center mb-4">
301
+ <h2 class="text-xl font-bold text-gray-800">Recommended For You</h2>
302
+ <button class="text-blue-600 hover:text-blue-800 font-medium">View All</button>
303
+ </div>
304
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
305
+ <div class="bg-white rounded-xl shadow-md overflow-hidden">
306
+ <div class="p-4">
307
+ <div class="flex items-start">
308
+ <div class="gradient-bg p-3 rounded-lg text-white mr-4">
309
+ <i class="fas fa-chart-bar text-xl"></i>
310
+ </div>
311
+ <div>
312
+ <h3 class="font-bold text-gray-800">Advanced PowerBI Visualizations</h3>
313
+ <p class="text-gray-600 text-sm mt-1">Create interactive dashboards with complex datasets</p>
314
+ <div class="mt-3 flex items-center">
315
+ <div class="w-full bg-gray-200 rounded-full h-2">
316
+ <div class="bg-blue-600 h-2 rounded-full" style="width: 45%"></div>
317
+ </div>
318
+ <span class="text-xs text-gray-500 ml-2">45%</span>
319
+ </div>
320
+ </div>
321
+ </div>
322
+ </div>
323
+ </div>
324
+ <div class="bg-white rounded-xl shadow-md overflow-hidden">
325
+ <div class="p-4">
326
+ <div class="flex items-start">
327
+ <div class="gradient-bg p-3 rounded-lg text-white mr-4">
328
+ <i class="fas fa-project-diagram text-xl"></i>
329
+ </div>
330
+ <div>
331
+ <h3 class="font-bold text-gray-800">Data Pipeline Architecture</h3>
332
+ <p class="text-gray-600 text-sm mt-1">Designing robust ETL processes for large datasets</p>
333
+ <div class="mt-3 flex items-center">
334
+ <div class="w-full bg-gray-200 rounded-full h-2">
335
+ <div class="bg-blue-600 h-2 rounded-full" style="width: 20%"></div>
336
+ </div>
337
+ <span class="text-xs text-gray-500 ml-2">20%</span>
338
+ </div>
339
+ </div>
340
+ </div>
341
+ </div>
342
+ </div>
343
+ <div class="bg-white rounded-xl shadow-md overflow-hidden">
344
+ <div class="p-4">
345
+ <div class="flex items-start">
346
+ <div class="gradient-bg p-3 rounded-lg text-white mr-4">
347
+ <i class="fas fa-robot text-xl"></i>
348
+ </div>
349
+ <div>
350
+ <h3 class="font-bold text-gray-800">ML Model Deployment</h3>
351
+ <p class="text-gray-600 text-sm mt-1">Operationalizing machine learning models in production</p>
352
+ <div class="mt-3 flex items-center">
353
+ <div class="w-full bg-gray-200 rounded-full h-2">
354
+ <div class="bg-blue-600 h-2 rounded-full" style="width: 65%"></div>
355
+ </div>
356
+ <span class="text-xs text-gray-500 ml-2">65%</span>
357
+ </div>
358
+ </div>
359
+ </div>
360
+ </div>
361
+ </div>
362
+ </div>
363
+ </div>
364
+ </main>
365
+ </div>
366
+
367
+ <!-- Dataset Generation Modal -->
368
+ <div id="datasetModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
369
+ <div class="bg-white rounded-xl shadow-xl w-full max-w-md">
370
+ <div class="p-6">
371
+ <div class="flex justify-between items-center mb-4">
372
+ <h3 class="text-xl font-bold text-gray-800">Dataset Generated!</h3>
373
+ <button id="closeModal" class="text-gray-500 hover:text-gray-700">
374
+ <i class="fas fa-times"></i>
375
+ </button>
376
+ </div>
377
+ <div class="text-center py-6">
378
+ <div class="text-green-500 text-5xl mb-4">
379
+ <i class="fas fa-check-circle"></i>
380
+ </div>
381
+ <p class="text-gray-600 mb-6">Your custom dataset has been successfully generated and is ready for download.</p>
382
+ <div class="bg-gray-100 p-4 rounded-lg mb-6">
383
+ <div class="flex justify-between text-sm text-gray-600 mb-2">
384
+ <span>Rows:</span>
385
+ <span class="font-medium">1,000</span>
386
+ </div>
387
+ <div class="flex justify-between text-sm text-gray-600 mb-2">
388
+ <span>Columns:</span>
389
+ <span class="font-medium">12</span>
390
+ </div>
391
+ <div class="flex justify-between text-sm text-gray-600">
392
+ <span>Difficulty:</span>
393
+ <span class="font-medium">Intermediate</span>
394
+ </div>
395
+ </div>
396
+ <button class="gradient-bg hover:opacity-90 text-white font-bold py-3 px-8 rounded-lg transition duration-300 w-full">
397
+ <i class="fas fa-download mr-2"></i> Download Dataset
398
+ </button>
399
+ </div>
400
+ </div>
401
+ </div>
402
+ </div>
403
+
404
+ <script>
405
+ // Mobile menu toggle
406
+ document.getElementById('menuToggle').addEventListener('click', function() {
407
+ document.getElementById('sidebar').classList.toggle('open');
408
+ });
409
+
410
+ // Dataset generation
411
+ document.getElementById('generateDataset').addEventListener('click', function() {
412
+ document.getElementById('datasetModal').classList.remove('hidden');
413
+ });
414
+
415
+ // Close modal
416
+ document.getElementById('closeModal').addEventListener('click', function() {
417
+ document.getElementById('datasetModal').classList.add('hidden');
418
+ });
419
+
420
+ // Close modal when clicking outside
421
+ document.getElementById('datasetModal').addEventListener('click', function(e) {
422
+ if (e.target === this) {
423
+ this.classList.add('hidden');
424
+ }
425
+ });
426
+
427
+ // Simulate generating CSV data (in a real app, this would be server-side)
428
+ function generateCSV() {
429
+ const headers = ["ID", "Date", "Product", "Region", "Sales", "Profit", "Customer", "Rating", "Returns", "Discount", "Category", "Subcategory"];
430
+ let csv = headers.join(",") + "\n";
431
+
432
+ for (let i = 1; i <= 1000; i++) {
433
+ const row = [
434
+ i,
435
+ `2023-${Math.floor(Math.random() * 12) + 1}-${Math.floor(Math.random() * 28) + 1}`,
436
+ `Product ${String.fromCharCode(65 + Math.floor(Math.random() * 5))}`,
437
+ ["North", "South", "East", "West"][Math.floor(Math.random() * 4)],
438
+ (Math.random() * 10000).toFixed(2),
439
+ (Math.random() * 2000).toFixed(2),
440
+ `Customer ${Math.floor(Math.random() * 500) + 1}`,
441
+ (Math.random() * 5).toFixed(1),
442
+ Math.random() > 0.9 ? "Yes" : "No",
443
+ Math.random() > 0.7 ? (Math.random() * 30).toFixed(0) + "%" : "0%",
444
+ ["Electronics", "Furniture", "Office Supplies"][Math.floor(Math.random() * 3)],
445
+ ["Phones", "Chairs", "Paper", "Computers"][Math.floor(Math.random() * 4)]
446
+ ];
447
+ csv += row.join(",") + "\n";
448
+ }
449
+ return csv;
450
+ }
451
+
452
+ // Download CSV when clicking download button in modal
453
+ document.querySelector('#datasetModal button').addEventListener('click', function() {
454
+ const csv = generateCSV();
455
+ const blob = new Blob([csv], { type: 'text/csv' });
456
+ const url = URL.createObjectURL(blob);
457
+
458
+ const a = document.createElement('a');
459
+ a.setAttribute('hidden', '');
460
+ a.setAttribute('href', url);
461
+ a.setAttribute('download', 'custom_dataset.csv');
462
+ document.body.appendChild(a);
463
+ a.click();
464
+ document.body.removeChild(a);
465
+
466
+ document.getElementById('datasetModal').classList.add('hidden');
467
+ });
468
+ </script>
469
+ <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=basmeinen/leerplatform" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
470
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Build a learning platform for my consultancy firm. It has to educate my colleagues about the difficulties they will encounter when working with data sets, data platforms, algorithms and other problems they will encounter. Based on the objectives they can generate a .csv file containing a dataset where they can work with. With this data set they need to do objectives like visualisation in powerBI, predict stuff, look for data quality and so on. I need different levels of difficulty based on the level of the consultant