alexandercgo2 commited on
Commit
74b1f56
·
verified ·
1 Parent(s): 501a6fd

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +449 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Vibecodinghubxyz
3
- emoji: 🦀
4
- colorFrom: indigo
5
- colorTo: yellow
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: vibecodinghubxyz
3
+ emoji: 🐳
4
+ colorFrom: blue
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,449 @@
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>VibeCodingHub | Code with Style</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
+ <script>
10
+ tailwind.config = {
11
+ theme: {
12
+ extend: {
13
+ colors: {
14
+ primary: '#00ff9d',
15
+ secondary: '#00b4ff',
16
+ dark: '#0a0a0a',
17
+ darker: '#050505',
18
+ code: '#1e1e1e',
19
+ },
20
+ fontFamily: {
21
+ 'code': ['Fira Code', 'monospace'],
22
+ 'sans': ['Inter', 'sans-serif'],
23
+ },
24
+ animation: {
25
+ 'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
26
+ 'float': 'float 6s ease-in-out infinite',
27
+ },
28
+ keyframes: {
29
+ float: {
30
+ '0%, 100%': { transform: 'translateY(0)' },
31
+ '50%': { transform: 'translateY(-20px)' },
32
+ }
33
+ }
34
+ }
35
+ }
36
+ }
37
+ </script>
38
+ <style>
39
+ @import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600&family=Inter:wght@300;400;500;600;700&display=swap');
40
+
41
+ body {
42
+ font-family: 'Inter', sans-serif;
43
+ background-color: #050505;
44
+ color: #f0f0f0;
45
+ overflow-x: hidden;
46
+ }
47
+
48
+ .code-bg {
49
+ background-color: #1e1e1e;
50
+ border-left: 4px solid #00ff9d;
51
+ }
52
+
53
+ .gradient-text {
54
+ background: linear-gradient(90deg, #00ff9d, #00b4ff);
55
+ -webkit-background-clip: text;
56
+ background-clip: text;
57
+ color: transparent;
58
+ }
59
+
60
+ .glow {
61
+ text-shadow: 0 0 10px rgba(0, 255, 157, 0.5);
62
+ }
63
+
64
+ .card-hover {
65
+ transition: all 0.3s ease;
66
+ }
67
+
68
+ .card-hover:hover {
69
+ transform: translateY(-5px);
70
+ box-shadow: 0 10px 25px rgba(0, 255, 157, 0.2);
71
+ }
72
+
73
+ .terminal-line::before {
74
+ content: '> ';
75
+ color: #00ff9d;
76
+ }
77
+
78
+ .typewriter {
79
+ border-right: 3px solid #00ff9d;
80
+ animation: blink-caret 0.75s step-end infinite;
81
+ }
82
+
83
+ @keyframes blink-caret {
84
+ from, to { border-color: transparent }
85
+ 50% { border-color: #00ff9d; }
86
+ }
87
+ </style>
88
+ </head>
89
+ <body class="min-h-screen">
90
+ <!-- Navigation -->
91
+ <nav class="bg-darker bg-opacity-90 backdrop-blur-md fixed w-full z-50 border-b border-gray-800">
92
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
93
+ <div class="flex items-center justify-between h-16">
94
+ <div class="flex items-center">
95
+ <div class="flex-shrink-0 flex items-center">
96
+ <span class="text-primary text-2xl font-code font-bold">VibeCodingHub</span>
97
+ </div>
98
+ </div>
99
+ <div class="hidden md:block">
100
+ <div class="ml-10 flex items-center space-x-8">
101
+ <a href="#" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition-colors">Home</a>
102
+ <a href="#" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition-colors">Courses</a>
103
+ <a href="#" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition-colors">Challenges</a>
104
+ <a href="#" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition-colors">Community</a>
105
+ <a href="#" class="text-gray-300 hover:text-primary px-3 py-2 rounded-md text-sm font-medium transition-colors">Blog</a>
106
+ </div>
107
+ </div>
108
+ <div class="flex items-center space-x-4">
109
+ <button class="bg-primary hover:bg-opacity-80 text-dark font-medium px-4 py-2 rounded-md text-sm transition-all">
110
+ Sign In
111
+ </button>
112
+ <button class="md:hidden text-gray-300 hover:text-primary focus:outline-none">
113
+ <i class="fas fa-bars text-xl"></i>
114
+ </button>
115
+ </div>
116
+ </div>
117
+ </div>
118
+ </nav>
119
+
120
+ <!-- Hero Section -->
121
+ <section class="pt-32 pb-20 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto">
122
+ <div class="flex flex-col md:flex-row items-center">
123
+ <div class="md:w-1/2 mb-12 md:mb-0">
124
+ <h1 class="text-4xl md:text-6xl font-bold mb-6 leading-tight">
125
+ <span class="gradient-text glow">Code</span> with <br>
126
+ <span class="gradient-text glow">Vibe</span> & <span class="gradient-text glow">Style</span>
127
+ </h1>
128
+ <p class="text-lg text-gray-400 mb-8 max-w-lg">
129
+ Join the most vibrant coding community. Learn, build, and grow with interactive coding challenges, real-world projects, and a supportive community.
130
+ </p>
131
+ <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
132
+ <button class="bg-primary hover:bg-opacity-80 text-dark font-medium px-6 py-3 rounded-md transition-all flex items-center justify-center">
133
+ <i class="fas fa-rocket mr-2"></i> Get Started
134
+ </button>
135
+ <button class="border border-primary text-primary hover:bg-primary hover:bg-opacity-10 font-medium px-6 py-3 rounded-md transition-all flex items-center justify-center">
136
+ <i class="fas fa-play mr-2"></i> Watch Demo
137
+ </button>
138
+ </div>
139
+ <div class="mt-8 flex items-center space-x-6">
140
+ <div class="flex -space-x-2">
141
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-dark" src="https://randomuser.me/api/portraits/women/12.jpg" alt="">
142
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-dark" src="https://randomuser.me/api/portraits/men/33.jpg" alt="">
143
+ <img class="inline-block h-10 w-10 rounded-full ring-2 ring-dark" src="https://randomuser.me/api/portraits/women/44.jpg" alt="">
144
+ </div>
145
+ <div>
146
+ <p class="text-sm text-gray-400">Join <span class="text-primary font-medium">5,000+</span> developers</p>
147
+ </div>
148
+ </div>
149
+ </div>
150
+ <div class="md:w-1/2 relative">
151
+ <div class="code-bg p-6 rounded-lg shadow-2xl max-w-md mx-auto">
152
+ <div class="flex items-center mb-4">
153
+ <div class="flex space-x-2">
154
+ <div class="w-3 h-3 rounded-full bg-red-500"></div>
155
+ <div class="w-3 h-3 rounded-full bg-yellow-500"></div>
156
+ <div class="w-3 h-3 rounded-full bg-green-500"></div>
157
+ </div>
158
+ <div class="ml-4 text-sm text-gray-400 font-code">index.js</div>
159
+ </div>
160
+ <pre class="text-sm font-code text-gray-300 overflow-x-auto">
161
+ <span class="text-purple-400">const</span> <span class="text-blue-400">vibeCoding</span> = <span class="text-purple-400">async</span> () <span class="text-purple-400">=></span> {
162
+ <span class="text-purple-400">try</span> {
163
+ <span class="text-blue-400">const</span> <span class="text-yellow-300">response</span> = <span class="text-purple-400">await</span> <span class="text-blue-400">fetch</span>(<span class="text-green-400">'https://api.vibecodinghub.com/skills'</span>);
164
+ <span class="text-blue-400">const</span> <span class="text-yellow-300">data</span> = <span class="text-purple-400">await</span> <span class="text-yellow-300">response</span>.<span class="text-blue-400">json</span>();
165
+
166
+ <span class="text-blue-400">console</span>.<span class="text-blue-400">log</span>(<span class="text-green-400">`🎉 You've unlocked <span class="text-primary">${data.skills.length}</span> new skills!`</span>);
167
+
168
+ <span class="text-gray-500">// Join the coding revolution</span>
169
+ <span class="text-blue-400">return</span> <span class="text-green-400">'🚀 Keep coding with vibe!'</span>;
170
+ } <span class="text-purple-400">catch</span> (<span class="text-yellow-300">error</span>) {
171
+ <span class="text-blue-400">console</span>.<span class="text-blue-400">error</span>(<span class="text-green-400">'⚠️ Error:'</span>, <span class="text-yellow-300">error</span>);
172
+ <span class="text-blue-400">return</span> <span class="text-green-400">'💀 Something went wrong...'</span>;
173
+ }
174
+ };
175
+
176
+ <span class="text-blue-400">vibeCoding</span>();
177
+ </pre>
178
+ </div>
179
+ <div class="absolute -z-10 w-full h-full bg-primary bg-opacity-10 rounded-lg -right-4 -bottom-4"></div>
180
+ </div>
181
+ </div>
182
+ </section>
183
+
184
+ <!-- Features Section -->
185
+ <section class="py-20 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto">
186
+ <div class="text-center mb-16">
187
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">Why <span class="gradient-text">VibeCodingHub</span>?</h2>
188
+ <p class="text-lg text-gray-400 max-w-2xl mx-auto">
189
+ We're redefining how developers learn and grow with our unique approach to coding education.
190
+ </p>
191
+ </div>
192
+
193
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
194
+ <!-- Feature 1 -->
195
+ <div class="bg-dark p-8 rounded-xl border border-gray-800 card-hover">
196
+ <div class="w-14 h-14 bg-primary bg-opacity-10 rounded-lg flex items-center justify-center mb-6">
197
+ <i class="fas fa-bolt text-primary text-2xl"></i>
198
+ </div>
199
+ <h3 class="text-xl font-bold mb-3">Interactive Challenges</h3>
200
+ <p class="text-gray-400 mb-4">
201
+ Solve real-world coding problems with our interactive playground. Get instant feedback and improve your skills.
202
+ </p>
203
+ <div class="terminal-line text-primary font-code">Start coding now</div>
204
+ </div>
205
+
206
+ <!-- Feature 2 -->
207
+ <div class="bg-dark p-8 rounded-xl border border-gray-800 card-hover">
208
+ <div class="w-14 h-14 bg-secondary bg-opacity-10 rounded-lg flex items-center justify-center mb-6">
209
+ <i class="fas fa-users text-secondary text-2xl"></i>
210
+ </div>
211
+ <h3 class="text-xl font-bold mb-3">Community Driven</h3>
212
+ <p class="text-gray-400 mb-4">
213
+ Connect with fellow developers, share projects, and get feedback from our supportive community.
214
+ </p>
215
+ <div class="terminal-line text-secondary font-code">Join the community</div>
216
+ </div>
217
+
218
+ <!-- Feature 3 -->
219
+ <div class="bg-dark p-8 rounded-xl border border-gray-800 card-hover">
220
+ <div class="w-14 h-14 bg-purple-500 bg-opacity-10 rounded-lg flex items-center justify-center mb-6">
221
+ <i class="fas fa-chart-line text-purple-500 text-2xl"></i>
222
+ </div>
223
+ <h3 class="text-xl font-bold mb-3">Track Progress</h3>
224
+ <p class="text-gray-400 mb-4">
225
+ Visualize your coding journey with detailed analytics and personalized learning paths.
226
+ </p>
227
+ <div class="terminal-line text-purple-400 font-code">View your stats</div>
228
+ </div>
229
+ </div>
230
+ </section>
231
+
232
+ <!-- Tech Stack Section -->
233
+ <section class="py-16 bg-dark bg-opacity-50">
234
+ <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
235
+ <div class="text-center mb-12">
236
+ <h2 class="text-3xl font-bold mb-4">Learn <span class="gradient-text">Modern</span> Technologies</h2>
237
+ <p class="text-lg text-gray-400 max-w-2xl mx-auto">
238
+ Master the tools and frameworks that power today's web applications.
239
+ </p>
240
+ </div>
241
+
242
+ <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-6 gap-6">
243
+ <div class="flex flex-col items-center p-6 bg-darker rounded-lg hover:bg-opacity-80 transition-all">
244
+ <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/react/react-original.svg" class="h-12 w-12 mb-3" alt="React">
245
+ <span class="text-sm font-medium">React</span>
246
+ </div>
247
+ <div class="flex flex-col items-center p-6 bg-darker rounded-lg hover:bg-opacity-80 transition-all">
248
+ <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/vuejs/vuejs-original.svg" class="h-12 w-12 mb-3" alt="Vue">
249
+ <span class="text-sm font-medium">Vue</span>
250
+ </div>
251
+ <div class="flex flex-col items-center p-6 bg-darker rounded-lg hover:bg-opacity-80 transition-all">
252
+ <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/nodejs/nodejs-original.svg" class="h-12 w-12 mb-3" alt="Node.js">
253
+ <span class="text-sm font-medium">Node.js</span>
254
+ </div>
255
+ <div class="flex flex-col items-center p-6 bg-darker rounded-lg hover:bg-opacity-80 transition-all">
256
+ <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/typescript/typescript-original.svg" class="h-12 w-12 mb-3" alt="TypeScript">
257
+ <span class="text-sm font-medium">TypeScript</span>
258
+ </div>
259
+ <div class="flex flex-col items-center p-6 bg-darker rounded-lg hover:bg-opacity-80 transition-all">
260
+ <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/tailwindcss/tailwindcss-plain.svg" class="h-12 w-12 mb-3" alt="Tailwind CSS">
261
+ <span class="text-sm font-medium">Tailwind</span>
262
+ </div>
263
+ <div class="flex flex-col items-center p-6 bg-darker rounded-lg hover:bg-opacity-80 transition-all">
264
+ <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/python/python-original.svg" class="h-12 w-12 mb-3" alt="Python">
265
+ <span class="text-sm font-medium">Python</span>
266
+ </div>
267
+ </div>
268
+ </div>
269
+ </section>
270
+
271
+ <!-- Testimonials -->
272
+ <section class="py-20 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto">
273
+ <div class="text-center mb-16">
274
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">What <span class="gradient-text">Developers</span> Say</h2>
275
+ <p class="text-lg text-gray-400 max-w-2xl mx-auto">
276
+ Join thousands of developers who've transformed their coding skills with us.
277
+ </p>
278
+ </div>
279
+
280
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
281
+ <!-- Testimonial 1 -->
282
+ <div class="bg-dark p-8 rounded-xl border border-gray-800">
283
+ <div class="flex items-center mb-6">
284
+ <img class="w-12 h-12 rounded-full mr-4" src="https://randomuser.me/api/portraits/women/32.jpg" alt="Sarah K.">
285
+ <div>
286
+ <h4 class="font-bold">Sarah K.</h4>
287
+ <p class="text-sm text-gray-400">Frontend Developer</p>
288
+ </div>
289
+ </div>
290
+ <p class="text-gray-300 mb-4">
291
+ "VibeCodingHub completely changed how I approach coding challenges. The interactive exercises helped me land my first developer job!"
292
+ </p>
293
+ <div class="flex text-yellow-400">
294
+ <i class="fas fa-star"></i>
295
+ <i class="fas fa-star"></i>
296
+ <i class="fas fa-star"></i>
297
+ <i class="fas fa-star"></i>
298
+ <i class="fas fa-star"></i>
299
+ </div>
300
+ </div>
301
+
302
+ <!-- Testimonial 2 -->
303
+ <div class="bg-dark p-8 rounded-xl border border-gray-800">
304
+ <div class="flex items-center mb-6">
305
+ <img class="w-12 h-12 rounded-full mr-4" src="https://randomuser.me/api/portraits/men/54.jpg" alt="Alex M.">
306
+ <div>
307
+ <h4 class="font-bold">Alex M.</h4>
308
+ <p class="text-sm text-gray-400">Fullstack Developer</p>
309
+ </div>
310
+ </div>
311
+ <p class="text-gray-300 mb-4">
312
+ "The community support is incredible. I went from beginner to confident developer in just 6 months with their structured learning paths."
313
+ </p>
314
+ <div class="flex text-yellow-400">
315
+ <i class="fas fa-star"></i>
316
+ <i class="fas fa-star"></i>
317
+ <i class="fas fa-star"></i>
318
+ <i class="fas fa-star"></i>
319
+ <i class="fas fa-star"></i>
320
+ </div>
321
+ </div>
322
+ </div>
323
+ </section>
324
+
325
+ <!-- CTA Section -->
326
+ <section class="py-20 px-4 sm:px-6 lg:px-8 max-w-7xl mx-auto">
327
+ <div class="bg-gradient-to-r from-primary to-secondary rounded-2xl p-8 md:p-12">
328
+ <div class="flex flex-col md:flex-row items-center justify-between">
329
+ <div class="md:w-2/3 mb-8 md:mb-0">
330
+ <h2 class="text-3xl md:text-4xl font-bold text-dark mb-4">Ready to <span class="typewriter">level up</span> your coding skills?</h2>
331
+ <p class="text-dark text-opacity-80 text-lg">
332
+ Join VibeCodingHub today and start your journey to becoming a better developer.
333
+ </p>
334
+ </div>
335
+ <button class="bg-dark hover:bg-opacity-90 text-white font-bold px-8 py-4 rounded-lg transition-all shadow-lg flex items-center">
336
+ <i class="fas fa-laptop-code mr-3"></i> Start Coding Now
337
+ </button>
338
+ </div>
339
+ </div>
340
+ </section>
341
+
342
+ <!-- Footer -->
343
+ <footer class="bg-darker py-12 px-4 sm:px-6 lg:px-8 border-t border-gray-800">
344
+ <div class="max-w-7xl mx-auto">
345
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-8 mb-8">
346
+ <div>
347
+ <h3 class="text-lg font-bold mb-4">VibeCodingHub</h3>
348
+ <p class="text-gray-400 text-sm">
349
+ The most vibrant coding community for developers of all levels.
350
+ </p>
351
+ </div>
352
+ <div>
353
+ <h3 class="text-lg font-bold mb-4">Learn</h3>
354
+ <ul class="space-y-2">
355
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Courses</a></li>
356
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Challenges</a></li>
357
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Roadmaps</a></li>
358
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Blog</a></li>
359
+ </ul>
360
+ </div>
361
+ <div>
362
+ <h3 class="text-lg font-bold mb-4">Community</h3>
363
+ <ul class="space-y-2">
364
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Discord</a></li>
365
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Events</a></li>
366
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Contributors</a></li>
367
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Code of Conduct</a></li>
368
+ </ul>
369
+ </div>
370
+ <div>
371
+ <h3 class="text-lg font-bold mb-4">Company</h3>
372
+ <ul class="space-y-2">
373
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">About</a></li>
374
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Careers</a></li>
375
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Support</a></li>
376
+ <li><a href="#" class="text-gray-400 hover:text-primary text-sm transition-colors">Contact</a></li>
377
+ </ul>
378
+ </div>
379
+ </div>
380
+ <div class="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
381
+ <p class="text-gray-500 text-sm mb-4 md:mb-0">
382
+ © 2023 VibeCodingHub. All rights reserved.
383
+ </p>
384
+ <div class="flex space-x-6">
385
+ <a href="#" class="text-gray-400 hover:text-primary transition-colors">
386
+ <i class="fab fa-twitter text-lg"></i>
387
+ </a>
388
+ <a href="#" class="text-gray-400 hover:text-primary transition-colors">
389
+ <i class="fab fa-github text-lg"></i>
390
+ </a>
391
+ <a href="#" class="text-gray-400 hover:text-primary transition-colors">
392
+ <i class="fab fa-discord text-lg"></i>
393
+ </a>
394
+ <a href="#" class="text-gray-400 hover:text-primary transition-colors">
395
+ <i class="fab fa-linkedin text-lg"></i>
396
+ </a>
397
+ </div>
398
+ </div>
399
+ </div>
400
+ </footer>
401
+
402
+ <script>
403
+ // Simple typewriter effect for the CTA section
404
+ const words = ["level up", "transform", "boost", "enhance", "elevate"];
405
+ let wordIndex = 0;
406
+ let charIndex = 0;
407
+ let isDeleting = false;
408
+ let isEnd = false;
409
+
410
+ const typeWriter = () => {
411
+ const currentWord = words[wordIndex];
412
+ const currentChar = currentWord.substring(0, charIndex);
413
+ const typewriterElement = document.querySelector('.typewriter');
414
+
415
+ if (typewriterElement) {
416
+ typewriterElement.textContent = currentChar;
417
+
418
+ if (!isDeleting && charIndex < currentWord.length) {
419
+ charIndex++;
420
+ setTimeout(typeWriter, 100);
421
+ } else if (isDeleting && charIndex > 0) {
422
+ charIndex--;
423
+ setTimeout(typeWriter, 50);
424
+ } else {
425
+ isDeleting = !isDeleting;
426
+ wordIndex = (!isDeleting && wordIndex === words.length - 1) ? 0 : wordIndex + 1;
427
+ setTimeout(typeWriter, 1000);
428
+ }
429
+ }
430
+ };
431
+
432
+ // Start the typewriter effect when page loads
433
+ document.addEventListener('DOMContentLoaded', () => {
434
+ setTimeout(typeWriter, 1000);
435
+
436
+ // Add animation to code block in hero section
437
+ const codeBlock = document.querySelector('.code-bg');
438
+ if (codeBlock) {
439
+ codeBlock.addEventListener('mouseenter', () => {
440
+ codeBlock.classList.add('shadow-lg');
441
+ });
442
+ codeBlock.addEventListener('mouseleave', () => {
443
+ codeBlock.classList.remove('shadow-lg');
444
+ });
445
+ }
446
+ });
447
+ </script>
448
+ <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=alexandercgo2/vibecodinghubxyz" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
449
+ </html>
prompts.txt ADDED
File without changes