adsrocha commited on
Commit
3d8def5
·
verified ·
1 Parent(s): e78e20f

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +919 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Studyflow
3
- emoji: 😻
4
- colorFrom: indigo
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: studyflow
3
+ emoji: 🐳
4
+ colorFrom: gray
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,919 @@
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="pt-BR">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>StudyFlow - Seu Gerenciador de Estudos Inteligente</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, #667eea 0%, #764ba2 100%);
12
+ }
13
+ .pomodoro-timer {
14
+ box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
15
+ }
16
+ .timer-progress {
17
+ stroke-dasharray: 628;
18
+ stroke-dashoffset: 628;
19
+ transform: rotate(-90deg);
20
+ transform-origin: 50% 50%;
21
+ }
22
+ .tab-active {
23
+ border-bottom: 3px solid #667eea;
24
+ color: #667eea;
25
+ font-weight: 600;
26
+ }
27
+ .session-card:hover {
28
+ transform: translateY(-2px);
29
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
30
+ }
31
+ .cycle-item:hover {
32
+ background-color: #f8fafc;
33
+ }
34
+ </style>
35
+ </head>
36
+ <body class="bg-gray-50 min-h-screen font-sans">
37
+ <!-- Header -->
38
+ <header class="gradient-bg text-white shadow-lg">
39
+ <div class="container mx-auto px-4 py-6">
40
+ <div class="flex justify-between items-center">
41
+ <div class="flex items-center space-x-2">
42
+ <i class="fas fa-book-open text-2xl"></i>
43
+ <h1 class="text-2xl font-bold">StudyFlow</h1>
44
+ </div>
45
+ <nav class="hidden md:flex space-x-6">
46
+ <a href="#" class="hover:text-gray-200 transition" id="dashboard-tab">Dashboard</a>
47
+ <a href="#" class="hover:text-gray-200 transition" id="history-tab">Histórico</a>
48
+ <a href="#" class="hover:text-gray-200 transition" id="cycles-tab">Ciclos</a>
49
+ <a href="#" class="hover:text-gray-200 transition" id="stats-tab">Estatísticas</a>
50
+ </nav>
51
+ <div class="flex items-center space-x-4">
52
+ <button class="bg-white text-indigo-700 px-4 py-2 rounded-full font-medium hover:bg-indigo-50 transition">
53
+ <i class="fas fa-user mr-2"></i>Perfil
54
+ </button>
55
+ <button class="md:hidden text-white" id="mobile-menu-button">
56
+ <i class="fas fa-bars text-2xl"></i>
57
+ </button>
58
+ </div>
59
+ </div>
60
+ </div>
61
+ </header>
62
+
63
+ <!-- Mobile Menu -->
64
+ <div class="md:hidden hidden bg-white shadow-lg" id="mobile-menu">
65
+ <div class="container mx-auto px-4 py-2 flex flex-col">
66
+ <a href="#" class="py-3 border-b border-gray-100" id="mobile-dashboard-tab">Dashboard</a>
67
+ <a href="#" class="py-3 border-b border-gray-100" id="mobile-history-tab">Histórico</a>
68
+ <a href="#" class="py-3 border-b border-gray-100" id="mobile-cycles-tab">Ciclos</a>
69
+ <a href="#" class="py-3" id="mobile-stats-tab">Estatísticas</a>
70
+ </div>
71
+ </div>
72
+
73
+ <!-- Main Content -->
74
+ <main class="container mx-auto px-4 py-8">
75
+ <!-- Dashboard Section -->
76
+ <section id="dashboard-section">
77
+ <div class="flex flex-col lg:flex-row gap-8">
78
+ <!-- Pomodoro Timer -->
79
+ <div class="lg:w-1/3">
80
+ <div class="bg-white rounded-xl pomodoro-timer p-6">
81
+ <h2 class="text-xl font-bold text-gray-800 mb-4">Pomodoro Timer</h2>
82
+ <div class="flex justify-center mb-6">
83
+ <div class="relative w-64 h-64">
84
+ <svg class="w-full h-full" viewBox="0 0 200 200">
85
+ <circle cx="100" cy="100" r="90" fill="none" stroke="#e2e8f0" stroke-width="10"/>
86
+ <circle id="progress-circle" cx="100" cy="100" r="90" fill="none" stroke="#667eea" stroke-width="10" stroke-linecap="round" class="timer-progress"/>
87
+ </svg>
88
+ <div class="absolute inset-0 flex flex-col items-center justify-center">
89
+ <div id="time-display" class="text-4xl font-bold text-gray-800">25:00</div>
90
+ <div id="timer-state" class="text-gray-500">Pronto para começar</div>
91
+ </div>
92
+ </div>
93
+ </div>
94
+ <div class="flex justify-center space-x-4 mb-6">
95
+ <button id="pomodoro-btn" class="px-4 py-2 bg-indigo-100 text-indigo-700 rounded-full font-medium">Pomodoro</button>
96
+ <button id="short-break-btn" class="px-4 py-2 bg-gray-100 text-gray-700 rounded-full font-medium">Pausa Curta</button>
97
+ <button id="long-break-btn" class="px-4 py-2 bg-gray-100 text-gray-700 rounded-full font-medium">Pausa Longa</button>
98
+ </div>
99
+ <div class="flex justify-center">
100
+ <button id="start-stop-btn" class="px-8 py-3 bg-indigo-600 text-white rounded-full font-medium hover:bg-indigo-700 transition">
101
+ <i class="fas fa-play mr-2"></i>Começar
102
+ </button>
103
+ </div>
104
+ </div>
105
+
106
+ <!-- Current Task -->
107
+ <div class="bg-white rounded-xl shadow-md p-6 mt-6">
108
+ <h2 class="text-xl font-bold text-gray-800 mb-4">Tarefa Atual</h2>
109
+ <div class="flex items-center mb-4">
110
+ <input type="text" id="current-task" placeholder="O que você está estudando?" class="flex-1 border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500">
111
+ <button id="add-task-btn" class="ml-2 bg-indigo-600 text-white p-2 rounded-lg hover:bg-indigo-700 transition">
112
+ <i class="fas fa-plus"></i>
113
+ </button>
114
+ </div>
115
+ <div id="task-list" class="space-y-2">
116
+ <div class="flex items-center justify-between bg-gray-50 p-3 rounded-lg">
117
+ <div class="flex items-center">
118
+ <input type="checkbox" class="h-5 w-5 text-indigo-600 rounded">
119
+ <span class="ml-3 text-gray-700">Revisão de Matemática</span>
120
+ </div>
121
+ <button class="text-gray-400 hover:text-red-500">
122
+ <i class="fas fa-trash"></i>
123
+ </button>
124
+ </div>
125
+ </div>
126
+ </div>
127
+ </div>
128
+
129
+ <!-- Stats and Recent Sessions -->
130
+ <div class="lg:w-2/3">
131
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
132
+ <div class="bg-white rounded-xl shadow-md p-6">
133
+ <div class="flex items-center">
134
+ <div class="p-3 rounded-full bg-indigo-100 text-indigo-600 mr-4">
135
+ <i class="fas fa-clock text-xl"></i>
136
+ </div>
137
+ <div>
138
+ <div class="text-gray-500">Tempo Hoje</div>
139
+ <div class="text-2xl font-bold">2h 45m</div>
140
+ </div>
141
+ </div>
142
+ </div>
143
+ <div class="bg-white rounded-xl shadow-md p-6">
144
+ <div class="flex items-center">
145
+ <div class="p-3 rounded-full bg-green-100 text-green-600 mr-4">
146
+ <i class="fas fa-check-circle text-xl"></i>
147
+ </div>
148
+ <div>
149
+ <div class="text-gray-500">Pomodoros</div>
150
+ <div class="text-2xl font-bold">5</div>
151
+ </div>
152
+ </div>
153
+ </div>
154
+ <div class="bg-white rounded-xl shadow-md p-6">
155
+ <div class="flex items-center">
156
+ <div class="p-3 rounded-full bg-blue-100 text-blue-600 mr-4">
157
+ <i class="fas fa-fire text-xl"></i>
158
+ </div>
159
+ <div>
160
+ <div class="text-gray-500">Dias Consecutivos</div>
161
+ <div class="text-2xl font-bold">12</div>
162
+ </div>
163
+ </div>
164
+ </div>
165
+ </div>
166
+
167
+ <!-- Active Study Cycle -->
168
+ <div class="bg-white rounded-xl shadow-md p-6 mb-8">
169
+ <div class="flex justify-between items-center mb-4">
170
+ <h2 class="text-xl font-bold text-gray-800">Ciclo Ativo</h2>
171
+ <button class="text-indigo-600 hover:text-indigo-800 font-medium">Ver Todos</button>
172
+ </div>
173
+ <div class="bg-indigo-50 rounded-lg p-4">
174
+ <div class="flex justify-between items-center mb-2">
175
+ <h3 class="font-semibold text-indigo-800">Preparação para ENEM</h3>
176
+ <span class="bg-indigo-100 text-indigo-800 text-xs px-2 py-1 rounded-full">70% completo</span>
177
+ </div>
178
+ <p class="text-gray-600 text-sm mb-3">Ciclo de estudos focado nas matérias do ENEM com revisões semanais.</p>
179
+ <div class="w-full bg-gray-200 rounded-full h-2">
180
+ <div class="bg-indigo-600 h-2 rounded-full" style="width: 70%"></div>
181
+ </div>
182
+ </div>
183
+ </div>
184
+
185
+ <!-- Recent Sessions -->
186
+ <div class="bg-white rounded-xl shadow-md p-6">
187
+ <div class="flex justify-between items-center mb-4">
188
+ <h2 class="text-xl font-bold text-gray-800">Sessões Recentes</h2>
189
+ <button class="text-indigo-600 hover:text-indigo-800 font-medium">Ver Histórico Completo</button>
190
+ </div>
191
+ <div class="space-y-4">
192
+ <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg session-card transition">
193
+ <div class="flex items-center">
194
+ <div class="p-2 bg-indigo-100 rounded-lg text-indigo-600 mr-3">
195
+ <i class="fas fa-book"></i>
196
+ </div>
197
+ <div>
198
+ <div class="font-medium">Matemática</div>
199
+ <div class="text-sm text-gray-500">25/06/2023 - 25 minutos</div>
200
+ </div>
201
+ </div>
202
+ <div class="text-sm text-gray-500">Pomodoro #1</div>
203
+ </div>
204
+ <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg session-card transition">
205
+ <div class="flex items-center">
206
+ <div class="p-2 bg-green-100 rounded-lg text-green-600 mr-3">
207
+ <i class="fas fa-coffee"></i>
208
+ </div>
209
+ <div>
210
+ <div class="font-medium">Pausa Curta</div>
211
+ <div class="text-sm text-gray-500">25/06/2023 - 5 minutos</div>
212
+ </div>
213
+ </div>
214
+ <div class="text-sm text-gray-500">Descanso</div>
215
+ </div>
216
+ </div>
217
+ </div>
218
+ </div>
219
+ </div>
220
+ </section>
221
+
222
+ <!-- History Section -->
223
+ <section id="history-section" class="hidden">
224
+ <div class="bg-white rounded-xl shadow-md p-6">
225
+ <div class="flex justify-between items-center mb-6">
226
+ <h2 class="text-2xl font-bold text-gray-800">Histórico de Sessões</h2>
227
+ <div class="flex space-x-2">
228
+ <select class="border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500">
229
+ <option>Filtrar por</option>
230
+ <option>Esta semana</option>
231
+ <option>Este mês</option>
232
+ <option>Últimos 3 meses</option>
233
+ </select>
234
+ <button class="bg-indigo-600 text-white px-4 py-2 rounded-lg hover:bg-indigo-700 transition">
235
+ <i class="fas fa-download mr-2"></i>Exportar
236
+ </button>
237
+ </div>
238
+ </div>
239
+
240
+ <div class="overflow-x-auto">
241
+ <table class="min-w-full divide-y divide-gray-200">
242
+ <thead class="bg-gray-50">
243
+ <tr>
244
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Data</th>
245
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tipo</th>
246
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Duração</th>
247
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Tarefa</th>
248
+ <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Ciclo</th>
249
+ </tr>
250
+ </thead>
251
+ <tbody class="bg-white divide-y divide-gray-200">
252
+ <tr class="hover:bg-gray-50">
253
+ <td class="px-6 py-4 whitespace-nowrap">25/06/2023</td>
254
+ <td class="px-6 py-4 whitespace-nowrap">
255
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-indigo-100 text-indigo-800">Pomodoro</span>
256
+ </td>
257
+ <td class="px-6 py-4 whitespace-nowrap">25 minutos</td>
258
+ <td class="px-6 py-4 whitespace-nowrap">Revisão de Matemática</td>
259
+ <td class="px-6 py-4 whitespace-nowrap">Preparação ENEM</td>
260
+ </tr>
261
+ <tr class="hover:bg-gray-50">
262
+ <td class="px-6 py-4 whitespace-nowrap">25/06/2023</td>
263
+ <td class="px-6 py-4 whitespace-nowrap">
264
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Pausa</span>
265
+ </td>
266
+ <td class="px-6 py-4 whitespace-nowrap">5 minutos</td>
267
+ <td class="px-6 py-4 whitespace-nowrap">-</td>
268
+ <td class="px-6 py-4 whitespace-nowrap">-</td>
269
+ </tr>
270
+ <tr class="hover:bg-gray-50">
271
+ <td class="px-6 py-4 whitespace-nowrap">24/06/2023</td>
272
+ <td class="px-6 py-4 whitespace-nowrap">
273
+ <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-indigo-100 text-indigo-800">Pomodoro</span>
274
+ </td>
275
+ <td class="px-6 py-4 whitespace-nowrap">25 minutos</td>
276
+ <td class="px-6 py-4 whitespace-nowrap">Redação ENEM</td>
277
+ <td class="px-6 py-4 whitespace-nowrap">Preparação ENEM</td>
278
+ </tr>
279
+ </tbody>
280
+ </table>
281
+ </div>
282
+
283
+ <div class="flex justify-between items-center mt-6">
284
+ <div class="text-sm text-gray-500">Mostrando 1 a 3 de 15 registros</div>
285
+ <div class="flex space-x-2">
286
+ <button class="px-3 py-1 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50">Anterior</button>
287
+ <button class="px-3 py-1 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700">1</button>
288
+ <button class="px-3 py-1 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50">2</button>
289
+ <button class="px-3 py-1 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50">Próximo</button>
290
+ </div>
291
+ </div>
292
+ </div>
293
+ </section>
294
+
295
+ <!-- Study Cycles Section -->
296
+ <section id="cycles-section" class="hidden">
297
+ <div class="flex justify-between items-center mb-6">
298
+ <h2 class="text-2xl font-bold text-gray-800">Meus Ciclos de Estudo</h2>
299
+ <button id="new-cycle-btn" class="bg-indigo-600 text-white px-4 py-2 rounded-lg hover:bg-indigo-700 transition">
300
+ <i class="fas fa-plus mr-2"></i>Novo Ciclo
301
+ </button>
302
+ </div>
303
+
304
+ <!-- New Cycle Modal -->
305
+ <div id="new-cycle-modal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
306
+ <div class="bg-white rounded-xl p-6 w-full max-w-md">
307
+ <div class="flex justify-between items-center mb-4">
308
+ <h3 class="text-xl font-bold text-gray-800">Criar Novo Ciclo</h3>
309
+ <button id="close-cycle-modal" class="text-gray-500 hover:text-gray-700">
310
+ <i class="fas fa-times"></i>
311
+ </button>
312
+ </div>
313
+ <form id="cycle-form">
314
+ <div class="mb-4">
315
+ <label for="cycle-name" class="block text-sm font-medium text-gray-700 mb-1">Nome do Ciclo</label>
316
+ <input type="text" id="cycle-name" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500" placeholder="Ex: Preparação para ENEM">
317
+ </div>
318
+ <div class="mb-4">
319
+ <label for="cycle-duration" class="block text-sm font-medium text-gray-700 mb-1">Duração (semanas)</label>
320
+ <input type="number" id="cycle-duration" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500" min="1" value="4">
321
+ </div>
322
+ <div class="mb-4">
323
+ <label for="cycle-description" class="block text-sm font-medium text-gray-700 mb-1">Descrição</label>
324
+ <textarea id="cycle-description" rows="3" class="w-full border border-gray-300 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500" placeholder="Objetivos e detalhes do ciclo..."></textarea>
325
+ </div>
326
+ <div class="flex justify-end space-x-3">
327
+ <button type="button" id="cancel-cycle" class="px-4 py-2 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50">Cancelar</button>
328
+ <button type="submit" class="px-4 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700">Criar Ciclo</button>
329
+ </div>
330
+ </form>
331
+ </div>
332
+ </div>
333
+
334
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
335
+ <div class="bg-white rounded-xl shadow-md overflow-hidden cycle-item transition">
336
+ <div class="p-6">
337
+ <div class="flex justify-between items-start mb-2">
338
+ <h3 class="text-lg font-semibold text-gray-800">Preparação para ENEM</h3>
339
+ <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded-full">Ativo</span>
340
+ </div>
341
+ <p class="text-gray-600 text-sm mb-4">Ciclo de estudos focado nas matérias do ENEM com revisões semanais.</p>
342
+ <div class="flex justify-between items-center text-sm">
343
+ <div>
344
+ <div class="text-gray-500">Progresso</div>
345
+ <div class="font-medium">70%</div>
346
+ </div>
347
+ <div>
348
+ <div class="text-gray-500">Tempo</div>
349
+ <div class="font-medium">12h 30m</div>
350
+ </div>
351
+ <div>
352
+ <div class="text-gray-500">Sessões</div>
353
+ <div class="font-medium">15</div>
354
+ </div>
355
+ </div>
356
+ </div>
357
+ <div class="px-6 pb-4">
358
+ <div class="w-full bg-gray-200 rounded-full h-2">
359
+ <div class="bg-indigo-600 h-2 rounded-full" style="width: 70%"></div>
360
+ </div>
361
+ </div>
362
+ <div class="border-t border-gray-100 px-6 py-3 bg-gray-50 flex justify-between">
363
+ <span class="text-sm text-gray-500">Iniciado em: 10/06/2023</span>
364
+ <div class="flex space-x-2">
365
+ <button class="text-indigo-600 hover:text-indigo-800 text-sm font-medium">Editar</button>
366
+ <button class="text-red-600 hover:text-red-800 text-sm font-medium">Excluir</button>
367
+ </div>
368
+ </div>
369
+ </div>
370
+
371
+ <div class="bg-white rounded-xl shadow-md overflow-hidden cycle-item transition">
372
+ <div class="p-6">
373
+ <div class="flex justify-between items-start mb-2">
374
+ <h3 class="text-lg font-semibold text-gray-800">Vestibular Medicina</h3>
375
+ <span class="bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded-full">Pausado</span>
376
+ </div>
377
+ <p class="text-gray-600 text-sm mb-4">Ciclo intensivo para vestibular de medicina com foco em biologia e química.</p>
378
+ <div class="flex justify-between items-center text-sm">
379
+ <div>
380
+ <div class="text-gray-500">Progresso</div>
381
+ <div class="font-medium">45%</div>
382
+ </div>
383
+ <div>
384
+ <div class="text-gray-500">Tempo</div>
385
+ <div class="font-medium">8h 15m</div>
386
+ </div>
387
+ <div>
388
+ <div class="text-gray-500">Sessões</div>
389
+ <div class="font-medium">10</div>
390
+ </div>
391
+ </div>
392
+ </div>
393
+ <div class="px-6 pb-4">
394
+ <div class="w-full bg-gray-200 rounded-full h-2">
395
+ <div class="bg-yellow-500 h-2 rounded-full" style="width: 45%"></div>
396
+ </div>
397
+ </div>
398
+ <div class="border-t border-gray-100 px-6 py-3 bg-gray-50 flex justify-between">
399
+ <span class="text-sm text-gray-500">Iniciado em: 01/05/2023</span>
400
+ <div class="flex space-x-2">
401
+ <button class="text-indigo-600 hover:text-indigo-800 text-sm font-medium">Editar</button>
402
+ <button class="text-red-600 hover:text-red-800 text-sm font-medium">Excluir</button>
403
+ </div>
404
+ </div>
405
+ </div>
406
+
407
+ <div class="bg-white rounded-xl shadow-md overflow-hidden cycle-item transition">
408
+ <div class="p-6">
409
+ <div class="flex justify-between items-start mb-2">
410
+ <h3 class="text-lg font-semibold text-gray-800">Certificação TI</h3>
411
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded-full">Completo</span>
412
+ </div>
413
+ <p class="text-gray-600 text-sm mb-4">Preparação para certificação em redes e infraestrutura de TI.</p>
414
+ <div class="flex justify-between items-center text-sm">
415
+ <div>
416
+ <div class="text-gray-500">Progresso</div>
417
+ <div class="font-medium">100%</div>
418
+ </div>
419
+ <div>
420
+ <div class="text-gray-500">Tempo</div>
421
+ <div class="font-medium">25h 40m</div>
422
+ </div>
423
+ <div>
424
+ <div class="text-gray-500">Sessões</div>
425
+ <div class="font-medium">32</div>
426
+ </div>
427
+ </div>
428
+ </div>
429
+ <div class="px-6 pb-4">
430
+ <div class="w-full bg-gray-200 rounded-full h-2">
431
+ <div class="bg-green-500 h-2 rounded-full" style="width: 100%"></div>
432
+ </div>
433
+ </div>
434
+ <div class="border-t border-gray-100 px-6 py-3 bg-gray-50 flex justify-between">
435
+ <span class="text-sm text-gray-500">Concluído em: 15/04/2023</span>
436
+ <div class="flex space-x-2">
437
+ <button class="text-indigo-600 hover:text-indigo-800 text-sm font-medium">Ver</button>
438
+ <button class="text-red-600 hover:text-red-800 text-sm font-medium">Excluir</button>
439
+ </div>
440
+ </div>
441
+ </div>
442
+ </div>
443
+ </section>
444
+
445
+ <!-- Statistics Section -->
446
+ <section id="stats-section" class="hidden">
447
+ <div class="bg-white rounded-xl shadow-md p-6 mb-8">
448
+ <h2 class="text-2xl font-bold text-gray-800 mb-6">Estatísticas de Estudo</h2>
449
+
450
+ <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
451
+ <div>
452
+ <h3 class="text-lg font-semibold text-gray-800 mb-4">Tempo por Dia (últimos 7 dias)</h3>
453
+ <div class="h-64">
454
+ <canvas id="daily-time-chart"></canvas>
455
+ </div>
456
+ </div>
457
+ <div>
458
+ <h3 class="text-lg font-semibold text-gray-800 mb-4">Distribuição por Matéria</h3>
459
+ <div class="h-64">
460
+ <canvas id="subject-distribution-chart"></canvas>
461
+ </div>
462
+ </div>
463
+ </div>
464
+
465
+ <div class="mt-8">
466
+ <h3 class="text-lg font-semibold text-gray-800 mb-4">Produtividade Semanal</h3>
467
+ <div class="h-96">
468
+ <canvas id="productivity-chart"></canvas>
469
+ </div>
470
+ </div>
471
+ </div>
472
+
473
+ <div class="bg-white rounded-xl shadow-md p-6">
474
+ <h3 class="text-lg font-semibold text-gray-800 mb-4">Metas</h3>
475
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
476
+ <div class="border border-gray-200 rounded-lg p-4">
477
+ <div class="flex justify-between items-center mb-2">
478
+ <div class="font-medium">Pomodoros Semanais</div>
479
+ <div class="text-sm text-gray-500">15/20</div>
480
+ </div>
481
+ <div class="w-full bg-gray-200 rounded-full h-2">
482
+ <div class="bg-indigo-600 h-2 rounded-full" style="width: 75%"></div>
483
+ </div>
484
+ </div>
485
+ <div class="border border-gray-200 rounded-lg p-4">
486
+ <div class="flex justify-between items-center mb-2">
487
+ <div class="font-medium">Horas Semanais</div>
488
+ <div class="text-sm text-gray-500">8h/10h</div>
489
+ </div>
490
+ <div class="w-full bg-gray-200 rounded-full h-2">
491
+ <div class="bg-green-500 h-2 rounded-full" style="width: 80%"></div>
492
+ </div>
493
+ </div>
494
+ <div class="border border-gray-200 rounded-lg p-4">
495
+ <div class="flex justify-between items-center mb-2">
496
+ <div class="font-medium">Dias Consecutivos</div>
497
+ <div class="text-sm text-gray-500">12/30</div>
498
+ </div>
499
+ <div class="w-full bg-gray-200 rounded-full h-2">
500
+ <div class="bg-yellow-500 h-2 rounded-full" style="width: 40%"></div>
501
+ </div>
502
+ </div>
503
+ </div>
504
+ </div>
505
+ </section>
506
+ </main>
507
+
508
+ <!-- Footer -->
509
+ <footer class="bg-gray-100 border-t border-gray-200 mt-12">
510
+ <div class="container mx-auto px-4 py-8">
511
+ <div class="flex flex-col md:flex-row justify-between items-center">
512
+ <div class="flex items-center space-x-2 mb-4 md:mb-0">
513
+ <i class="fas fa-book-open text-xl text-indigo-600"></i>
514
+ <span class="text-lg font-semibold">StudyFlow</span>
515
+ </div>
516
+ <div class="flex space-x-6">
517
+ <a href="#" class="text-gray-600 hover:text-indigo-600">Termos</a>
518
+ <a href="#" class="text-gray-600 hover:text-indigo-600">Privacidade</a>
519
+ <a href="#" class="text-gray-600 hover:text-indigo-600">Contato</a>
520
+ </div>
521
+ </div>
522
+ <div class="mt-6 text-center md:text-left text-sm text-gray-500">
523
+ © 2023 StudyFlow. Todos os direitos reservados.
524
+ </div>
525
+ </div>
526
+ </footer>
527
+
528
+ <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
529
+ <script>
530
+ // Tab Navigation
531
+ const sections = {
532
+ 'dashboard': document.getElementById('dashboard-section'),
533
+ 'history': document.getElementById('history-section'),
534
+ 'cycles': document.getElementById('cycles-section'),
535
+ 'stats': document.getElementById('stats-section')
536
+ };
537
+
538
+ const tabs = {
539
+ 'dashboard': [
540
+ document.getElementById('dashboard-tab'),
541
+ document.getElementById('mobile-dashboard-tab')
542
+ ],
543
+ 'history': [
544
+ document.getElementById('history-tab'),
545
+ document.getElementById('mobile-history-tab')
546
+ ],
547
+ 'cycles': [
548
+ document.getElementById('cycles-tab'),
549
+ document.getElementById('mobile-cycles-tab')
550
+ ],
551
+ 'stats': [
552
+ document.getElementById('stats-tab'),
553
+ document.getElementById('mobile-stats-tab')
554
+ ]
555
+ };
556
+
557
+ function showSection(sectionId) {
558
+ // Hide all sections
559
+ Object.values(sections).forEach(section => {
560
+ section.classList.add('hidden');
561
+ });
562
+
563
+ // Show selected section
564
+ sections[sectionId].classList.remove('hidden');
565
+
566
+ // Update tab styling
567
+ Object.entries(tabs).forEach(([key, tabElements]) => {
568
+ tabElements.forEach(tab => {
569
+ if (key === sectionId) {
570
+ tab.classList.add('tab-active');
571
+ } else {
572
+ tab.classList.remove('tab-active');
573
+ }
574
+ });
575
+ });
576
+ }
577
+
578
+ // Add event listeners to all tabs
579
+ Object.entries(tabs).forEach(([sectionId, tabElements]) => {
580
+ tabElements.forEach(tab => {
581
+ tab.addEventListener('click', (e) => {
582
+ e.preventDefault();
583
+ showSection(sectionId);
584
+ });
585
+ });
586
+ });
587
+
588
+ // Mobile menu toggle
589
+ const mobileMenuButton = document.getElementById('mobile-menu-button');
590
+ const mobileMenu = document.getElementById('mobile-menu');
591
+
592
+ mobileMenuButton.addEventListener('click', () => {
593
+ mobileMenu.classList.toggle('hidden');
594
+ });
595
+
596
+ // Pomodoro Timer Logic
597
+ const timerDisplay = document.getElementById('time-display');
598
+ const timerState = document.getElementById('timer-state');
599
+ const startStopBtn = document.getElementById('start-stop-btn');
600
+ const progressCircle = document.getElementById('progress-circle');
601
+
602
+ const pomodoroBtn = document.getElementById('pomodoro-btn');
603
+ const shortBreakBtn = document.getElementById('short-break-btn');
604
+ const longBreakBtn = document.getElementById('long-break-btn');
605
+
606
+ let timerInterval;
607
+ let isRunning = false;
608
+ let currentMode = 'pomodoro'; // 'pomodoro', 'shortBreak', 'longBreak'
609
+ let timeLeft = 25 * 60; // 25 minutes in seconds
610
+
611
+ const modes = {
612
+ pomodoro: { duration: 25 * 60, color: 'indigo' },
613
+ shortBreak: { duration: 5 * 60, color: 'green' },
614
+ longBreak: { duration: 15 * 60, color: 'blue' }
615
+ };
616
+
617
+ function updateDisplay() {
618
+ const minutes = Math.floor(timeLeft / 60);
619
+ const seconds = timeLeft % 60;
620
+ timerDisplay.textContent = `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
621
+
622
+ // Update progress circle
623
+ const mode = modes[currentMode];
624
+ const progress = 628 - (timeLeft / mode.duration * 628);
625
+ progressCircle.style.strokeDashoffset = progress;
626
+ progressCircle.style.stroke = `#${currentMode === 'pomodoro' ? '667eea' : currentMode === 'shortBreak' ? '10b981' : '3b82f6'}`;
627
+ }
628
+
629
+ function startTimer() {
630
+ if (timerInterval) clearInterval(timerInterval);
631
+
632
+ isRunning = true;
633
+ startStopBtn.innerHTML = '<i class="fas fa-pause mr-2"></i>Pausar';
634
+ startStopBtn.classList.remove('bg-indigo-600');
635
+ startStopBtn.classList.add('bg-yellow-500');
636
+
637
+ timerState.textContent = currentMode === 'pomodoro' ? 'Foco no estudo!' : 'Hora de descansar';
638
+
639
+ timerInterval = setInterval(() => {
640
+ timeLeft--;
641
+ updateDisplay();
642
+
643
+ if (timeLeft <= 0) {
644
+ clearInterval(timerInterval);
645
+ timerComplete();
646
+ }
647
+ }, 1000);
648
+ }
649
+
650
+ function stopTimer() {
651
+ clearInterval(timerInterval);
652
+ isRunning = false;
653
+ startStopBtn.innerHTML = '<i class="fas fa-play mr-2"></i>Começar';
654
+ startStopBtn.classList.remove('bg-yellow-500');
655
+ startStopBtn.classList.add('bg-indigo-600');
656
+ timerState.textContent = 'Pausado';
657
+ }
658
+
659
+ function timerComplete() {
660
+ // Play sound
661
+ const audio = new Audio('https://assets.mixkit.co/sfx/preview/mixkit-alarm-digital-clock-beep-989.mp3');
662
+ audio.play();
663
+
664
+ isRunning = false;
665
+ startStopBtn.innerHTML = '<i class="fas fa-play mr-2"></i>Começar';
666
+ startStopBtn.classList.remove('bg-yellow-500');
667
+ startStopBtn.classList.add('bg-indigo-600');
668
+
669
+ if (currentMode === 'pomodoro') {
670
+ timerState.textContent = 'Pomodoro completo! Hora de uma pausa.';
671
+ } else {
672
+ timerState.textContent = 'Pausa completa! Hora de voltar ao trabalho.';
673
+ }
674
+
675
+ // Auto-switch mode after completion
676
+ setTimeout(() => {
677
+ if (currentMode === 'pomodoro') {
678
+ setMode('shortBreak');
679
+ } else {
680
+ setMode('pomodoro');
681
+ }
682
+ }, 2000);
683
+ }
684
+
685
+ function setMode(mode) {
686
+ currentMode = mode;
687
+ timeLeft = modes[mode].duration;
688
+
689
+ // Update button styles
690
+ pomodoroBtn.classList.remove('bg-indigo-100', 'text-indigo-700');
691
+ pomodoroBtn.classList.add('bg-gray-100', 'text-gray-700');
692
+ shortBreakBtn.classList.remove('bg-green-100', 'text-green-700');
693
+ shortBreakBtn.classList.add('bg-gray-100', 'text-gray-700');
694
+ longBreakBtn.classList.remove('bg-blue-100', 'text-blue-700');
695
+ longBreakBtn.classList.add('bg-gray-100', 'text-gray-700');
696
+
697
+ if (mode === 'pomodoro') {
698
+ pomodoroBtn.classList.remove('bg-gray-100', 'text-gray-700');
699
+ pomodoroBtn.classList.add('bg-indigo-100', 'text-indigo-700');
700
+ timerState.textContent = isRunning ? 'Foco no estudo!' : 'Pronto para começar';
701
+ } else if (mode === 'shortBreak') {
702
+ shortBreakBtn.classList.remove('bg-gray-100', 'text-gray-700');
703
+ shortBreakBtn.classList.add('bg-green-100', 'text-green-700');
704
+ timerState.textContent = isRunning ? 'Hora de descansar' : 'Pronto para pausa curta';
705
+ } else {
706
+ longBreakBtn.classList.remove('bg-gray-100', 'text-gray-700');
707
+ longBreakBtn.classList.add('bg-blue-100', 'text-blue-700');
708
+ timerState.textContent = isRunning ? 'Hora de descansar' : 'Pronto para pausa longa';
709
+ }
710
+
711
+ updateDisplay();
712
+
713
+ if (isRunning) {
714
+ startTimer();
715
+ }
716
+ }
717
+
718
+ startStopBtn.addEventListener('click', () => {
719
+ if (isRunning) {
720
+ stopTimer();
721
+ } else {
722
+ startTimer();
723
+ }
724
+ });
725
+
726
+ pomodoroBtn.addEventListener('click', () => setMode('pomodoro'));
727
+ shortBreakBtn.addEventListener('click', () => setMode('shortBreak'));
728
+ longBreakBtn.addEventListener('click', () => setMode('longBreak'));
729
+
730
+ // Initialize timer
731
+ setMode('pomodoro');
732
+
733
+ // Task List Management
734
+ const taskInput = document.getElementById('current-task');
735
+ const addTaskBtn = document.getElementById('add-task-btn');
736
+ const taskList = document.getElementById('task-list');
737
+
738
+ function addTask() {
739
+ const taskText = taskInput.value.trim();
740
+ if (taskText === '') return;
741
+
742
+ const taskId = Date.now();
743
+
744
+ const taskElement = document.createElement('div');
745
+ taskElement.className = 'flex items-center justify-between bg-gray-50 p-3 rounded-lg';
746
+ taskElement.innerHTML = `
747
+ <div class="flex items-center">
748
+ <input type="checkbox" class="h-5 w-5 text-indigo-600 rounded" id="task-${taskId}">
749
+ <label for="task-${taskId}" class="ml-3 text-gray-700">${taskText}</label>
750
+ </div>
751
+ <button class="text-gray-400 hover:text-red-500 delete-task">
752
+ <i class="fas fa-trash"></i>
753
+ </button>
754
+ `;
755
+
756
+ taskList.prepend(taskElement);
757
+ taskInput.value = '';
758
+
759
+ // Add event listener to delete button
760
+ const deleteBtn = taskElement.querySelector('.delete-task');
761
+ deleteBtn.addEventListener('click', () => {
762
+ taskElement.remove();
763
+ });
764
+
765
+ // Add event listener to checkbox
766
+ const checkbox = taskElement.querySelector('input[type="checkbox"]');
767
+ checkbox.addEventListener('change', (e) => {
768
+ const label = taskElement.querySelector('label');
769
+ if (e.target.checked) {
770
+ label.classList.add('line-through', 'text-gray-400');
771
+ } else {
772
+ label.classList.remove('line-through', 'text-gray-400');
773
+ }
774
+ });
775
+ }
776
+
777
+ addTaskBtn.addEventListener('click', addTask);
778
+ taskInput.addEventListener('keypress', (e) => {
779
+ if (e.key === 'Enter') {
780
+ addTask();
781
+ }
782
+ });
783
+
784
+ // Study Cycles Management
785
+ const newCycleBtn = document.getElementById('new-cycle-btn');
786
+ const newCycleModal = document.getElementById('new-cycle-modal');
787
+ const closeCycleModal = document.getElementById('close-cycle-modal');
788
+ const cancelCycle = document.getElementById('cancel-cycle');
789
+ const cycleForm = document.getElementById('cycle-form');
790
+
791
+ newCycleBtn.addEventListener('click', () => {
792
+ newCycleModal.classList.remove('hidden');
793
+ });
794
+
795
+ closeCycleModal.addEventListener('click', () => {
796
+ newCycleModal.classList.add('hidden');
797
+ });
798
+
799
+ cancelCycle.addEventListener('click', () => {
800
+ newCycleModal.classList.add('hidden');
801
+ });
802
+
803
+ cycleForm.addEventListener('submit', (e) => {
804
+ e.preventDefault();
805
+ // Here you would typically send the data to a server
806
+ newCycleModal.classList.add('hidden');
807
+ alert('Ciclo criado com sucesso!');
808
+ cycleForm.reset();
809
+ });
810
+
811
+ // Charts
812
+ document.addEventListener('DOMContentLoaded', function() {
813
+ if (document.getElementById('daily-time-chart')) {
814
+ // Daily Time Chart
815
+ const dailyTimeCtx = document.getElementById('daily-time-chart').getContext('2d');
816
+ const dailyTimeChart = new Chart(dailyTimeCtx, {
817
+ type: 'bar',
818
+ data: {
819
+ labels: ['Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb', 'Dom'],
820
+ datasets: [{
821
+ label: 'Minutos estudados',
822
+ data: [45, 60, 30, 75, 90, 50, 25],
823
+ backgroundColor: '#667eea',
824
+ borderRadius: 4
825
+ }]
826
+ },
827
+ options: {
828
+ responsive: true,
829
+ maintainAspectRatio: false,
830
+ scales: {
831
+ y: {
832
+ beginAtZero: true,
833
+ ticks: {
834
+ callback: function(value) {
835
+ return value + 'm';
836
+ }
837
+ }
838
+ }
839
+ },
840
+ plugins: {
841
+ legend: {
842
+ display: false
843
+ }
844
+ }
845
+ }
846
+ });
847
+
848
+ // Subject Distribution Chart
849
+ const subjectDistCtx = document.getElementById('subject-distribution-chart').getContext('2d');
850
+ const subjectDistChart = new Chart(subjectDistCtx, {
851
+ type: 'doughnut',
852
+ data: {
853
+ labels: ['Matemática', 'Português', 'História', 'Geografia', 'Ciências'],
854
+ datasets: [{
855
+ data: [35, 25, 15, 15, 10],
856
+ backgroundColor: [
857
+ '#667eea',
858
+ '#10b981',
859
+ '#f59e0b',
860
+ '#3b82f6',
861
+ '#ef4444'
862
+ ],
863
+ borderWidth: 0
864
+ }]
865
+ },
866
+ options: {
867
+ responsive: true,
868
+ maintainAspectRatio: false,
869
+ plugins: {
870
+ legend: {
871
+ position: 'right'
872
+ }
873
+ }
874
+ }
875
+ });
876
+
877
+ // Productivity Chart
878
+ const productivityCtx = document.getElementById('productivity-chart').getContext('2d');
879
+ const productivityChart = new Chart(productivityCtx, {
880
+ type: 'line',
881
+ data: {
882
+ labels: ['Semana 1', 'Semana 2', 'Semana 3', 'Semana 4', 'Semana 5'],
883
+ datasets: [
884
+ {
885
+ label: 'Pomodoros',
886
+ data: [12, 15, 10, 18, 20],
887
+ borderColor: '#667eea',
888
+ backgroundColor: 'rgba(102, 126, 234, 0.1)',
889
+ fill: true,
890
+ tension: 0.3
891
+ },
892
+ {
893
+ label: 'Horas',
894
+ data: [5, 6, 4, 7, 8],
895
+ borderColor: '#10b981',
896
+ backgroundColor: 'rgba(16, 185, 129, 0.1)',
897
+ fill: true,
898
+ tension: 0.3
899
+ }
900
+ ]
901
+ },
902
+ options: {
903
+ responsive: true,
904
+ maintainAspectRatio: false,
905
+ scales: {
906
+ y: {
907
+ beginAtZero: true
908
+ }
909
+ }
910
+ }
911
+ });
912
+ }
913
+ });
914
+
915
+ // Show dashboard by default
916
+ showSection('dashboard');
917
+ </script>
918
+ <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=adsrocha/studyflow" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
919
+ </html>
prompts.txt ADDED
File without changes