Hugging Face's logo

Spaces:
Xcoder2020
/
adhdsigma
Running

App Files Community
Xcoder2020 commited on
Commit
04425aa
·
verified ·
1 Parent(s): 5aa20bb

undefined - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +5 -3
  2. index.html +491 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Adhdsigma
3
- emoji: 🐨
4
  colorFrom: yellow
5
  colorTo: red
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: adhdsigma
3
+ emoji: 🐳
4
  colorFrom: yellow
5
  colorTo: red
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,491 @@
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>AdhdSigma - Articles & Learning Activities</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, #6e8efb, #a777e3);
12
+ }
13
+ .article-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
+ .topic-chip {
18
+ transition: all 0.3s ease;
19
+ }
20
+ .topic-chip:hover {
21
+ transform: scale(1.05);
22
+ }
23
+ .dropdown-content {
24
+ display: none;
25
+ position: absolute;
26
+ min-width: 200px;
27
+ z-index: 1;
28
+ }
29
+ .dropdown:hover .dropdown-content {
30
+ display: block;
31
+ }
32
+ .reading-progress {
33
+ position: fixed;
34
+ top: 0;
35
+ left: 0;
36
+ height: 4px;
37
+ background: linear-gradient(90deg, #6e8efb, #a777e3);
38
+ z-index: 1000;
39
+ }
40
+ </style>
41
+ </head>
42
+ <body class="bg-gray-50 font-sans">
43
+ <!-- Reading Progress Bar -->
44
+ <div class="reading-progress" id="reading-progress"></div>
45
+
46
+ <!-- Header/Navigation -->
47
+ <header class="gradient-bg text-white shadow-lg sticky top-0 z-50">
48
+ <div class="container mx-auto px-4 py-3">
49
+ <div class="flex justify-between items-center">
50
+ <div class="flex items-center space-x-2">
51
+ <i class="fas fa-brain text-2xl"></i>
52
+ <a href="#" class="text-2xl font-bold">Adhd<span class="text-yellow-300">Sigma</span></a>
53
+ </div>
54
+
55
+ <!-- Mobile Menu Button -->
56
+ <button id="mobile-menu-button" class="md:hidden text-white focus:outline-none">
57
+ <i class="fas fa-bars text-2xl"></i>
58
+ </button>
59
+
60
+ <!-- Desktop Navigation -->
61
+ <nav class="hidden md:flex space-x-6">
62
+ <a href="#" class="hover:text-yellow-300 font-medium">Home</a>
63
+
64
+ <div class="dropdown relative">
65
+ <button class="hover:text-yellow-300 font-medium flex items-center">
66
+ Topics <i class="fas fa-chevron-down ml-1 text-sm"></i>
67
+ </button>
68
+ <div class="dropdown-content absolute left-0 mt-2 bg-white text-gray-800 rounded-md shadow-lg py-2 w-48">
69
+ <a href="#" class="block px-4 py-2 hover:bg-purple-100">Psychology</a>
70
+ <a href="#" class="block px-4 py-2 hover:bg-purple-100">Technology</a>
71
+ <a href="#" class="block px-4 py-2 hover:bg-purple-100">Science</a>
72
+ <a href="#" class="block px-4 py-2 hover:bg-purple-100">Philosophy</a>
73
+ <a href="#" class="block px-4 py-2 hover:bg-purple-100">Productivity</a>
74
+ </div>
75
+ </div>
76
+
77
+ <a href="#" class="hover:text-yellow-300 font-medium">Activities</a>
78
+ <a href="#" class="hover:text-yellow-300 font-medium">Analysis</a>
79
+ <a href="#" class="hover:text-yellow-300 font-medium">About</a>
80
+ </nav>
81
+
82
+ <div class="hidden md:flex items-center space-x-4">
83
+ <button class="bg-white text-purple-600 px-4 py-2 rounded-full font-medium hover:bg-purple-100 transition">
84
+ Sign In
85
+ </button>
86
+ <button class="bg-yellow-400 text-purple-800 px-4 py-2 rounded-full font-medium hover:bg-yellow-300 transition">
87
+ Subscribe
88
+ </button>
89
+ </div>
90
+ </div>
91
+
92
+ <!-- Mobile Navigation (hidden by default) -->
93
+ <div id="mobile-menu" class="md:hidden hidden mt-4 pb-2">
94
+ <a href="#" class="block py-2 hover:text-yellow-300">Home</a>
95
+ <a href="#" class="block py-2 hover:text-yellow-300">Topics</a>
96
+ <a href="#" class="block py-2 hover:text-yellow-300">Activities</a>
97
+ <a href="#" class="block py-2 hover:text-yellow-300">Analysis</a>
98
+ <a href="#" class="block py-2 hover:text-yellow-300">About</a>
99
+ <div class="mt-3 pt-3 border-t border-white border-opacity-20">
100
+ <button class="w-full bg-white text-purple-600 px-4 py-2 rounded-full font-medium mb-2">
101
+ Sign In
102
+ </button>
103
+ <button class="w-full bg-yellow-400 text-purple-800 px-4 py-2 rounded-full font-medium">
104
+ Subscribe
105
+ </button>
106
+ </div>
107
+ </div>
108
+ </div>
109
+ </header>
110
+
111
+ <!-- Hero Section -->
112
+ <section class="gradient-bg text-white py-16 md:py-24">
113
+ <div class="container mx-auto px-4">
114
+ <div class="max-w-3xl mx-auto text-center">
115
+ <h1 class="text-4xl md:text-5xl font-bold mb-6">Expand Your Mind Through Curated Knowledge</h1>
116
+ <p class="text-xl md:text-2xl mb-8 opacity-90">Discover insightful articles, engaging learning activities, and in-depth analysis across diverse topics.</p>
117
+ <div class="flex flex-col sm:flex-row justify-center gap-4">
118
+ <button class="bg-white text-purple-600 px-6 py-3 rounded-full font-bold hover:bg-purple-100 transition">
119
+ Explore Topics
120
+ </button>
121
+ <button class="bg-transparent border-2 border-white text-white px-6 py-3 rounded-full font-bold hover:bg-white hover:text-purple-600 transition">
122
+ Latest Articles
123
+ </button>
124
+ </div>
125
+ </div>
126
+ </div>
127
+ </section>
128
+
129
+ <!-- Featured Articles -->
130
+ <section class="py-16 bg-white">
131
+ <div class="container mx-auto px-4">
132
+ <div class="flex justify-between items-center mb-12">
133
+ <h2 class="text-3xl font-bold text-gray-800">Featured Articles</h2>
134
+ <a href="#" class="text-purple-600 font-medium hover:underline">View All</a>
135
+ </div>
136
+
137
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
138
+ <!-- Article Card 1 -->
139
+ <div class="article-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
140
+ <div class="relative">
141
+ <img src="https://images.unsplash.com/photo-1456513080510-7bf3a84b82f8?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1673&q=80"
142
+ alt="Cognitive Science" class="w-full h-48 object-cover">
143
+ <div class="absolute top-4 right-4 bg-purple-600 text-white px-3 py-1 rounded-full text-sm font-medium">
144
+ Psychology
145
+ </div>
146
+ </div>
147
+ <div class="p-6">
148
+ <div class="flex items-center text-sm text-gray-500 mb-2">
149
+ <span>June 15, 2023</span>
150
+ <span class="mx-2">•</span>
151
+ <span>8 min read</span>
152
+ </div>
153
+ <h3 class="text-xl font-bold text-gray-800 mb-3">The Neuroscience of Focus in ADHD Brains</h3>
154
+ <p class="text-gray-600 mb-4">Exploring how attention works differently in neurodivergent individuals and strategies to harness unique cognitive strengths.</p>
155
+ <div class="flex justify-between items-center">
156
+ <a href="#" class="text-purple-600 font-medium hover:underline">Read More</a>
157
+ <button class="text-gray-400 hover:text-purple-600">
158
+ <i class="far fa-bookmark"></i>
159
+ </button>
160
+ </div>
161
+ </div>
162
+ </div>
163
+
164
+ <!-- Article Card 2 -->
165
+ <div class="article-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
166
+ <div class="relative">
167
+ <img src="https://images.unsplash.com/photo-1518770660439-4636190af475?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80"
168
+ alt="Technology" class="w-full h-48 object-cover">
169
+ <div class="absolute top-4 right-4 bg-blue-600 text-white px-3 py-1 rounded-full text-sm font-medium">
170
+ Technology
171
+ </div>
172
+ </div>
173
+ <div class="p-6">
174
+ <div class="flex items-center text-sm text-gray-500 mb-2">
175
+ <span>June 10, 2023</span>
176
+ <span class="mx-2">•</span>
177
+ <span>12 min read</span>
178
+ </div>
179
+ <h3 class="text-xl font-bold text-gray-800 mb-3">How AI is Revolutionizing Personalized Learning</h3>
180
+ <p class="text-gray-600 mb-4">Examining the latest advancements in artificial intelligence that adapt to individual learning styles and cognitive patterns.</p>
181
+ <div class="flex justify-between items-center">
182
+ <a href="#" class="text-purple-600 font-medium hover:underline">Read More</a>
183
+ <button class="text-gray-400 hover:text-purple-600">
184
+ <i class="far fa-bookmark"></i>
185
+ </button>
186
+ </div>
187
+ </div>
188
+ </div>
189
+
190
+ <!-- Article Card 3 -->
191
+ <div class="article-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
192
+ <div class="relative">
193
+ <img src="https://images.unsplash.com/photo-1451187580459-43490279c0fa?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1744&q=80"
194
+ alt="Science" class="w-full h-48 object-cover">
195
+ <div class="absolute top-4 right-4 bg-green-600 text-white px-3 py-1 rounded-full text-sm font-medium">
196
+ Science
197
+ </div>
198
+ </div>
199
+ <div class="p-6">
200
+ <div class="flex items-center text-sm text-gray-500 mb-2">
201
+ <span>June 5, 2023</span>
202
+ <span class="mx-2">•</span>
203
+ <span>15 min read</span>
204
+ </div>
205
+ <h3 class="text-xl font-bold text-gray-800 mb-3">The Quantum Mind: Exploring Consciousness at the Subatomic Level</h3>
206
+ <p class="text-gray-600 mb-4">A deep dive into controversial theories that suggest quantum phenomena may play a role in human consciousness.</p>
207
+ <div class="flex justify-between items-center">
208
+ <a href="#" class="text-purple-600 font-medium hover:underline">Read More</a>
209
+ <button class="text-gray-400 hover:text-purple-600">
210
+ <i class="far fa-bookmark"></i>
211
+ </button>
212
+ </div>
213
+ </div>
214
+ </div>
215
+ </div>
216
+ </div>
217
+ </section>
218
+
219
+ <!-- Learning Activities -->
220
+ <section class="py-16 bg-gray-50">
221
+ <div class="container mx-auto px-4">
222
+ <div class="text-center mb-12">
223
+ <h2 class="text-3xl font-bold text-gray-800 mb-4">Interactive Learning Activities</h2>
224
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Engage with interactive content designed to enhance your understanding and retention.</p>
225
+ </div>
226
+
227
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
228
+ <!-- Activity 1 -->
229
+ <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition duration-300">
230
+ <div class="p-6">
231
+ <div class="w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mb-4">
232
+ <i class="fas fa-brain text-purple-600 text-2xl"></i>
233
+ </div>
234
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Cognitive Flexibility Challenge</h3>
235
+ <p class="text-gray-600 mb-4">A 7-day program to improve your ability to switch between different concepts and perspectives.</p>
236
+ <div class="flex items-center text-purple-600 font-medium">
237
+ <span>Start Activity</span>
238
+ <i class="fas fa-arrow-right ml-2"></i>
239
+ </div>
240
+ </div>
241
+ </div>
242
+
243
+ <!-- Activity 2 -->
244
+ <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition duration-300">
245
+ <div class="p-6">
246
+ <div class="w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mb-4">
247
+ <i class="fas fa-lightbulb text-blue-600 text-2xl"></i>
248
+ </div>
249
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Idea Generation Workshop</h3>
250
+ <p class="text-gray-600 mb-4">Techniques to boost creativity and overcome mental blocks when brainstorming new ideas.</p>
251
+ <div class="flex items-center text-purple-600 font-medium">
252
+ <span>Start Activity</span>
253
+ <i class="fas fa-arrow-right ml-2"></i>
254
+ </div>
255
+ </div>
256
+ </div>
257
+
258
+ <!-- Activity 3 -->
259
+ <div class="bg-white rounded-xl shadow-md overflow-hidden hover:shadow-lg transition duration-300">
260
+ <div class="p-6">
261
+ <div class="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mb-4">
262
+ <i class="fas fa-chart-line text-green-600 text-2xl"></i>
263
+ </div>
264
+ <h3 class="text-xl font-bold text-gray-800 mb-3">Pattern Recognition Training</h3>
265
+ <p class="text-gray-600 mb-4">Develop your ability to identify patterns in complex information with this visual exercise series.</p>
266
+ <div class="flex items-center text-purple-600 font-medium">
267
+ <span>Start Activity</span>
268
+ <i class="fas fa-arrow-right ml-2"></i>
269
+ </div>
270
+ </div>
271
+ </div>
272
+ </div>
273
+
274
+ <div class="text-center mt-12">
275
+ <button class="bg-purple-600 text-white px-6 py-3 rounded-full font-bold hover:bg-purple-700 transition">
276
+ View All Activities
277
+ </button>
278
+ </div>
279
+ </div>
280
+ </section>
281
+
282
+ <!-- Topic Explorer -->
283
+ <section class="py-16 bg-white">
284
+ <div class="container mx-auto px-4">
285
+ <div class="text-center mb-12">
286
+ <h2 class="text-3xl font-bold text-gray-800 mb-4">Explore Topics</h2>
287
+ <p class="text-xl text-gray-600 max-w-2xl mx-auto">Dive deep into subjects that spark your curiosity and expand your knowledge.</p>
288
+ </div>
289
+
290
+ <div class="flex flex-wrap justify-center gap-4 mb-12">
291
+ <button class="topic-chip bg-purple-100 text-purple-800 px-4 py-2 rounded-full font-medium hover:bg-purple-200">
292
+ Psychology
293
+ </button>
294
+ <button class="topic-chip bg-blue-100 text-blue-800 px-4 py-2 rounded-full font-medium hover:bg-blue-200">
295
+ Neuroscience
296
+ </button>
297
+ <button class="topic-chip bg-green-100 text-green-800 px-4 py-2 rounded-full font-medium hover:bg-green-200">
298
+ Philosophy
299
+ </button>
300
+ <button class="topic-chip bg-yellow-100 text-yellow-800 px-4 py-2 rounded-full font-medium hover:bg-yellow-200">
301
+ Productivity
302
+ </button>
303
+ <button class="topic-chip bg-red-100 text-red-800 px-4 py-2 rounded-full font-medium hover:bg-red-200">
304
+ Technology
305
+ </button>
306
+ <button class="topic-chip bg-indigo-100 text-indigo-800 px-4 py-2 rounded-full font-medium hover:bg-indigo-200">
307
+ Artificial Intelligence
308
+ </button>
309
+ <button class="topic-chip bg-pink-100 text-pink-800 px-4 py-2 rounded-full font-medium hover:bg-pink-200">
310
+ Creativity
311
+ </button>
312
+ <button class="topic-chip bg-gray-100 text-gray-800 px-4 py-2 rounded-full font-medium hover:bg-gray-200">
313
+ All Topics
314
+ </button>
315
+ </div>
316
+
317
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
318
+ <!-- Topic Card 1 -->
319
+ <div class="bg-gray-50 rounded-lg p-6 hover:shadow-md transition duration-300">
320
+ <div class="w-12 h-12 bg-purple-100 rounded-full flex items-center justify-center mb-4">
321
+ <i class="fas fa-brain text-purple-600 text-xl"></i>
322
+ </div>
323
+ <h3 class="text-lg font-bold text-gray-800 mb-2">Cognitive Science</h3>
324
+ <p class="text-gray-600 mb-4">Understanding how the mind processes information and makes decisions.</p>
325
+ <a href="#" class="text-purple-600 font-medium text-sm hover:underline">23 Articles</a>
326
+ </div>
327
+
328
+ <!-- Topic Card 2 -->
329
+ <div class="bg-gray-50 rounded-lg p-6 hover:shadow-md transition duration-300">
330
+ <div class="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center mb-4">
331
+ <i class="fas fa-laptop-code text-blue-600 text-xl"></i>
332
+ </div>
333
+ <h3 class="text-lg font-bold text-gray-800 mb-2">Future Tech</h3>
334
+ <p class="text-gray-600 mb-4">Emerging technologies that will shape our world in the coming decades.</p>
335
+ <a href="#" class="text-purple-600 font-medium text-sm hover:underline">18 Articles</a>
336
+ </div>
337
+
338
+ <!-- Topic Card 3 -->
339
+ <div class="bg-gray-50 rounded-lg p-6 hover:shadow-md transition duration-300">
340
+ <div class="w-12 h-12 bg-green-100 rounded-full flex items-center justify-center mb-4">
341
+ <i class="fas fa-atom text-green-600 text-xl"></i>
342
+ </div>
343
+ <h3 class="text-lg font-bold text-gray-800 mb-2">Quantum Physics</h3>
344
+ <p class="text-gray-600 mb-4">Exploring the strange and counterintuitive world of quantum mechanics.</p>
345
+ <a href="#" class="text-purple-600 font-medium text-sm hover:underline">12 Articles</a>
346
+ </div>
347
+
348
+ <!-- Topic Card 4 -->
349
+ <div class="bg-gray-50 rounded-lg p-6 hover:shadow-md transition duration-300">
350
+ <div class="w-12 h-12 bg-yellow-100 rounded-full flex items-center justify-center mb-4">
351
+ <i class="fas fa-book-open text-yellow-600 text-xl"></i>
352
+ </div>
353
+ <h3 class="text-lg font-bold text-gray-800 mb-2">Learning Methods</h3>
354
+ <p class="text-gray-600 mb-4">Evidence-based techniques to acquire and retain knowledge more effectively.</p>
355
+ <a href="#" class="text-purple-600 font-medium text-sm hover:underline">27 Articles</a>
356
+ </div>
357
+ </div>
358
+ </div>
359
+ </section>
360
+
361
+ <!-- Newsletter -->
362
+ <section class="py-16 gradient-bg text-white">
363
+ <div class="container mx-auto px-4">
364
+ <div class="max-w-3xl mx-auto text-center">
365
+ <h2 class="text-3xl font-bold mb-6">Stay Updated with Our Latest Content</h2>
366
+ <p class="text-xl mb-8 opacity-90">Subscribe to our newsletter and receive weekly insights directly to your inbox.</p>
367
+
368
+ <div class="flex flex-col sm:flex-row gap-4 max-w-xl mx-auto">
369
+ <input type="email" placeholder="Your email address"
370
+ class="flex-grow px-4 py-3 rounded-full text-gray-800 focus:outline-none focus:ring-2 focus:ring-purple-300">
371
+ <button class="bg-yellow-400 text-purple-800 px-6 py-3 rounded-full font-bold hover:bg-yellow-300 transition whitespace-nowrap">
372
+ Subscribe Now
373
+ </button>
374
+ </div>
375
+
376
+ <p class="text-sm opacity-70 mt-4">We respect your privacy. Unsubscribe at any time.</p>
377
+ </div>
378
+ </div>
379
+ </section>
380
+
381
+ <!-- Footer -->
382
+ <footer class="bg-gray-900 text-white py-12">
383
+ <div class="container mx-auto px-4">
384
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
385
+ <div>
386
+ <div class="flex items-center space-x-2 mb-4">
387
+ <i class="fas fa-brain text-2xl text-purple-400"></i>
388
+ <span class="text-2xl font-bold">Adhd<span class="text-yellow-300">Sigma</span></span>
389
+ </div>
390
+ <p class="text-gray-400 mb-4">Expanding minds through curated knowledge and interactive learning.</p>
391
+ <div class="flex space-x-4">
392
+ <a href="#" class="text-gray-400 hover:text-white text-xl"><i class="fab fa-twitter"></i></a>
393
+ <a href="#" class="text-gray-400 hover:text-white text-xl"><i class="fab fa-facebook"></i></a>
394
+ <a href="#" class="text-gray-400 hover:text-white text-xl"><i class="fab fa-instagram"></i></a>
395
+ <a href="#" class="text-gray-400 hover:text-white text-xl"><i class="fab fa-linkedin"></i></a>
396
+ </div>
397
+ </div>
398
+
399
+ <div>
400
+ <h3 class="text-lg font-bold mb-4">Explore</h3>
401
+ <ul class="space-y-2">
402
+ <li><a href="#" class="text-gray-400 hover:text-white">Home</a></li>
403
+ <li><a href="#" class="text-gray-400 hover:text-white">Articles</a></li>
404
+ <li><a href="#" class="text-gray-400 hover:text-white">Activities</a></li>
405
+ <li><a href="#" class="text-gray-400 hover:text-white">Analysis</a></li>
406
+ <li><a href="#" class="text-gray-400 hover:text-white">Topics</a></li>
407
+ </ul>
408
+ </div>
409
+
410
+ <div>
411
+ <h3 class="text-lg font-bold mb-4">Company</h3>
412
+ <ul class="space-y-2">
413
+ <li><a href="#" class="text-gray-400 hover:text-white">About Us</a></li>
414
+ <li><a href="#" class="text-gray-400 hover:text-white">Our Team</a></li>
415
+ <li><a href="#" class="text-gray-400 hover:text-white">Careers</a></li>
416
+ <li><a href="#" class="text-gray-400 hover:text-white">Contact</a></li>
417
+ <li><a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a></li>
418
+ </ul>
419
+ </div>
420
+
421
+ <div>
422
+ <h3 class="text-lg font-bold mb-4">Contact</h3>
423
+ <ul class="space-y-2">
424
+ <li class="flex items-start">
425
+ <i class="fas fa-map-marker-alt mt-1 mr-2 text-purple-400"></i>
426
+ <span class="text-gray-400">123 Knowledge Lane, Brain City</span>
427
+ </li>
428
+ <li class="flex items-center">
429
+ <i class="fas fa-envelope mr-2 text-purple-400"></i>
430
+ <span class="text-gray-400">info@adhdsigma.com</span>
431
+ </li>
432
+ <li class="flex items-center">
433
+ <i class="fas fa-phone-alt mr-2 text-purple-400"></i>
434
+ <span class="text-gray-400">(123) 456-7890</span>
435
+ </li>
436
+ </ul>
437
+ </div>
438
+ </div>
439
+
440
+ <div class="border-t border-gray-800 mt-12 pt-8 text-center text-gray-400">
441
+ <p>&copy; 2023 AdhdSigma. All rights reserved.</p>
442
+ </div>
443
+ </div>
444
+ </footer>
445
+
446
+ <script>
447
+ // Mobile menu toggle
448
+ document.getElementById('mobile-menu-button').addEventListener('click', function() {
449
+ const menu = document.getElementById('mobile-menu');
450
+ menu.classList.toggle('hidden');
451
+ });
452
+
453
+ // Reading progress bar
454
+ window.addEventListener('scroll', function() {
455
+ const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
456
+ const scrollHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
457
+ const scrollProgress = (scrollTop / scrollHeight) * 100;
458
+ document.getElementById('reading-progress').style.width = scrollProgress + '%';
459
+ });
460
+
461
+ // Smooth scrolling for anchor links
462
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
463
+ anchor.addEventListener('click', function(e) {
464
+ e.preventDefault();
465
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
466
+ behavior: 'smooth'
467
+ });
468
+ });
469
+ });
470
+
471
+ // Bookmark button functionality
472
+ document.querySelectorAll('.fa-bookmark').forEach(bookmark => {
473
+ bookmark.addEventListener('click', function() {
474
+ this.classList.toggle('far');
475
+ this.classList.toggle('fas');
476
+ this.classList.toggle('text-purple-600');
477
+
478
+ // Show a toast notification
479
+ const toast = document.createElement('div');
480
+ toast.className = 'fixed bottom-4 right-4 bg-gray-800 text-white px-4 py-2 rounded-md shadow-lg';
481
+ toast.textContent = this.classList.contains('fas') ? 'Article bookmarked!' : 'Bookmark removed';
482
+ document.body.appendChild(toast);
483
+
484
+ setTimeout(() => {
485
+ toast.remove();
486
+ }, 2000);
487
+ });
488
+ });
489
+ </script>
490
+ <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=Xcoder2020/adhdsigma" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
491
+ </html>