Hugging Face's logo

Spaces:
dodey917
/
wear-fun
Running

App Files Community
dodey917 commited on
Commit
35f1855
·
verified ·
1 Parent(s): 1c5961e

The Shop Collection is not completed

Browse files
Files changed (1) hide show
  1. shop.html +125 -3
shop.html CHANGED
@@ -25,7 +25,129 @@
25
  <button class="bg-gray-800 hover:bg-gray-700 px-4 py-2 rounded-lg transition">Hoodies</button>
26
  <button class="bg-gray-800 hover:bg-gray-700 px-4 py-2 rounded-lg transition">Mugs</button>
27
  </div>
28
-
29
- <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
30
  </body>
31
- </html>
 
25
  <button class="bg-gray-800 hover:bg-gray-700 px-4 py-2 rounded-lg transition">Hoodies</button>
26
  <button class="bg-gray-800 hover:bg-gray-700 px-4 py-2 rounded-lg transition">Mugs</button>
27
  </div>
28
+ <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-8">
29
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
30
+ <div class="h-64 bg-gradient-to-r from-red-900 to-black flex items-center justify-center">
31
+ <i data-feather="t-shirt" class="w-20 h-20 text-red-500/30"></i>
32
+ </div>
33
+ <div class="p-6">
34
+ <h3 class="font-bold text-lg mb-2">Diamond Hands Tee</h3>
35
+ <p class="text-gray-400 text-sm mb-4">Premium cotton with crypto meme</p>
36
+ <div class="flex justify-between items-center">
37
+ <span class="font-bold text-xl">$24.99</span>
38
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
39
+ </div>
40
+ </div>
41
+ </div>
42
+
43
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
44
+ <div class="h-64 bg-gradient-to-r from-blue-900 to-black flex items-center justify-center">
45
+ <i data-feather="coffee" class="w-20 h-20 text-blue-500/30"></i>
46
+ </div>
47
+ <div class="p-6">
48
+ <h3 class="font-bold text-lg mb-2">HODL Mug</h3>
49
+ <p class="text-gray-400 text-sm mb-4">Ceramic mug with crypto humor</p>
50
+ <div class="flex justify-between items-center">
51
+ <span class="font-bold text-xl">$14.99</span>
52
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
53
+ </div>
54
+ </div>
55
+ </div>
56
+
57
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
58
+ <div class="h-64 bg-gradient-to-r from-purple-900 to-black flex items-center justify-center">
59
+ <i data-feather="smartphone" class="w-20 h-20 text-purple-500/30"></i>
60
+ </div>
61
+ <div class="p-6">
62
+ <h3 class="font-bold text-lg mb-2">To the Moon Case</h3>
63
+ <p class="text-gray-400 text-sm mb-4">Phone case with space meme</p>
64
+ <div class="flex justify-between items-center">
65
+ <span class="font-bold text-xl">$19.99</span>
66
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
67
+ </div>
68
+ </div>
69
+ </div>
70
+
71
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
72
+ <div class="h-64 bg-gradient-to-r from-green-900 to-black flex items-center justify-center">
73
+ <i data-feather="shopping-bag" class="w-20 h-20 text-green-500/30"></i>
74
+ </div>
75
+ <div class="p-6">
76
+ <h3 class="font-bold text-lg mb-2">WAGMI Tote</h3>
77
+ <p class="text-gray-400 text-sm mb-4">Eco-friendly tote bag</p>
78
+ <div class="flex justify-between items-center">
79
+ <span class="font-bold text-xl">$17.99</span>
80
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
81
+ </div>
82
+ </div>
83
+ </div>
84
+
85
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
86
+ <div class="h-64 bg-gradient-to-r from-yellow-900 to-black flex items-center justify-center">
87
+ <i data-feather="star" class="w-20 h-20 text-yellow-500/30"></i>
88
+ </div>
89
+ <div class="p-6">
90
+ <h3 class="font-bold text-lg mb-2">Stonks Hoodie</h3>
91
+ <p class="text-gray-400 text-sm mb-4">Comfortable hoodie with meme</p>
92
+ <div class="flex justify-between items-center">
93
+ <span class="font-bold text-xl">$49.99</span>
94
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
95
+ </div>
96
+ </div>
97
+ </div>
98
+
99
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
100
+ <div class="h-64 bg-gradient-to-r from-pink-900 to-black flex items-center justify-center">
101
+ <i data-feather="heart" class="w-20 h-20 text-pink-500/30"></i>
102
+ </div>
103
+ <div class="p-6">
104
+ <h3 class="font-bold text-lg mb-2">NFT Cap</h3>
105
+ <p class="text-gray-400 text-sm mb-4">Snapback with NFT design</p>
106
+ <div class="flex justify-between items-center">
107
+ <span class="font-bold text-xl">$22.99</span>
108
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
109
+ </div>
110
+ </div>
111
+ </div>
112
+
113
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
114
+ <div class="h-64 bg-gradient-to-r from-indigo-900 to-black flex items-center justify-center">
115
+ <i data-feather="cpu" class="w-20 h-20 text-indigo-500/30"></i>
116
+ </div>
117
+ <div class="p-6">
118
+ <h3 class="font-bold text-lg mb-2">DeFi Wallet</h3>
119
+ <p class="text-gray-400 text-sm mb-4">Leather wallet with crypto art</p>
120
+ <div class="flex justify-between items-center">
121
+ <span class="font-bold text-xl">$34.99</span>
122
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
123
+ </div>
124
+ </div>
125
+ </div>
126
+
127
+ <div class="bg-gray-900 rounded-xl overflow-hidden border border-gray-800 hover:border-red-500 transition">
128
+ <div class="h-64 bg-gradient-to-r from-gray-800 to-black flex items-center justify-center">
129
+ <i data-feather="zap" class="w-20 h-20 text-gray-500/30"></i>
130
+ </div>
131
+ <div class="p-6">
132
+ <h3 class="font-bold text-lg mb-2">Lightning Tee</h3>
133
+ <p class="text-gray-400 text-sm mb-4">Electric meme t-shirt</p>
134
+ <div class="flex justify-between items-center">
135
+ <span class="font-bold text-xl">$24.99</span>
136
+ <button class="bg-red-600 hover:bg-red-700 px-4 py-2 rounded-lg transition">Add to Cart</button>
137
+ </div>
138
+ </div>
139
+ </div>
140
+ </div>
141
+ </div>
142
+ </main>
143
+
144
+ <custom-footer></custom-footer>
145
+
146
+ <script src="components/header.js"></script>
147
+ <script src="components/footer.js"></script>
148
+ <script src="script.js"></script>
149
+ <script>
150
+ feather.replace();
151
+ </script>
152
  </body>
153
+ </html>