Hugging Face's logo

Spaces:
thetwistedpixie
/
boom-buddy-skibidi
Running

App Files Community
thetwistedpixie commited on
Commit
3eadc05
·
verified ·
1 Parent(s): 3041504

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +518 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Boom Buddy Skibidi
3
- emoji: 🏆
4
- colorFrom: indigo
5
- colorTo: pink
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: boom-buddy-skibidi
3
+ emoji: 🐳
4
+ colorFrom: yellow
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,518 @@
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>BoomBuddy: The Skibidi Odyssey</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
+ @import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@400;700&family=Permanent+Marker&display=swap');
11
+
12
+ :root {
13
+ --neon-pink: #ff6ec7;
14
+ --neon-blue: #00f7ff;
15
+ --neon-yellow: #fff01f;
16
+ --neon-green: #00ff7f;
17
+ --neon-purple: #c724ff;
18
+ }
19
+
20
+ body {
21
+ font-family: 'Comic Neue', cursive;
22
+ background-color: #111;
23
+ color: white;
24
+ overflow-x: hidden;
25
+ }
26
+
27
+ .title-font {
28
+ font-family: 'Permanent Marker', cursive;
29
+ }
30
+
31
+ .neon-text-pink {
32
+ text-shadow: 0 0 5px var(--neon-pink), 0 0 15px var(--neon-pink);
33
+ color: var(--neon-pink);
34
+ }
35
+
36
+ .neon-text-blue {
37
+ text-shadow: 0 0 5px var(--neon-blue), 0 0 15px var(--neon-blue);
38
+ color: var(--neon-blue);
39
+ }
40
+
41
+ .neon-text-yellow {
42
+ text-shadow: 0 0 5px var(--neon-yellow), 0 0 15px var(--neon-yellow);
43
+ color: var(--neon-yellow);
44
+ }
45
+
46
+ .neon-text-green {
47
+ text-shadow: 0 0 5px var(--neon-green), 0 0 15px var(--neon-green);
48
+ color: var(--neon-green);
49
+ }
50
+
51
+ .neon-text-purple {
52
+ text-shadow: 0 0 5px var(--neon-purple), 0 0 15px var(--neon-purple);
53
+ color: var(--neon-purple);
54
+ }
55
+
56
+ .neon-border-pink {
57
+ box-shadow: 0 0 5px var(--neon-pink), 0 0 15px var(--neon-pink), inset 0 0 5px var(--neon-pink);
58
+ border: 2px solid var(--neon-pink);
59
+ }
60
+
61
+ .neon-border-blue {
62
+ box-shadow: 0 0 5px var(--neon-blue), 0 0 15px var(--neon-blue), inset 0 0 5px var(--neon-blue);
63
+ border: 2px solid var(--neon-blue);
64
+ }
65
+
66
+ .neon-border-yellow {
67
+ box-shadow: 0 0 5px var(--neon-yellow), 0 0 15px var(--neon-yellow), inset 0 0 5px var(--neon-yellow);
68
+ border: 2px solid var(--neon-yellow);
69
+ }
70
+
71
+ .neon-border-green {
72
+ box-shadow: 0 0 5px var(--neon-green), 0 0 15px var(--neon-green), inset 0 0 5px var(--neon-green);
73
+ border: 2px solid var(--neon-green);
74
+ }
75
+
76
+ .neon-border-purple {
77
+ box-shadow: 0 0 5px var(--neon-purple), 0 0 15px var(--neon-purple), inset 0 0 5px var(--neon-purple);
78
+ border: 2px solid var(--neon-purple);
79
+ }
80
+
81
+ .skibidi-spin {
82
+ animation: skibidi-spin 3s infinite linear;
83
+ }
84
+
85
+ @keyframes skibidi-spin {
86
+ 0% { transform: rotate(0deg); }
87
+ 25% { transform: rotate(5deg); }
88
+ 50% { transform: rotate(0deg); }
89
+ 75% { transform: rotate(-5deg); }
90
+ 100% { transform: rotate(0deg); }
91
+ }
92
+
93
+ .skibidi-bounce {
94
+ animation: skibidi-bounce 2s infinite;
95
+ }
96
+
97
+ @keyframes skibidi-bounce {
98
+ 0%, 100% { transform: translateY(0); }
99
+ 50% { transform: translateY(-20px); }
100
+ }
101
+
102
+ .skibidi-pulse {
103
+ animation: skibidi-pulse 1.5s infinite;
104
+ }
105
+
106
+ @keyframes skibidi-pulse {
107
+ 0%, 100% { transform: scale(1); }
108
+ 50% { transform: scale(1.05); }
109
+ }
110
+
111
+ .skibidi-flicker {
112
+ animation: skibidi-flicker 1.5s infinite alternate;
113
+ }
114
+
115
+ @keyframes skibidi-flicker {
116
+ 0%, 18%, 22%, 25%, 53%, 57%, 100% {
117
+ opacity: 1;
118
+ }
119
+ 20%, 24%, 55% {
120
+ opacity: 0.3;
121
+ }
122
+ }
123
+
124
+ .comic-box {
125
+ clip-path: polygon(
126
+ 0% 0%,
127
+ 100% 0%,
128
+ 100% 75%,
129
+ 75% 75%,
130
+ 75% 100%,
131
+ 50% 75%,
132
+ 0% 75%
133
+ );
134
+ }
135
+
136
+ .speech-bubble {
137
+ position: relative;
138
+ background: white;
139
+ border-radius: 1em;
140
+ color: black;
141
+ padding: 1rem;
142
+ }
143
+
144
+ .speech-bubble:after {
145
+ content: '';
146
+ position: absolute;
147
+ bottom: -10px;
148
+ left: 20px;
149
+ border-width: 15px 15px 0;
150
+ border-style: solid;
151
+ border-color: white transparent;
152
+ }
153
+
154
+ .app-screen {
155
+ border-radius: 30px;
156
+ overflow: hidden;
157
+ position: relative;
158
+ }
159
+
160
+ .app-notch {
161
+ position: absolute;
162
+ top: 0;
163
+ left: 50%;
164
+ transform: translateX(-50%);
165
+ width: 40%;
166
+ height: 30px;
167
+ background: #111;
168
+ border-bottom-left-radius: 15px;
169
+ border-bottom-right-radius: 15px;
170
+ z-index: 10;
171
+ }
172
+
173
+ .feature-icon {
174
+ width: 60px;
175
+ height: 60px;
176
+ display: flex;
177
+ align-items: center;
178
+ justify-content: center;
179
+ border-radius: 20px;
180
+ font-size: 28px;
181
+ }
182
+
183
+ .glow-hover:hover {
184
+ transform: scale(1.05);
185
+ transition: all 0.3s ease;
186
+ }
187
+ </style>
188
+ </head>
189
+ <body class="min-h-screen">
190
+ <!-- App Header -->
191
+ <header class="relative overflow-hidden bg-black neon-border-purple">
192
+ <div class="container mx-auto px-4 py-12 md:py-20">
193
+ <div class="text-center">
194
+ <div class="inline-block mb-6 neon-border-yellow rounded-full p-2 skibidi-bounce">
195
+ <div class="rounded-full bg-black p-4 neon-border-pink">
196
+ <span class="text-4xl">🚐</span>
197
+ </div>
198
+ </div>
199
+ <h1 class="text-5xl md:text-7xl font-bold title-font neon-text-pink mb-4">
200
+ Boom<span class="neon-text-yellow">Buddy</span>
201
+ </h1>
202
+ <p class="text-xl md:text-2xl neon-text-blue mb-8">
203
+ The <span class="neon-text-green">Skibidi Odyssey</span> of Piglet & Henley
204
+ </p>
205
+ <div class="max-w-3xl mx-auto">
206
+ <div class="app-screen neon-border-blue mx-auto relative" style="max-width: 300px; height: 500px;">
207
+ <div class="app-notch"></div>
208
+ <div class="absolute inset-0 bg-gradient-to-b from-purple-900 to-black flex items-center justify-center">
209
+ <div class="text-center p-6">
210
+ <div class="flex justify-center mb-6">
211
+ <div class="w-20 h-20 rounded-full neon-border-pink bg-black flex items-center justify-center overflow-hidden">
212
+ <span class="text-4xl">🐷</span>
213
+ </div>
214
+ <div class="w-20 h-20 rounded-full neon-border-blue bg-black flex items-center justify-center overflow-hidden -ml-4">
215
+ <span class="text-4xl">👦</span>
216
+ </div>
217
+ </div>
218
+ <h3 class="text-2xl font-bold neon-text-yellow mb-4">Boom Festival Mode</h3>
219
+ <p class="mb-6">Activating <span class="neon-text-green">Skibidi Chaos</span>...</p>
220
+ <button class="px-6 py-3 bg-pink-600 hover:bg-pink-700 rounded-full font-bold neon-border-pink skibidi-pulse">
221
+ Let's Go!
222
+ </button>
223
+ </div>
224
+ </div>
225
+ </div>
226
+ </div>
227
+ </div>
228
+ </div>
229
+ <div class="absolute bottom-0 left-0 w-full h-16 bg-gradient-to-t from-black to-transparent z-10"></div>
230
+ </header>
231
+
232
+ <!-- App Features -->
233
+ <section class="py-16 bg-black">
234
+ <div class="container mx-auto px-4">
235
+ <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 neon-text-yellow title-font">
236
+ <span class="neon-text-pink">Skibidi-Powered</span> Features
237
+ </h2>
238
+
239
+ <!-- Feature Grid -->
240
+ <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
241
+ <!-- Feature 1 -->
242
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-blue hover:neon-border-pink transition glow-hover">
243
+ <div class="feature-icon neon-border-blue mb-4">
244
+ <span class="neon-text-blue">🗺️</span>
245
+ </div>
246
+ <h3 class="text-xl font-bold mb-3 neon-text-blue">Live Skibidi Map</h3>
247
+ <p class="text-gray-300">
248
+ GPS with chaotic voice nav ("Oi Piglet, turn left or I'm telling Nan!")
249
+ </p>
250
+ <div class="mt-4 text-sm neon-text-yellow">
251
+ <span class="inline-block px-2 py-1 rounded-full bg-gray-800">Drop Skibidi Bombs</span>
252
+ </div>
253
+ </div>
254
+
255
+ <!-- Feature 2 -->
256
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-pink hover:neon-border-yellow transition glow-hover">
257
+ <div class="feature-icon neon-border-pink mb-4">
258
+ <span class="neon-text-pink">🎭</span>
259
+ </div>
260
+ <h3 class="text-xl font-bold mb-3 neon-text-pink">AI Story Mode</h3>
261
+ <p class="text-gray-300">
262
+ Turns your nonsense into Shakespearean sonnets or comic strips
263
+ </p>
264
+ <div class="mt-4 text-sm neon-text-blue">
265
+ <span class="inline-block px-2 py-1 rounded-full bg-gray-800">"Henley farted on a cow" → Art</span>
266
+ </div>
267
+ </div>
268
+
269
+ <!-- Feature 3 -->
270
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-yellow hover:neon-border-green transition glow-hover">
271
+ <div class="feature-icon neon-border-yellow mb-4">
272
+ <span class="neon-text-yellow">💨</span>
273
+ </div>
274
+ <h3 class="text-xl font-bold mb-3 neon-text-yellow">Perfume Spray Meter</h3>
275
+ <p class="text-gray-300">
276
+ Track sneaky Jean Paul Gaultier attacks with motion sensors
277
+ </p>
278
+ <div class="mt-4 text-sm neon-text-pink">
279
+ <span class="inline-block px-2 py-1 rounded-full bg-gray-800">Unlock "Nasal Assassin" badge</span>
280
+ </div>
281
+ </div>
282
+
283
+ <!-- Feature 4 -->
284
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-green hover:neon-border-blue transition glow-hover">
285
+ <div class="feature-icon neon-border-green mb-4">
286
+ <span class="neon-text-green">🎥</span>
287
+ </div>
288
+ <h3 class="text-xl font-bold mb-3 neon-text-green">Chaos Cam</h3>
289
+ <p class="text-gray-300">
290
+ Trippy filters for Insta360 with "HenleyVision" fisheye madness
291
+ </p>
292
+ <div class="mt-4 text-sm neon-text-yellow">
293
+ <span class="inline-block px-2 py-1 rounded-full bg-gray-800">Meme overlays included</span>
294
+ </div>
295
+ </div>
296
+ </div>
297
+ </div>
298
+ </section>
299
+
300
+ <!-- App Screens -->
301
+ <section class="py-16 bg-gradient-to-b from-black to-purple-900">
302
+ <div class="container mx-auto px-4">
303
+ <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 neon-text-green title-font">
304
+ <span class="neon-text-yellow">Skibidi</span> In Action
305
+ </h2>
306
+
307
+ <div class="grid md:grid-cols-3 gap-8">
308
+ <!-- Screen 1 -->
309
+ <div class="text-center">
310
+ <div class="app-screen neon-border-pink mx-auto mb-6 relative" style="height: 400px;">
311
+ <div class="app-notch"></div>
312
+ <div class="absolute inset-0 bg-gradient-to-b from-pink-900 to-black p-4">
313
+ <div class="h-full flex flex-col">
314
+ <div class="flex justify-between items-center mb-4">
315
+ <span class="text-sm neon-text-yellow">📍 12km to Boom</span>
316
+ <span class="text-sm neon-text-blue">🐷👦</span>
317
+ </div>
318
+ <div class="flex-1 bg-gray-800 rounded-xl neon-border-blue p-4 mb-4">
319
+ <div class="h-full bg-gray-900 rounded-lg flex items-center justify-center">
320
+ <span class="text-4xl">🗺️</span>
321
+ </div>
322
+ </div>
323
+ <div class="bg-gray-800 rounded-full p-3 neon-border-yellow">
324
+ <p class="text-sm neon-text-pink">"Turn right ya melt or we'll miss the Skibidi toilets!"</p>
325
+ </div>
326
+ </div>
327
+ </div>
328
+ </div>
329
+ <h3 class="text-xl font-bold neon-text-blue">Live Skibidi Map</h3>
330
+ <p class="text-gray-300">Chaotic navigation with custom avatars</p>
331
+ </div>
332
+
333
+ <!-- Screen 2 -->
334
+ <div class="text-center">
335
+ <div class="app-screen neon-border-yellow mx-auto mb-6 relative" style="height: 400px;">
336
+ <div class="app-notch"></div>
337
+ <div class="absolute inset-0 bg-gradient-to-b from-yellow-900 to-black p-4">
338
+ <div class="h-full flex flex-col">
339
+ <div class="flex justify-between items-center mb-4">
340
+ <span class="text-sm neon-text-pink">Spray Attack!</span>
341
+ <span class="text-sm neon-text-green">3/5 Today</span>
342
+ </div>
343
+ <div class="flex-1 bg-gray-800 rounded-xl neon-border-pink p-4 mb-4 flex flex-col items-center justify-center">
344
+ <div class="w-24 h-24 rounded-full neon-border-green flex items-center justify-center mb-4">
345
+ <span class="text-4xl">💨</span>
346
+ </div>
347
+ <p class="text-sm neon-text-yellow mb-4">"Piglet didn't see that coming!"</p>
348
+ <div class="w-full bg-gray-900 rounded-full h-2 mb-2">
349
+ <div class="bg-green-500 h-2 rounded-full" style="width: 65%"></div>
350
+ </div>
351
+ <p class="text-xs neon-text-blue">Next level: Nasal Ninja</p>
352
+ </div>
353
+ <button class="bg-pink-600 hover:bg-pink-700 rounded-full py-2 px-4 text-sm neon-border-pink">
354
+ SPRAY NOW
355
+ </button>
356
+ </div>
357
+ </div>
358
+ </div>
359
+ <h3 class="text-xl font-bold neon-text-pink">Perfume Spray Meter</h3>
360
+ <p class="text-gray-300">Track your sneaky fragrance attacks</p>
361
+ </div>
362
+
363
+ <!-- Screen 3 -->
364
+ <div class="text-center">
365
+ <div class="app-screen neon-border-green mx-auto mb-6 relative" style="height: 400px;">
366
+ <div class="app-notch"></div>
367
+ <div class="absolute inset-0 bg-gradient-to-b from-green-900 to-black p-4">
368
+ <div class="h-full flex flex-col">
369
+ <div class="flex justify-between items-center mb-4">
370
+ <span class="text-sm neon-text-yellow">AI Story Generator</span>
371
+ <span class="text-sm neon-text-pink">#BoomChronicles</span>
372
+ </div>
373
+ <div class="flex-1 bg-gray-800 rounded-xl neon-border-yellow p-4 mb-4 overflow-hidden">
374
+ <div class="h-full bg-gray-900 rounded-lg flex flex-col">
375
+ <div class="p-2 border-b border-gray-700 neon-text-blue text-xs">
376
+ "Henley tried to eat a bug →"
377
+ </div>
378
+ <div class="flex-1 p-4 flex items-center justify-center">
379
+ <div class="text-center">
380
+ <span class="text-4xl mb-2">🦗</span>
381
+ <p class="text-xs neon-text-pink">"The Ballad of Henley and the Brave Cricket"</p>
382
+ </div>
383
+ </div>
384
+ </div>
385
+ </div>
386
+ <div class="flex space-x-2">
387
+ <button class="flex-1 bg-blue-600 hover:bg-blue-700 rounded-full py-2 text-xs neon-border-blue">
388
+ POEM
389
+ </button>
390
+ <button class="flex-1 bg-purple-600 hover:bg-purple-700 rounded-full py-2 text-xs neon-border-purple">
391
+ COMIC
392
+ </button>
393
+ <button class="flex-1 bg-pink-600 hover:bg-pink-700 rounded-full py-2 text-xs neon-border-pink">
394
+ MEME
395
+ </button>
396
+ </div>
397
+ </div>
398
+ </div>
399
+ </div>
400
+ <h3 class="text-xl font-bold neon-text-yellow">AI Story Mode</h3>
401
+ <p class="text-gray-300">Turn chaos into art automatically</p>
402
+ </div>
403
+ </div>
404
+ </div>
405
+ </section>
406
+
407
+ <!-- App CTA -->
408
+ <section class="py-16 bg-black neon-border-purple">
409
+ <div class="container mx-auto px-4 text-center">
410
+ <h2 class="text-3xl md:text-5xl font-bold mb-6 neon-text-yellow title-font">
411
+ Ready for <span class="neon-text-pink">Skibidi</span> Mode?
412
+ </h2>
413
+ <p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto neon-text-blue">
414
+ The ultimate festival companion for Piglet & Henley's wildest adventure yet!
415
+ </p>
416
+
417
+ <div class="flex flex-wrap justify-center gap-6 mb-12">
418
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-blue max-w-xs">
419
+ <h3 class="text-xl font-bold mb-3 neon-text-pink">Festival Survival Kit</h3>
420
+ <ul class="text-left space-y-2 text-sm">
421
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-blue-600 mr-2 flex items-center justify-center">1</span> Toilet Zone Radar</li>
422
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-pink-600 mr-2 flex items-center justify-center">2</span> Nan Emergency Button</li>
423
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-yellow-600 mr-2 flex items-center justify-center">3</span> Boring Convo Escape</li>
424
+ </ul>
425
+ </div>
426
+
427
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-pink max-w-xs">
428
+ <h3 class="text-xl font-bold mb-3 neon-text-yellow">Secret Messaging</h3>
429
+ <ul class="text-left space-y-2 text-sm">
430
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-green-600 mr-2 flex items-center justify-center">1</span> Private Meme Exchange</li>
431
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-purple-600 mr-2 flex items-center justify-center">2</span> Roast Roulette</li>
432
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-yellow-600 mr-2 flex items-center justify-center">3</span> Auto Podcast Maker</li>
433
+ </ul>
434
+ </div>
435
+
436
+ <div class="bg-gray-900 p-6 rounded-2xl neon-border-yellow max-w-xs">
437
+ <h3 class="text-xl font-bold mb-3 neon-text-green">Post-Boom Memories</h3>
438
+ <ul class="text-left space-y-2 text-sm">
439
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-pink-600 mr-2 flex items-center justify-center">1</span> The Skibidi Scrolls</li>
440
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-blue-600 mr-2 flex items-center justify-center">2</span> Chaos Timeline</li>
441
+ <li class="flex items-center"><span class="inline-block w-6 h-6 rounded-full bg-green-600 mr-2 flex items-center justify-center">3</span> "Best Dance Fail" Awards</li>
442
+ </ul>
443
+ </div>
444
+ </div>
445
+
446
+ <button class="px-8 py-4 bg-gradient-to-r from-pink-600 to-purple-600 hover:from-pink-700 hover:to-purple-700 rounded-full font-bold text-xl neon-border-yellow skibidi-pulse">
447
+ Download BoomBuddy
448
+ </button>
449
+
450
+ <p class="mt-6 text-sm neon-text-blue">
451
+ * Private app - not available to normies *
452
+ </p>
453
+ </div>
454
+ </section>
455
+
456
+ <!-- Footer -->
457
+ <footer class="bg-black neon-border-green py-8">
458
+ <div class="container mx-auto px-4 text-center">
459
+ <div class="flex justify-center space-x-6 mb-6">
460
+ <a href="#" class="text-2xl neon-text-pink hover:neon-text-yellow"><i class="fab fa-instagram"></i></a>
461
+ <a href="#" class="text-2xl neon-text-blue hover:neon-text-pink"><i class="fab fa-tiktok"></i></a>
462
+ <a href="#" class="text-2xl neon-text-yellow hover:neon-text-green"><i class="fab fa-youtube"></i></a>
463
+ </div>
464
+ <p class="neon-text-purple mb-2">
465
+ Made with 💨 (Jean Paul Gaultier) for Piglet & Henley
466
+ </p>
467
+ <p class="text-sm text-gray-500">
468
+ © 2023 Skibidi Technologies Ltd. (Not a real company, just like Henley's haircut)
469
+ </p>
470
+ </div>
471
+ </footer>
472
+
473
+ <!-- Floating elements -->
474
+ <div class="fixed bottom-6 right-6 text-5xl neon-text-yellow skibidi-spin">
475
+ <span class="inline-block">🤪</span>
476
+ </div>
477
+
478
+ <div class="fixed top-1/4 left-6 text-3xl neon-text-pink skibidi-bounce">
479
+ <span class="inline-block">🐷</span>
480
+ </div>
481
+
482
+ <div class="fixed bottom-1/3 left-10 text-2xl neon-text-blue skibidi-flicker">
483
+ <span class="inline-block">👦</span>
484
+ </div>
485
+
486
+ <script>
487
+ // Simple animations
488
+ document.addEventListener('DOMContentLoaded', function() {
489
+ // Make feature cards pulse on hover
490
+ const features = document.querySelectorAll('.glow-hover');
491
+
492
+ features.forEach(feature => {
493
+ feature.addEventListener('mouseenter', function() {
494
+ this.style.boxShadow = `0 0 15px ${this.classList.contains('neon-border-blue') ? 'var(--neon-blue)' :
495
+ this.classList.contains('neon-border-pink') ? 'var(--neon-pink)' :
496
+ this.classList.contains('neon-border-yellow') ? 'var(--neon-yellow)' : 'var(--neon-green)'}`;
497
+ });
498
+
499
+ feature.addEventListener('mouseleave', function() {
500
+ this.style.boxShadow = '';
501
+ });
502
+ });
503
+
504
+ // Make download button more dramatic
505
+ const downloadBtn = document.querySelector('button');
506
+ downloadBtn.addEventListener('click', function() {
507
+ this.classList.add('animate__animated', 'animate__rubberBand');
508
+ setTimeout(() => {
509
+ this.classList.remove('animate__animated', 'animate__rubberBand');
510
+ }, 1000);
511
+
512
+ // Fake download prompt
513
+ alert("BoomBuddy is downloading to your Skibidi device!\n(Just kidding, this is a concept app for Piglet & Henley)");
514
+ });
515
+ });
516
+ </script>
517
+ <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=thetwistedpixie/boom-buddy-skibidi" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
518
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ Alright, let’s dream up a wicked custom app just for Piglet & Henley’s Boom Festival bonanza—we’ll call it: BoomBuddy: The Skibidi Odyssey Core Concept: A private, playful, AI-powered travel companion app built exclusively for Shane (Piglet) and Henley to document, enhance, and hilariously narrate their road trip adventure to Boom Festival. It’s part digital scrapbook, part AI jester, part safety net, and part creative studio. Totally bespoke. Totally cheeky. Totally them. --- FEATURES OVERVIEW 1. Live Skibidi Map Mode GPS tracking with Skibidi-themed voice navigation (“Oi Piglet, turn left or I’m telling Nan you got face tats!”). Custom avatars of Piglet & Henley with live trail animations. Henley can “drop a Skibidi Bomb” (virtual sticker) on random spots to mark snack stops, memes spotted, or good views. --- 2. AI-Generated Story Mode Real-time AI-generated comic strips or poems based on voice memos or photos. You two just talk nonsense into it—“Henley just farted and blamed the cows”—and it’ll spit back a Shakespearean sonnet or graphic novel panel with chaotic illustrations. --- 3. Perfume Spray Meter A hilarious mini-game where Henley has to sneak spray Jean Paul Gaultier on Piglet when he’s not looking. Using motion and proximity sensors (or fake it with a tap button), the app tracks successful “spray attacks,” unlocking badges like “Nasal Assassin” and “Eau de Skibidi.” --- 4. CamperVan Chaos Cam Connects to Insta360 (if you re-buy it!) or phone cam to record time-lapse travel diaries, with filters like: “Trippy Boom” “Festival Flashback” “HenleyVision” (fisheye chaos with meme overlays). --- 5. Offline Festival Survival Kit Henley’s Checklist (with voiceover reminders in Piglet’s voice: “Where’s ya hat, ya melt?”) Emergency button that sends GPS to trusted adults (a.k.a. Nan) Tips for how to Skibidi-dodge boring conversations “Toilet Zone Radar” using crowdsourced reports for best portaloos (users can rate each bog with emojis and comment like TripAdvisor: “Steamy but safe.”) --- 6. Secret Messaging Between You Two Only Like a festival Snapchat, but private. Send voice memos, memes, dares. AI turns your convo into a mini audio podcast with epic intro music. Bonus: “Roast Roulette” – tap to generate a random roast for each other. (“Henley’s haircut looks like a squirrel got electrocuted.”) --- 7. Post-Boom Memory Archive After the fest, the app auto-generates a digital zine called “The Skibidi Scrolls” with: Photos, quotes, memes, maps A timeline of adventures Festival awards like “Best Dance Move While Spilling Juice” --- 8. Augmented Reality Mischief Mode Henley can point the phone at Piglet and overlay cartoon effects in AR (tattoos go rainbow, cap explodes in glitter, etc.) Bonus: “Prank Portal” where AI suggests pranks to pull, scaled by “Naughty Level” --- TECH UNDER THE BONNET Built-in AI voice mimicry (your own voices for narration) Syncs across devices for both of you Works offline with smart syncing when online PIN-protected grown-up override if needed (for Nan peace of mind) --- Want me to mock up how the app looks or start building out the concept in code or wireframes? Or even write promo copy for the app store page? Let’s take it wherever you fancy.