rajeshuriti commited on
Commit
fe82107
·
verified ·
1 Parent(s): 2cb7fd7

change to Rolex Image - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +6 -4
  2. index.html +383 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Shopsphere
3
- emoji: 📈
4
  colorFrom: yellow
5
- colorTo: blue
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: shopsphere
3
+ emoji: 🐳
4
  colorFrom: yellow
5
+ colorTo: yellow
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,383 @@
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>ShopSphere - Your Shopping Cart</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
+ /* Custom animations */
11
+ @keyframes slideIn {
12
+ from { transform: translateY(20px); opacity: 0; }
13
+ to { transform: translateY(0); opacity: 1; }
14
+ }
15
+
16
+ .animate-slide-in {
17
+ animation: slideIn 0.3s ease-out forwards;
18
+ }
19
+
20
+ /* Custom scrollbar */
21
+ ::-webkit-scrollbar {
22
+ width: 8px;
23
+ }
24
+
25
+ ::-webkit-scrollbar-track {
26
+ background: #f1f1f1;
27
+ border-radius: 10px;
28
+ }
29
+
30
+ ::-webkit-scrollbar-thumb {
31
+ background: #888;
32
+ border-radius: 10px;
33
+ }
34
+
35
+ ::-webkit-scrollbar-thumb:hover {
36
+ background: #555;
37
+ }
38
+
39
+ /* Pulse animation for empty cart */
40
+ @keyframes pulse {
41
+ 0%, 100% { transform: scale(1); }
42
+ 50% { transform: scale(1.05); }
43
+ }
44
+
45
+ .animate-pulse {
46
+ animation: pulse 2s infinite;
47
+ }
48
+ </style>
49
+ </head>
50
+ <body class="bg-gray-50 min-h-screen font-sans">
51
+ <!-- Header -->
52
+ <header class="bg-indigo-600 text-white shadow-lg sticky top-0 z-50">
53
+ <div class="container mx-auto px-4 py-4 flex justify-between items-center">
54
+ <div class="flex items-center space-x-2">
55
+ <i class="fas fa-shopping-bag text-2xl"></i>
56
+ <h1 class="text-2xl font-bold">ShopSphere</h1>
57
+ </div>
58
+ <div class="relative">
59
+ <button id="cartButton" class="relative p-2 rounded-full hover:bg-indigo-700 transition">
60
+ <i class="fas fa-shopping-cart text-xl"></i>
61
+ <span id="cartCount" class="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center">0</span>
62
+ </button>
63
+ </div>
64
+ </div>
65
+ </header>
66
+
67
+ <!-- Main Content -->
68
+ <main class="container mx-auto px-4 py-8">
69
+ <!-- Products Section -->
70
+ <section class="mb-12">
71
+ <h2 class="text-2xl font-bold mb-6 text-gray-800 border-b pb-2">Featured Products</h2>
72
+ <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
73
+ <!-- Product 1 -->
74
+ <div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition duration-300 animate-slide-in">
75
+ <div class="relative">
76
+ <img src="https://images.unsplash.com/photo-1546868871-7041f2a55e12?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=764&q=80" alt="Wireless Headphones" class="w-full h-48 object-cover">
77
+ <span class="absolute top-2 right-2 bg-green-500 text-white text-xs px-2 py-1 rounded-full">NEW</span>
78
+ </div>
79
+ <div class="p-4">
80
+ <h3 class="font-semibold text-lg mb-1">Wireless Headphones</h3>
81
+ <p class="text-gray-600 text-sm mb-2">Premium sound quality with noise cancellation</p>
82
+ <div class="flex justify-between items-center">
83
+ <span class="font-bold text-indigo-600">$129.99</span>
84
+ <button onclick="addToCart('Wireless Headphones', 129.99, 'https://images.unsplash.com/photo-1546868871-7041f2a55e12?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=764&q=80')" class="bg-indigo-600 text-white px-3 py-1 rounded hover:bg-indigo-700 transition">
85
+ <i class="fas fa-cart-plus mr-1"></i> Add
86
+ </button>
87
+ </div>
88
+ </div>
89
+ </div>
90
+
91
+ <!-- Product 2 -->
92
+ <div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition duration-300 animate-slide-in" style="animation-delay: 0.1s;">
93
+ <div class="relative">
94
+ <img src="https://images.unsplash.com/photo-1517336714731-489689fd1ca8?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1026&q=80" alt="MacBook Pro" class="w-full h-48 object-cover">
95
+ <span class="absolute top-2 right-2 bg-red-500 text-white text-xs px-2 py-1 rounded-full">SALE</span>
96
+ </div>
97
+ <div class="p-4">
98
+ <h3 class="font-semibold text-lg mb-1">MacBook Pro</h3>
99
+ <p class="text-gray-600 text-sm mb-2">16-inch, M2 Pro chip, 16GB RAM</p>
100
+ <div class="flex justify-between items-center">
101
+ <div>
102
+ <span class="font-bold text-indigo-600">$2,199.00</span>
103
+ <span class="text-sm text-gray-500 line-through ml-2">$2,499.00</span>
104
+ </div>
105
+ <button onclick="addToCart('MacBook Pro', 2199, 'https://images.unsplash.com/photo-1517336714731-489689fd1ca8?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1026&q=80')" class="bg-indigo-600 text-white px-3 py-1 rounded hover:bg-indigo-700 transition">
106
+ <i class="fas fa-cart-plus mr-1"></i> Add
107
+ </button>
108
+ </div>
109
+ </div>
110
+ </div>
111
+
112
+ <!-- Product 3 -->
113
+ <div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition duration-300 animate-slide-in" style="animation-delay: 0.2s;">
114
+ <img src="https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1099&q=80" alt="Smart Watch" class="w-full h-48 object-cover">
115
+ <div class="p-4">
116
+ <h3 class="font-semibold text-lg mb-1">Smart Watch</h3>
117
+ <p class="text-gray-600 text-sm mb-2">Fitness tracker & heart rate monitor</p>
118
+ <div class="flex justify-between items-center">
119
+ <span class="font-bold text-indigo-600">$199.99</span>
120
+ <button onclick="addToCart('Smart Watch', 199.99, 'https://images.unsplash.com/photo-1523275335684-37898b6baf30?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1099&q=80')" class="bg-indigo-600 text-white px-3 py-1 rounded hover:bg-indigo-700 transition">
121
+ <i class="fas fa-cart-plus mr-1"></i> Add
122
+ </button>
123
+ </div>
124
+ </div>
125
+ </div>
126
+
127
+ <!-- Product 4 -->
128
+ <div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-xl transition duration-300 animate-slide-in" style="animation-delay: 0.3s;">
129
+ <div class="relative">
130
+ <img src="https://images.unsplash.com/photo-1505740420928-5e560c06d30e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1170&q=80" alt="Bluetooth Speaker" class="w-full h-48 object-cover">
131
+ <span class="absolute top-2 right-2 bg-yellow-500 text-white text-xs px-2 py-1 rounded-full">POPULAR</span>
132
+ </div>
133
+ <div class="p-4">
134
+ <h3 class="font-semibold text-lg mb-1">Bluetooth Speaker</h3>
135
+ <p class="text-gray-600 text-sm mb-2">Portable with 20h battery life</p>
136
+ <div class="flex justify-between items-center">
137
+ <span class="font-bold text-indigo-600">$89.99</span>
138
+ <button onclick="addToCart('Bluetooth Speaker', 89.99, 'https://images.unsplash.com/photo-1505740420928-5e560c06d30e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1170&q=80')" class="bg-indigo-600 text-white px-3 py-1 rounded hover:bg-indigo-700 transition">
139
+ <i class="fas fa-cart-plus mr-1"></i> Add
140
+ </button>
141
+ </div>
142
+ </div>
143
+ </div>
144
+ </div>
145
+ </section>
146
+
147
+ <!-- Special Offers -->
148
+ <section class="mb-12">
149
+ <h2 class="text-2xl font-bold mb-6 text-gray-800 border-b pb-2">Special Offers</h2>
150
+ <div class="bg-gradient-to-r from-purple-500 to-indigo-600 rounded-xl shadow-lg p-6 text-white">
151
+ <div class="flex flex-col md:flex-row items-center">
152
+ <div class="md:w-1/2 mb-6 md:mb-0">
153
+ <h3 class="text-2xl font-bold mb-2">Limited Time Offer!</h3>
154
+ <p class="mb-4">Get 15% off on all products when you spend over $200. Use code: SHOP15</p>
155
+ <button class="bg-white text-indigo-600 px-4 py-2 rounded-lg font-semibold hover:bg-gray-100 transition">
156
+ Shop Now
157
+ </button>
158
+ </div>
159
+ <div class="md:w-1/2 flex justify-center">
160
+ <img src="https://images.unsplash.com/photo-1607082348824-0a96f2a4b9da?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1170&q=80" alt="Special Offer" class="h-40 rounded-lg shadow-md">
161
+ </div>
162
+ </div>
163
+ </div>
164
+ </section>
165
+ </main>
166
+
167
+ <!-- Shopping Cart Sidebar -->
168
+ <div id="cartSidebar" class="fixed top-0 right-0 w-full sm:w-96 h-full bg-white shadow-xl z-50 transform translate-x-full transition-transform duration-300 ease-in-out overflow-y-auto">
169
+ <div class="p-6">
170
+ <div class="flex justify-between items-center mb-6 border-b pb-4">
171
+ <h2 class="text-2xl font-bold text-gray-800">
172
+ <i class="fas fa-shopping-cart mr-2 text-indigo-600"></i> Your Cart
173
+ </h2>
174
+ <button id="closeCart" class="text-gray-500 hover:text-gray-700">
175
+ <i class="fas fa-times text-xl"></i>
176
+ </button>
177
+ </div>
178
+
179
+ <div id="cartItems" class="mb-6">
180
+ <!-- Cart items will be added here dynamically -->
181
+ <div id="emptyCart" class="text-center py-12 animate-pulse">
182
+ <i class="fas fa-shopping-cart text-5xl text-gray-300 mb-4"></i>
183
+ <p class="text-gray-500 font-medium">Your cart is empty</p>
184
+ <p class="text-gray-400 text-sm">Start shopping to add items</p>
185
+ </div>
186
+ </div>
187
+
188
+ <div id="cartSummary" class="border-t pt-4 hidden">
189
+ <div class="flex justify-between mb-2">
190
+ <span class="text-gray-600">Subtotal:</span>
191
+ <span id="subtotal" class="font-semibold">$0.00</span>
192
+ </div>
193
+ <div class="flex justify-between mb-2">
194
+ <span class="text-gray-600">Shipping:</span>
195
+ <span id="shipping" class="font-semibold">$0.00</span>
196
+ </div>
197
+ <div class="flex justify-between mb-4 text-lg">
198
+ <span class="text-gray-800 font-bold">Total:</span>
199
+ <span id="total" class="font-bold text-indigo-600">$0.00</span>
200
+ </div>
201
+ <button id="checkoutBtn" class="w-full bg-indigo-600 text-white py-3 rounded-lg font-semibold hover:bg-indigo-700 transition flex items-center justify-center">
202
+ <i class="fas fa-credit-card mr-2"></i> Proceed to Checkout
203
+ </button>
204
+ <p class="text-center text-gray-500 text-sm mt-2">or <button id="continueShopping" class="text-indigo-600 hover:underline">continue shopping</button></p>
205
+ </div>
206
+ </div>
207
+ </div>
208
+
209
+ <!-- Overlay -->
210
+ <div id="overlay" class="fixed inset-0 bg-black bg-opacity-50 z-40 hidden"></div>
211
+
212
+ <!-- Notification Toast -->
213
+ <div id="toast" class="fixed bottom-4 right-4 bg-green-500 text-white px-6 py-3 rounded-lg shadow-lg transform translate-y-10 opacity-0 transition-all duration-300 flex items-center">
214
+ <i class="fas fa-check-circle mr-2"></i>
215
+ <span id="toastMessage">Item added to cart!</span>
216
+ </div>
217
+
218
+ <script>
219
+ // Cart data
220
+ let cart = [];
221
+
222
+ // DOM elements
223
+ const cartButton = document.getElementById('cartButton');
224
+ const cartSidebar = document.getElementById('cartSidebar');
225
+ const closeCart = document.getElementById('closeCart');
226
+ const overlay = document.getElementById('overlay');
227
+ const cartItems = document.getElementById('cartItems');
228
+ const emptyCart = document.getElementById('emptyCart');
229
+ const cartSummary = document.getElementById('cartSummary');
230
+ const subtotalEl = document.getElementById('subtotal');
231
+ const shippingEl = document.getElementById('shipping');
232
+ const totalEl = document.getElementById('total');
233
+ const cartCount = document.getElementById('cartCount');
234
+ const checkoutBtn = document.getElementById('checkoutBtn');
235
+ const continueShopping = document.getElementById('continueShopping');
236
+ const toast = document.getElementById('toast');
237
+ const toastMessage = document.getElementById('toastMessage');
238
+
239
+ // Toggle cart sidebar
240
+ cartButton.addEventListener('click', () => {
241
+ cartSidebar.classList.remove('translate-x-full');
242
+ overlay.classList.remove('hidden');
243
+ document.body.style.overflow = 'hidden';
244
+ });
245
+
246
+ closeCart.addEventListener('click', closeCartSidebar);
247
+ overlay.addEventListener('click', closeCartSidebar);
248
+ continueShopping.addEventListener('click', closeCartSidebar);
249
+
250
+ function closeCartSidebar() {
251
+ cartSidebar.classList.add('translate-x-full');
252
+ overlay.classList.add('hidden');
253
+ document.body.style.overflow = 'auto';
254
+ }
255
+
256
+ // Add to cart function
257
+ function addToCart(name, price, image) {
258
+ // Check if item already exists in cart
259
+ const existingItem = cart.find(item => item.name === name);
260
+
261
+ if (existingItem) {
262
+ existingItem.quantity += 1;
263
+ } else {
264
+ cart.push({
265
+ name,
266
+ price,
267
+ image,
268
+ quantity: 1
269
+ });
270
+ }
271
+
272
+ updateCart();
273
+ showToast(`${name} added to cart`);
274
+ }
275
+
276
+ // Update cart UI
277
+ function updateCart() {
278
+ // Update cart count
279
+ const totalItems = cart.reduce((sum, item) => sum + item.quantity, 0);
280
+ cartCount.textContent = totalItems;
281
+
282
+ // Update cart items
283
+ if (cart.length === 0) {
284
+ emptyCart.classList.remove('hidden');
285
+ cartSummary.classList.add('hidden');
286
+ } else {
287
+ emptyCart.classList.add('hidden');
288
+ cartSummary.classList.remove('hidden');
289
+
290
+ // Clear existing items
291
+ cartItems.innerHTML = '';
292
+
293
+ // Add each item to cart
294
+ cart.forEach((item, index) => {
295
+ const itemTotal = (item.price * item.quantity).toFixed(2);
296
+
297
+ const itemEl = document.createElement('div');
298
+ itemEl.className = 'flex items-center mb-4 pb-4 border-b';
299
+ itemEl.innerHTML = `
300
+ <div class="flex-shrink-0 w-16 h-16 bg-gray-200 rounded-md overflow-hidden">
301
+ <img src="${item.image}" alt="${item.name}" class="w-full h-full object-cover">
302
+ </div>
303
+ <div class="ml-4 flex-grow">
304
+ <h3 class="font-medium text-gray-800">${item.name}</h3>
305
+ <p class="text-gray-600 text-sm">$${item.price.toFixed(2)}</p>
306
+ <div class="flex items-center mt-1">
307
+ <button onclick="updateQuantity(${index}, -1)" class="text-gray-500 hover:text-indigo-600">
308
+ <i class="fas fa-minus text-xs"></i>
309
+ </button>
310
+ <span class="mx-2 text-gray-800">${item.quantity}</span>
311
+ <button onclick="updateQuantity(${index}, 1)" class="text-gray-500 hover:text-indigo-600">
312
+ <i class="fas fa-plus text-xs"></i>
313
+ </button>
314
+ </div>
315
+ </div>
316
+ <div class="ml-4 text-right">
317
+ <span class="font-semibold">$${itemTotal}</span>
318
+ <button onclick="removeItem(${index})" class="block mt-1 text-red-500 hover:text-red-700 text-sm">
319
+ <i class="fas fa-trash"></i>
320
+ </button>
321
+ </div>
322
+ `;
323
+
324
+ cartItems.appendChild(itemEl);
325
+ });
326
+
327
+ // Update summary
328
+ const subtotal = cart.reduce((sum, item) => sum + (item.price * item.quantity), 0);
329
+ const shipping = subtotal > 0 ? (subtotal > 50 ? 0 : 5.99) : 0;
330
+ const total = subtotal + shipping;
331
+
332
+ subtotalEl.textContent = `$${subtotal.toFixed(2)}`;
333
+ shippingEl.textContent = shipping === 0 ? 'FREE' : `$${shipping.toFixed(2)}`;
334
+ totalEl.textContent = `$${total.toFixed(2)}`;
335
+ }
336
+ }
337
+
338
+ // Update item quantity
339
+ function updateQuantity(index, change) {
340
+ cart[index].quantity += change;
341
+
342
+ // Remove item if quantity reaches 0
343
+ if (cart[index].quantity <= 0) {
344
+ cart.splice(index, 1);
345
+ showToast('Item removed from cart');
346
+ }
347
+
348
+ updateCart();
349
+ }
350
+
351
+ // Remove item from cart
352
+ function removeItem(index) {
353
+ const itemName = cart[index].name;
354
+ cart.splice(index, 1);
355
+ updateCart();
356
+ showToast(`${itemName} removed from cart`);
357
+ }
358
+
359
+ // Show toast notification
360
+ function showToast(message) {
361
+ toastMessage.textContent = message;
362
+ toast.classList.remove('translate-y-10', 'opacity-0');
363
+ toast.classList.add('translate-y-0', 'opacity-100');
364
+
365
+ setTimeout(() => {
366
+ toast.classList.remove('translate-y-0', 'opacity-100');
367
+ toast.classList.add('translate-y-10', 'opacity-0');
368
+ }, 3000);
369
+ }
370
+
371
+ // Checkout button
372
+ checkoutBtn.addEventListener('click', () => {
373
+ if (cart.length > 0) {
374
+ showToast('Checkout functionality would go here!');
375
+ // In a real app, you would redirect to checkout page or show a checkout form
376
+ }
377
+ });
378
+
379
+ // Initialize cart
380
+ updateCart();
381
+ </script>
382
+ <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=rajeshuriti/shopsphere" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
383
+ </html>