Hugging Face's logo

Spaces:
ninajamy
/
mydeepsite
Running

App Files Community
ninajamy commited on
Commit
0eea319
·
verified ·
1 Parent(s): 1f822fe

my site amazon - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +6 -4
  2. index.html +403 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Mydeepsite
3
- emoji: 🐢
4
- colorFrom: gray
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: mydeepsite
3
+ emoji: 🐳
4
+ colorFrom: green
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,403 @@
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>My Amazon Clone</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
+ .dropdown:hover .dropdown-menu {
11
+ display: block;
12
+ }
13
+ .carousel {
14
+ scroll-behavior: smooth;
15
+ }
16
+ .product-card:hover {
17
+ transform: translateY(-5px);
18
+ box-shadow: 0 10px 20px rgba(0,0,0,0.1);
19
+ }
20
+ </style>
21
+ </head>
22
+ <body class="bg-gray-100">
23
+ <!-- Header -->
24
+ <header class="bg-gray-900 text-white">
25
+ <div class="container mx-auto px-4 py-3">
26
+ <!-- Top Nav -->
27
+ <div class="flex items-center justify-between">
28
+ <div class="flex items-center">
29
+ <a href="#" class="text-2xl font-bold text-orange-400">myAmazon</a>
30
+ <div class="ml-6 hidden md:block">
31
+ <div class="relative">
32
+ <div class="flex items-center cursor-pointer hover:text-orange-300">
33
+ <i class="fas fa-map-marker-alt mr-1"></i>
34
+ <span>Deliver to <br>United States</span>
35
+ </div>
36
+ </div>
37
+ </div>
38
+ </div>
39
+
40
+ <!-- Search Bar -->
41
+ <div class="flex-1 mx-4 hidden md:block">
42
+ <div class="flex">
43
+ <select class="bg-gray-100 text-black px-2 rounded-l-md border-r border-gray-300">
44
+ <option>All</option>
45
+ <option>Electronics</option>
46
+ <option>Books</option>
47
+ <option>Home</option>
48
+ </select>
49
+ <input type="text" class="flex-1 px-4 py-2 text-black" placeholder="Search myAmazon">
50
+ <button class="bg-orange-400 hover:bg-orange-500 px-4 py-2 rounded-r-md">
51
+ <i class="fas fa-search"></i>
52
+ </button>
53
+ </div>
54
+ </div>
55
+
56
+ <!-- Right Nav -->
57
+ <div class="flex items-center space-x-4">
58
+ <div class="hidden md:block">
59
+ <div class="dropdown relative">
60
+ <button class="hover:text-orange-300">
61
+ <span class="text-xs">Hello, Sign in</span><br>
62
+ <span class="font-bold">Account & Lists</span>
63
+ </button>
64
+ <div class="dropdown-menu absolute hidden bg-white text-black mt-1 p-4 rounded shadow-lg w-48">
65
+ <a href="#" class="block py-1 hover:text-orange-500">Sign In</a>
66
+ <a href="#" class="block py-1 hover:text-orange-500">Create Account</a>
67
+ <hr class="my-2">
68
+ <a href="#" class="block py-1 hover:text-orange-500">Your Orders</a>
69
+ <a href="#" class="block py-1 hover:text-orange-500">Your Lists</a>
70
+ </div>
71
+ </div>
72
+ </div>
73
+ <div class="hidden md:block">
74
+ <a href="#" class="hover:text-orange-300">
75
+ <span class="text-xs">Returns</span><br>
76
+ <span class="font-bold">& Orders</span>
77
+ </a>
78
+ </div>
79
+ <div class="relative">
80
+ <a href="#" class="hover:text-orange-300">
81
+ <i class="fas fa-shopping-cart text-2xl"></i>
82
+ <span class="absolute -top-2 -right-2 bg-orange-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center">0</span>
83
+ <span class="hidden md:inline font-bold">Cart</span>
84
+ </a>
85
+ </div>
86
+ <button class="md:hidden text-2xl" id="mobile-menu-button">
87
+ <i class="fas fa-bars"></i>
88
+ </button>
89
+ </div>
90
+ </div>
91
+
92
+ <!-- Mobile Search (hidden on desktop) -->
93
+ <div class="mt-3 md:hidden">
94
+ <div class="flex">
95
+ <input type="text" class="flex-1 px-4 py-2 text-black rounded-l-md" placeholder="Search myAmazon">
96
+ <button class="bg-orange-400 hover:bg-orange-500 px-4 py-2 rounded-r-md">
97
+ <i class="fas fa-search"></i>
98
+ </button>
99
+ </div>
100
+ </div>
101
+
102
+ <!-- Bottom Nav -->
103
+ <nav class="hidden md:flex items-center mt-3 space-x-4 text-sm">
104
+ <a href="#" class="flex items-center hover:text-orange-300">
105
+ <i class="fas fa-bars mr-1"></i>
106
+ All
107
+ </a>
108
+ <a href="#" class="hover:text-orange-300">Today's Deals</a>
109
+ <a href="#" class="hover:text-orange-300">Customer Service</a>
110
+ <a href="#" class="hover:text-orange-300">Registry</a>
111
+ <a href="#" class="hover:text-orange-300">Gift Cards</a>
112
+ <a href="#" class="hover:text-orange-300">Sell</a>
113
+ </nav>
114
+ </div>
115
+
116
+ <!-- Mobile Menu (hidden by default) -->
117
+ <div class="hidden bg-gray-800 p-4" id="mobile-menu">
118
+ <a href="#" class="block py-2 hover:text-orange-300">All</a>
119
+ <a href="#" class="block py-2 hover:text-orange-300">Today's Deals</a>
120
+ <a href="#" class="block py-2 hover:text-orange-300">Customer Service</a>
121
+ <a href="#" class="block py-2 hover:text-orange-300">Registry</a>
122
+ <a href="#" class="block py-2 hover:text-orange-300">Gift Cards</a>
123
+ <a href="#" class="block py-2 hover:text-orange-300">Sell</a>
124
+ <hr class="my-2 border-gray-700">
125
+ <a href="#" class="block py-2 hover:text-orange-300">Sign In</a>
126
+ <a href="#" class="block py-2 hover:text-orange-300">Create Account</a>
127
+ </div>
128
+ </header>
129
+
130
+ <!-- Hero Section -->
131
+ <section class="bg-gray-100">
132
+ <div class="container mx-auto px-4 py-2">
133
+ <div class="relative overflow-hidden rounded-lg">
134
+ <div class="carousel flex overflow-x-auto snap-x snap-mandatory scroll-smooth" style="scrollbar-width: none;">
135
+ <div class="flex-none w-full snap-start">
136
+ <img src="https://m.media-amazon.com/images/I/61TD5JLGhIL._SX3000_.jpg" alt="Hero Banner" class="w-full">
137
+ </div>
138
+ <div class="flex-none w-full snap-start">
139
+ <img src="https://m.media-amazon.com/images/I/61jovjd+f9L._SX3000_.jpg" alt="Hero Banner" class="w-full">
140
+ </div>
141
+ <div class="flex-none w-full snap-start">
142
+ <img src="https://m.media-amazon.com/images/I/61DUO0NqyyL._SX3000_.jpg" alt="Hero Banner" class="w-full">
143
+ </div>
144
+ </div>
145
+ <div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2">
146
+ <button class="w-3 h-3 rounded-full bg-white opacity-50 hover:opacity-100" onclick="scrollCarousel(0)"></button>
147
+ <button class="w-3 h-3 rounded-full bg-white opacity-50 hover:opacity-100" onclick="scrollCarousel(1)"></button>
148
+ <button class="w-3 h-3 rounded-full bg-white opacity-50 hover:opacity-100" onclick="scrollCarousel(2)"></button>
149
+ </div>
150
+ </div>
151
+ </div>
152
+ </section>
153
+
154
+ <!-- Product Grid -->
155
+ <section class="container mx-auto px-4 py-6">
156
+ <h2 class="text-2xl font-bold mb-4">Today's Deals</h2>
157
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
158
+ <!-- Product Card 1 -->
159
+ <div class="bg-white rounded-lg shadow-md overflow-hidden product-card transition duration-300">
160
+ <div class="relative">
161
+ <img src="https://m.media-amazon.com/images/I/71Swqqe7XAL._AC_UY218_.jpg" alt="Product" class="w-full h-48 object-contain">
162
+ <div class="absolute top-2 left-2 bg-red-600 text-white text-xs px-2 py-1 rounded">30% off</div>
163
+ </div>
164
+ <div class="p-4">
165
+ <h3 class="font-bold text-lg mb-1">Amazon Echo Dot (4th Gen)</h3>
166
+ <div class="flex items-center mb-2">
167
+ <div class="flex text-yellow-400">
168
+ <i class="fas fa-star"></i>
169
+ <i class="fas fa-star"></i>
170
+ <i class="fas fa-star"></i>
171
+ <i class="fas fa-star"></i>
172
+ <i class="fas fa-star-half-alt"></i>
173
+ </div>
174
+ <span class="text-gray-600 text-sm ml-1">(12,345)</span>
175
+ </div>
176
+ <div class="mb-2">
177
+ <span class="text-red-600 font-bold">$29.99</span>
178
+ <span class="text-gray-500 line-through text-sm ml-2">$49.99</span>
179
+ </div>
180
+ <p class="text-green-600 text-sm mb-3">Get it by tomorrow</p>
181
+ <button class="w-full bg-yellow-400 hover:bg-yellow-500 py-1 rounded-md font-medium">Add to Cart</button>
182
+ </div>
183
+ </div>
184
+
185
+ <!-- Product Card 2 -->
186
+ <div class="bg-white rounded-lg shadow-md overflow-hidden product-card transition duration-300">
187
+ <div class="relative">
188
+ <img src="https://m.media-amazon.com/images/I/71wSnZk+OIL._AC_UY218_.jpg" alt="Product" class="w-full h-48 object-contain">
189
+ <div class="absolute top-2 left-2 bg-red-600 text-white text-xs px-2 py-1 rounded">20% off</div>
190
+ </div>
191
+ <div class="p-4">
192
+ <h3 class="font-bold text-lg mb-1">Apple AirPods Pro</h3>
193
+ <div class="flex items-center mb-2">
194
+ <div class="flex text-yellow-400">
195
+ <i class="fas fa-star"></i>
196
+ <i class="fas fa-star"></i>
197
+ <i class="fas fa-star"></i>
198
+ <i class="fas fa-star"></i>
199
+ <i class="fas fa-star"></i>
200
+ </div>
201
+ <span class="text-gray-600 text-sm ml-1">(45,678)</span>
202
+ </div>
203
+ <div class="mb-2">
204
+ <span class="text-red-600 font-bold">$199.00</span>
205
+ <span class="text-gray-500 line-through text-sm ml-2">$249.00</span>
206
+ </div>
207
+ <p class="text-green-600 text-sm mb-3">Get it by tomorrow</p>
208
+ <button class="w-full bg-yellow-400 hover:bg-yellow-500 py-1 rounded-md font-medium">Add to Cart</button>
209
+ </div>
210
+ </div>
211
+
212
+ <!-- Product Card 3 -->
213
+ <div class="bg-white rounded-lg shadow-md overflow-hidden product-card transition duration-300">
214
+ <div class="relative">
215
+ <img src="https://m.media-amazon.com/images/I/71S8U9VzLTL._AC_UY218_.jpg" alt="Product" class="w-full h-48 object-contain">
216
+ <div class="absolute top-2 left-2 bg-red-600 text-white text-xs px-2 py-1 rounded">15% off</div>
217
+ </div>
218
+ <div class="p-4">
219
+ <h3 class="font-bold text-lg mb-1">Samsung Galaxy Watch 5</h3>
220
+ <div class="flex items-center mb-2">
221
+ <div class="flex text-yellow-400">
222
+ <i class="fas fa-star"></i>
223
+ <i class="fas fa-star"></i>
224
+ <i class="fas fa-star"></i>
225
+ <i class="fas fa-star"></i>
226
+ <i class="far fa-star"></i>
227
+ </div>
228
+ <span class="text-gray-600 text-sm ml-1">(8,765)</span>
229
+ </div>
230
+ <div class="mb-2">
231
+ <span class="text-red-600 font-bold">$279.99</span>
232
+ <span class="text-gray-500 line-through text-sm ml-2">$329.99</span>
233
+ </div>
234
+ <p class="text-green-600 text-sm mb-3">Get it by tomorrow</p>
235
+ <button class="w-full bg-yellow-400 hover:bg-yellow-500 py-1 rounded-md font-medium">Add to Cart</button>
236
+ </div>
237
+ </div>
238
+
239
+ <!-- Product Card 4 -->
240
+ <div class="bg-white rounded-lg shadow-md overflow-hidden product-card transition duration-300">
241
+ <div class="relative">
242
+ <img src="https://m.media-amazon.com/images/I/61L5QgPvgqL._AC_UY218_.jpg" alt="Product" class="w-full h-48 object-contain">
243
+ <div class="absolute top-2 left-2 bg-red-600 text-white text-xs px-2 py-1 rounded">25% off</div>
244
+ </div>
245
+ <div class="p-4">
246
+ <h3 class="font-bold text-lg mb-1">Instant Pot Duo 7-in-1</h3>
247
+ <div class="flex items-center mb-2">
248
+ <div class="flex text-yellow-400">
249
+ <i class="fas fa-star"></i>
250
+ <i class="fas fa-star"></i>
251
+ <i class="fas fa-star"></i>
252
+ <i class="fas fa-star"></i>
253
+ <i class="fas fa-star-half-alt"></i>
254
+ </div>
255
+ <span class="text-gray-600 text-sm ml-1">(56,789)</span>
256
+ </div>
257
+ <div class="mb-2">
258
+ <span class="text-red-600 font-bold">$79.95</span>
259
+ <span class="text-gray-500 line-through text-sm ml-2">$99.95</span>
260
+ </div>
261
+ <p class="text-green-600 text-sm mb-3">Get it by tomorrow</p>
262
+ <button class="w-full bg-yellow-400 hover:bg-yellow-500 py-1 rounded-md font-medium">Add to Cart</button>
263
+ </div>
264
+ </div>
265
+ </div>
266
+ </section>
267
+
268
+ <!-- Categories Section -->
269
+ <section class="container mx-auto px-4 py-6">
270
+ <h2 class="text-2xl font-bold mb-4">Shop by Category</h2>
271
+ <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-4">
272
+ <a href="#" class="bg-white rounded-lg shadow-sm p-4 text-center hover:shadow-md transition duration-300">
273
+ <div class="w-16 h-16 mx-auto mb-2">
274
+ <i class="fas fa-laptop text-4xl text-blue-500"></i>
275
+ </div>
276
+ <span class="text-sm font-medium">Electronics</span>
277
+ </a>
278
+ <a href="#" class="bg-white rounded-lg shadow-sm p-4 text-center hover:shadow-md transition duration-300">
279
+ <div class="w-16 h-16 mx-auto mb-2">
280
+ <i class="fas fa-tshirt text-4xl text-purple-500"></i>
281
+ </div>
282
+ <span class="text-sm font-medium">Fashion</span>
283
+ </a>
284
+ <a href="#" class="bg-white rounded-lg shadow-sm p-4 text-center hover:shadow-md transition duration-300">
285
+ <div class="w-16 h-16 mx-auto mb-2">
286
+ <i class="fas fa-home text-4xl text-green-500"></i>
287
+ </div>
288
+ <span class="text-sm font-medium">Home</span>
289
+ </a>
290
+ <a href="#" class="bg-white rounded-lg shadow-sm p-4 text-center hover:shadow-md transition duration-300">
291
+ <div class="w-16 h-16 mx-auto mb-2">
292
+ <i class="fas fa-book text-4xl text-yellow-500"></i>
293
+ </div>
294
+ <span class="text-sm font-medium">Books</span>
295
+ </a>
296
+ <a href="#" class="bg-white rounded-lg shadow-sm p-4 text-center hover:shadow-md transition duration-300">
297
+ <div class="w-16 h-16 mx-auto mb-2">
298
+ <i class="fas fa-gamepad text-4xl text-red-500"></i>
299
+ </div>
300
+ <span class="text-sm font-medium">Games</span>
301
+ </a>
302
+ <a href="#" class="bg-white rounded-lg shadow-sm p-4 text-center hover:shadow-md transition duration-300">
303
+ <div class="w-16 h-16 mx-auto mb-2">
304
+ <i class="fas fa-utensils text-4xl text-orange-500"></i>
305
+ </div>
306
+ <span class="text-sm font-medium">Grocery</span>
307
+ </a>
308
+ </div>
309
+ </section>
310
+
311
+ <!-- Footer -->
312
+ <footer class="bg-gray-800 text-white py-8">
313
+ <div class="container mx-auto px-4">
314
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
315
+ <div>
316
+ <h3 class="font-bold text-lg mb-4">Get to Know Us</h3>
317
+ <ul class="space-y-2">
318
+ <li><a href="#" class="hover:text-orange-300">Careers</a></li>
319
+ <li><a href="#" class="hover:text-orange-300">Blog</a></li>
320
+ <li><a href="#" class="hover:text-orange-300">About myAmazon</a></li>
321
+ <li><a href="#" class="hover:text-orange-300">Investor Relations</a></li>
322
+ </ul>
323
+ </div>
324
+ <div>
325
+ <h3 class="font-bold text-lg mb-4">Make Money with Us</h3>
326
+ <ul class="space-y-2">
327
+ <li><a href="#" class="hover:text-orange-300">Sell products</a></li>
328
+ <li><a href="#" class="hover:text-orange-300">Sell on myAmazon</a></li>
329
+ <li><a href="#" class="hover:text-orange-300">Become an Affiliate</a></li>
330
+ <li><a href="#" class="hover:text-orange-300">Advertise Your Products</a></li>
331
+ </ul>
332
+ </div>
333
+ <div>
334
+ <h3 class="font-bold text-lg mb-4">Payment Products</h3>
335
+ <ul class="space-y-2">
336
+ <li><a href="#" class="hover:text-orange-300">myAmazon Business Card</a></li>
337
+ <li><a href="#" class="hover:text-orange-300">Shop with Points</a></li>
338
+ <li><a href="#" class="hover:text-orange-300">Reload Your Balance</a></li>
339
+ <li><a href="#" class="hover:text-orange-300">myAmazon Currency Converter</a></li>
340
+ </ul>
341
+ </div>
342
+ <div>
343
+ <h3 class="font-bold text-lg mb-4">Let Us Help You</h3>
344
+ <ul class="space-y-2">
345
+ <li><a href="#" class="hover:text-orange-300">Your Account</a></li>
346
+ <li><a href="#" class="hover:text-orange-300">Your Orders</a></li>
347
+ <li><a href="#" class="hover:text-orange-300">Shipping Rates & Policies</a></li>
348
+ <li><a href="#" class="hover:text-orange-300">Returns & Replacements</a></li>
349
+ <li><a href="#" class="hover:text-orange-300">Help</a></li>
350
+ </ul>
351
+ </div>
352
+ </div>
353
+ <hr class="border-gray-700 my-6">
354
+ <div class="flex flex-col md:flex-row justify-between items-center">
355
+ <div class="flex items-center mb-4 md:mb-0">
356
+ <img src="https://upload.wikimedia.org/wikipedia/commons/a/a9/Amazon_logo.svg" alt="Amazon Logo" class="h-6 mr-2">
357
+ <span class="text-sm">.com</span>
358
+ </div>
359
+ <div class="flex space-x-4">
360
+ <a href="#" class="text-sm hover:text-orange-300">Conditions of Use</a>
361
+ <a href="#" class="text-sm hover:text-orange-300">Privacy Notice</a>
362
+ <a href="#" class="text-sm hover:text-orange-300">Interest-Based Ads</a>
363
+ </div>
364
+ <div class="text-sm mt-4 md:mt-0">
365
+ © 1996-2023, myAmazon.com, Inc. or its affiliates
366
+ </div>
367
+ </div>
368
+ </div>
369
+ </footer>
370
+
371
+ <script>
372
+ // Mobile menu toggle
373
+ const mobileMenuButton = document.getElementById('mobile-menu-button');
374
+ const mobileMenu = document.getElementById('mobile-menu');
375
+
376
+ mobileMenuButton.addEventListener('click', () => {
377
+ mobileMenu.classList.toggle('hidden');
378
+ });
379
+
380
+ // Carousel navigation
381
+ function scrollCarousel(index) {
382
+ const carousel = document.querySelector('.carousel');
383
+ const items = document.querySelectorAll('.carousel > div');
384
+ carousel.scrollTo({
385
+ left: items[index].offsetLeft,
386
+ behavior: 'smooth'
387
+ });
388
+ }
389
+
390
+ // Auto-scroll carousel
391
+ let currentSlide = 0;
392
+ setInterval(() => {
393
+ const carousel = document.querySelector('.carousel');
394
+ const items = document.querySelectorAll('.carousel > div');
395
+ currentSlide = (currentSlide + 1) % items.length;
396
+ carousel.scrollTo({
397
+ left: items[currentSlide].offsetLeft,
398
+ behavior: 'smooth'
399
+ });
400
+ }, 5000);
401
+ </script>
402
+ <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=ninajamy/mydeepsite" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
403
+ </html>