amghsa commited on
Commit
47caf10
·
verified ·
1 Parent(s): 48255f1

undefined - Initial Deployment

Browse files
Files changed (2) hide show
  1. README.md +7 -5
  2. index.html +471 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Cry Amg
3
- emoji: 😻
4
- colorFrom: blue
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: cry-amg
3
+ emoji: 🐳
4
+ colorFrom: green
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,471 @@
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>Crypto Portfolio Tracker</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
+ .positive {
11
+ color: #10b981;
12
+ }
13
+ .negative {
14
+ color: #ef4444;
15
+ }
16
+ .scrollbar-hide::-webkit-scrollbar {
17
+ display: none;
18
+ }
19
+ .scrollbar-hide {
20
+ -ms-overflow-style: none;
21
+ scrollbar-width: none;
22
+ }
23
+ .blur-effect {
24
+ backdrop-filter: blur(10px);
25
+ -webkit-backdrop-filter: blur(10px);
26
+ }
27
+ .gradient-bg {
28
+ background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
29
+ }
30
+ .coin-logo {
31
+ width: 24px;
32
+ height: 24px;
33
+ border-radius: 50%;
34
+ object-fit: cover;
35
+ }
36
+ @media (max-width: 768px) {
37
+ .responsive-table th:nth-child(5),
38
+ .responsive-table td:nth-child(5),
39
+ .responsive-table th:nth-child(6),
40
+ .responsive-table td:nth-child(6),
41
+ .responsive-table th:nth-child(7),
42
+ .responsive-table td:nth-child(7) {
43
+ display: none;
44
+ }
45
+ }
46
+ </style>
47
+ </head>
48
+ <body class="bg-gray-900 text-gray-100 min-h-screen">
49
+ <div class="container mx-auto px-4 py-8">
50
+ <!-- Header -->
51
+ <header class="mb-8">
52
+ <div class="flex justify-between items-center mb-6">
53
+ <h1 class="text-3xl font-bold text-white">Crypto Portfolio</h1>
54
+ <div class="flex space-x-4">
55
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-lg flex items-center">
56
+ <i class="fas fa-plus mr-2"></i> Add Asset
57
+ </button>
58
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-4 py-2 rounded-lg flex items-center">
59
+ <i class="fas fa-filter mr-2"></i> Filter
60
+ </button>
61
+ </div>
62
+ </div>
63
+
64
+ <!-- Portfolio Summary -->
65
+ <div class="gradient-bg rounded-xl p-6 mb-6 shadow-lg">
66
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
67
+ <div class="bg-gray-800 bg-opacity-50 rounded-lg p-4 blur-effect">
68
+ <p class="text-gray-400 text-sm">Total Value</p>
69
+ <p class="text-2xl font-bold">$1,654.90</p>
70
+ </div>
71
+ <div class="bg-gray-800 bg-opacity-50 rounded-lg p-4 blur-effect">
72
+ <p class="text-gray-400 text-sm">24h Change</p>
73
+ <p class="text-2xl font-bold positive">+$124.65 (7.53%)</p>
74
+ </div>
75
+ <div class="bg-gray-800 bg-opacity-50 rounded-lg p-4 blur-effect">
76
+ <p class="text-gray-400 text-sm">All-time Profit</p>
77
+ <p class="text-2xl font-bold negative">-$89.42 (5.12%)</p>
78
+ </div>
79
+ <div class="bg-gray-800 bg-opacity-50 rounded-lg p-4 blur-effect">
80
+ <p class="text-gray-400 text-sm">Top Performer</p>
81
+ <div class="flex items-center">
82
+ <img src="https://cryptologos.cc/logos/myxfinity-myx-logo.png" class="coin-logo mr-2">
83
+ <p class="text-xl font-bold">MYX <span class="text-sm positive">+1451.31%</span></p>
84
+ </div>
85
+ </div>
86
+ </div>
87
+ </div>
88
+ </header>
89
+
90
+ <!-- Top Coins Section -->
91
+ <section class="mb-10">
92
+ <h2 class="text-xl font-semibold mb-4 flex items-center">
93
+ <i class="fas fa-star mr-2 text-yellow-400"></i> Top 7 Coins Analysts Are Watching
94
+ </h2>
95
+ <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-7 gap-4">
96
+ <!-- Coin 1 -->
97
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
98
+ <div class="flex items-center mb-3">
99
+ <img src="https://cryptologos.cc/logos/myxfinity-myx-logo.png" class="coin-logo mr-2">
100
+ <div>
101
+ <p class="font-medium">MYX</p>
102
+ <p class="text-xs text-gray-400">MYX Finance</p>
103
+ </div>
104
+ </div>
105
+ <p class="text-lg font-bold mb-1">$1.6549</p>
106
+ <p class="text-sm positive">+1451.31% (7d)</p>
107
+ </div>
108
+
109
+ <!-- Coin 2 -->
110
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
111
+ <div class="flex items-center mb-3">
112
+ <img src="https://cryptologos.cc/logos/illuvium-ilv-logo.png" class="coin-logo mr-2">
113
+ <div>
114
+ <p class="font-medium">ILV</p>
115
+ <p class="text-xs text-gray-400">Illuvium</p>
116
+ </div>
117
+ </div>
118
+ <p class="text-lg font-bold mb-1">$19.85</p>
119
+ <p class="text-sm positive">+58.17% (7d)</p>
120
+ </div>
121
+
122
+ <!-- Coin 3 -->
123
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
124
+ <div class="flex items-center mb-3">
125
+ <img src="https://cryptologos.cc/logos/bitdao-bit-logo.png" class="coin-logo mr-2">
126
+ <div>
127
+ <p class="font-medium">BIT</p>
128
+ <p class="text-xs text-gray-400">BitDAO</p>
129
+ </div>
130
+ </div>
131
+ <p class="text-lg font-bold mb-1">$1.0498</p>
132
+ <p class="text-sm positive">+49.79% (7d)</p>
133
+ </div>
134
+
135
+ <!-- Coin 4 -->
136
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
137
+ <div class="flex items-center mb-3">
138
+ <img src="https://cryptologos.cc/logos/superrare-rare-logo.png" class="coin-logo mr-2">
139
+ <div>
140
+ <p class="font-medium">RARE</p>
141
+ <p class="text-xs text-gray-400">SuperRare</p>
142
+ </div>
143
+ </div>
144
+ <p class="text-lg font-bold mb-1">$0.06386</p>
145
+ <p class="text-sm positive">+28.51% (7d)</p>
146
+ </div>
147
+
148
+ <!-- Coin 5 -->
149
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
150
+ <div class="flex items-center mb-3">
151
+ <img src="https://cryptologos.cc/logos/orca-orca-logo.png" class="coin-logo mr-2">
152
+ <div>
153
+ <p class="font-medium">ORCA</p>
154
+ <p class="text-xs text-gray-400">Orca</p>
155
+ </div>
156
+ </div>
157
+ <p class="text-lg font-bold mb-1">$2.7489</p>
158
+ <p class="text-sm positive">+26.86% (7d)</p>
159
+ </div>
160
+
161
+ <!-- Coin 6 -->
162
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
163
+ <div class="flex items-center mb-3">
164
+ <img src="https://cryptologos.cc/logos/epic-coin-epic-logo.png" class="coin-logo mr-2">
165
+ <div>
166
+ <p class="font-medium">EPIC</p>
167
+ <p class="text-xs text-gray-400">Epic Chain</p>
168
+ </div>
169
+ </div>
170
+ <p class="text-lg font-bold mb-1">$2.2999</p>
171
+ <p class="text-sm positive">+23.69% (7d)</p>
172
+ </div>
173
+
174
+ <!-- Coin 7 -->
175
+ <div class="bg-gray-800 rounded-lg p-4 hover:bg-gray-700 transition cursor-pointer">
176
+ <div class="flex items-center mb-3">
177
+ <img src="https://cryptologos.cc/logos/polygon-matic-logo.png" class="coin-logo mr-2">
178
+ <div>
179
+ <p class="font-medium">WMATIC</p>
180
+ <p class="text-xs text-gray-400">Wrapped Matic</p>
181
+ </div>
182
+ </div>
183
+ <p class="text-lg font-bold mb-1">$0.2462</p>
184
+ <p class="text-sm positive">+22.88% (7d)</p>
185
+ </div>
186
+ </div>
187
+ </section>
188
+
189
+ <!-- Main Table -->
190
+ <section>
191
+ <div class="flex justify-between items-center mb-4">
192
+ <h2 class="text-xl font-semibold">Your Assets</h2>
193
+ <div class="relative">
194
+ <input type="text" placeholder="Search coins..." class="bg-gray-800 rounded-lg pl-10 pr-4 py-2 w-64 focus:outline-none focus:ring-2 focus:ring-blue-500">
195
+ <i class="fas fa-search absolute left-3 top-3 text-gray-500"></i>
196
+ </div>
197
+ </div>
198
+
199
+ <div class="overflow-x-auto scrollbar-hide">
200
+ <table class="w-full responsive-table">
201
+ <thead class="bg-gray-800 text-gray-400">
202
+ <tr>
203
+ <th class="py-3 px-4 text-left rounded-tl-lg">Name</th>
204
+ <th class="py-3 px-4 text-left">Price</th>
205
+ <th class="py-3 px-4 text-left">1h%</th>
206
+ <th class="py-3 px-4 text-left">24h%</th>
207
+ <th class="py-3 px-4 text-left">7d%</th>
208
+ <th class="py-3 px-4 text-left">Holdings</th>
209
+ <th class="py-3 px-4 text-left">Avg Buy</th>
210
+ <th class="py-3 px-4 text-left">P/L</th>
211
+ <th class="py-3 px-4 text-right rounded-tr-lg">Actions</th>
212
+ </tr>
213
+ </thead>
214
+ <tbody class="divide-y divide-gray-800">
215
+ <!-- MYX Finance -->
216
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
217
+ <td class="py-4 px-4">
218
+ <div class="flex items-center">
219
+ <img src="https://cryptologos.cc/logos/myxfinity-myx-logo.png" class="coin-logo mr-3">
220
+ <div>
221
+ <p class="font-medium">MYX</p>
222
+ <p class="text-xs text-gray-400">MYX Finance</p>
223
+ </div>
224
+ </div>
225
+ </td>
226
+ <td class="py-4 px-4 font-medium">$1.6549</td>
227
+ <td class="py-4 px-4 positive">+1.60%</td>
228
+ <td class="py-4 px-4 positive">+6.80%</td>
229
+ <td class="py-4 px-4 positive">+1451.31%</td>
230
+ <td class="py-4 px-4">
231
+ <p class="font-medium">$1.6549</p>
232
+ <p class="text-xs text-gray-400">1 MYX</p>
233
+ </td>
234
+ <td class="py-4 px-4">$2.0052</td>
235
+ <td class="py-4 px-4 negative">-$0.3503</td>
236
+ <td class="py-4 px-4 text-right">
237
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
238
+ <i class="fas fa-exchange-alt"></i>
239
+ </button>
240
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
241
+ <i class="fas fa-ellipsis-v"></i>
242
+ </button>
243
+ </td>
244
+ </tr>
245
+
246
+ <!-- Illuvium -->
247
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
248
+ <td class="py-4 px-4">
249
+ <div class="flex items-center">
250
+ <img src="https://cryptologos.cc/logos/illuvium-ilv-logo.png" class="coin-logo mr-3">
251
+ <div>
252
+ <p class="font-medium">ILV</p>
253
+ <p class="text-xs text-gray-400">Illuvium</p>
254
+ </div>
255
+ </div>
256
+ </td>
257
+ <td class="py-4 px-4 font-medium">$19.85</td>
258
+ <td class="py-4 px-4 positive">+1.52%</td>
259
+ <td class="py-4 px-4 positive">+1.27%</td>
260
+ <td class="py-4 px-4 positive">+58.17%</td>
261
+ <td class="py-4 px-4">
262
+ <p class="font-medium">$1.9847</p>
263
+ <p class="text-xs text-gray-400">0.1 ILV</p>
264
+ </td>
265
+ <td class="py-4 px-4">$46.94</td>
266
+ <td class="py-4 px-4 negative">-$2.7093</td>
267
+ <td class="py-4 px-4 text-right">
268
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
269
+ <i class="fas fa-exchange-alt"></i>
270
+ </button>
271
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
272
+ <i class="fas fa-ellipsis-v"></i>
273
+ </button>
274
+ </td>
275
+ </tr>
276
+
277
+ <!-- BitDAO -->
278
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
279
+ <td class="py-4 px-4">
280
+ <div class="flex items-center">
281
+ <img src="https://cryptologos.cc/logos/bitdao-bit-logo.png" class="coin-logo mr-3">
282
+ <div>
283
+ <p class="font-medium">BIT</p>
284
+ <p class="text-xs text-gray-400">BitDAO</p>
285
+ </div>
286
+ </div>
287
+ </td>
288
+ <td class="py-4 px-4 font-medium">$1.0498</td>
289
+ <td class="py-4 px-4 positive">+0.68%</td>
290
+ <td class="py-4 px-4 positive">+4.91%</td>
291
+ <td class="py-4 px-4 positive">+49.79%</td>
292
+ <td class="py-4 px-4">
293
+ <p class="font-medium">$1.0498</p>
294
+ <p class="text-xs text-gray-400">1 BIT</p>
295
+ </td>
296
+ <td class="py-4 px-4">$0.7418</td>
297
+ <td class="py-4 px-4 positive">+$0.308</td>
298
+ <td class="py-4 px-4 text-right">
299
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
300
+ <i class="fas fa-exchange-alt"></i>
301
+ </button>
302
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
303
+ <i class="fas fa-ellipsis-v"></i>
304
+ </button>
305
+ </td>
306
+ </tr>
307
+
308
+ <!-- SuperRare -->
309
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
310
+ <td class="py-4 px-4">
311
+ <div class="flex items-center">
312
+ <img src="https://cryptologos.cc/logos/superrare-rare-logo.png" class="coin-logo mr-3">
313
+ <div>
314
+ <p class="font-medium">RARE</p>
315
+ <p class="text-xs text-gray-400">SuperRare</p>
316
+ </div>
317
+ </div>
318
+ </td>
319
+ <td class="py-4 px-4 font-medium">$0.06386</td>
320
+ <td class="py-4 px-4 positive">+0.11%</td>
321
+ <td class="py-4 px-4 positive">+0.81%</td>
322
+ <td class="py-4 px-4 positive">+28.51%</td>
323
+ <td class="py-4 px-4">
324
+ <p class="font-medium">$0.6386</p>
325
+ <p class="text-xs text-gray-400">10 RARE</p>
326
+ </td>
327
+ <td class="py-4 px-4">$0.1926</td>
328
+ <td class="py-4 px-4 negative">-$1.2874</td>
329
+ <td class="py-4 px-4 text-right">
330
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
331
+ <i class="fas fa-exchange-alt"></i>
332
+ </button>
333
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
334
+ <i class="fas fa-ellipsis-v"></i>
335
+ </button>
336
+ </td>
337
+ </tr>
338
+
339
+ <!-- Orca -->
340
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
341
+ <td class="py-4 px-4">
342
+ <div class="flex items-center">
343
+ <img src="https://cryptologos.cc/logos/orca-orca-logo.png" class="coin-logo mr-3">
344
+ <div>
345
+ <p class="font-medium">ORCA</p>
346
+ <p class="text-xs text-gray-400">Orca</p>
347
+ </div>
348
+ </div>
349
+ </td>
350
+ <td class="py-4 px-4 font-medium">$2.7489</td>
351
+ <td class="py-4 px-4 positive">+0.12%</td>
352
+ <td class="py-4 px-4 positive">+15.08%</td>
353
+ <td class="py-4 px-4 positive">+26.86%</td>
354
+ <td class="py-4 px-4">
355
+ <p class="font-medium">$2.7489</p>
356
+ <p class="text-xs text-gray-400">1 ORCA</p>
357
+ </td>
358
+ <td class="py-4 px-4">$3.4732</td>
359
+ <td class="py-4 px-4 negative">-$0.7243</td>
360
+ <td class="py-4 px-4 text-right">
361
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
362
+ <i class="fas fa-exchange-alt"></i>
363
+ </button>
364
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
365
+ <i class="fas fa-ellipsis-v"></i>
366
+ </button>
367
+ </td>
368
+ </tr>
369
+
370
+ <!-- Epic Chain -->
371
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
372
+ <td class="py-4 px-4">
373
+ <div class="flex items-center">
374
+ <img src="https://cryptologos.cc/logos/epic-coin-epic-logo.png" class="coin-logo mr-3">
375
+ <div>
376
+ <p class="font-medium">EPIC</p>
377
+ <p class="text-xs text-gray-400">Epic Chain</p>
378
+ </div>
379
+ </div>
380
+ </td>
381
+ <td class="py-4 px-4 font-medium">$2.2999</td>
382
+ <td class="py-4 px-4 positive">+1.30%</td>
383
+ <td class="py-4 px-4 positive">+8.34%</td>
384
+ <td class="py-4 px-4 positive">+23.69%</td>
385
+ <td class="py-4 px-4">
386
+ <p class="font-medium">$2.2999</p>
387
+ <p class="text-xs text-gray-400">1 EPIC</p>
388
+ </td>
389
+ <td class="py-4 px-4">$1.9852</td>
390
+ <td class="py-4 px-4 positive">+$0.3147</td>
391
+ <td class="py-4 px-4 text-right">
392
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
393
+ <i class="fas fa-exchange-alt"></i>
394
+ </button>
395
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
396
+ <i class="fas fa-ellipsis-v"></i>
397
+ </button>
398
+ </td>
399
+ </tr>
400
+
401
+ <!-- Wrapped Matic -->
402
+ <tr class="hover:bg-gray-800 transition cursor-pointer">
403
+ <td class="py-4 px-4">
404
+ <div class="flex items-center">
405
+ <img src="https://cryptologos.cc/logos/polygon-matic-logo.png" class="coin-logo mr-3">
406
+ <div>
407
+ <p class="font-medium">WMATIC</p>
408
+ <p class="text-xs text-gray-400">Wrapped Matic</p>
409
+ </div>
410
+ </div>
411
+ </td>
412
+ <td class="py-4 px-4 font-medium">$0.2462</td>
413
+ <td class="py-4 px-4 positive">+0.79%</td>
414
+ <td class="py-4 px-4 positive">+5.51%</td>
415
+ <td class="py-4 px-4 positive">+22.88%</td>
416
+ <td class="py-4 px-4">
417
+ <p class="font-medium">$4.9247</p>
418
+ <p class="text-xs text-gray-400">20 WMATIC</p>
419
+ </td>
420
+ <td class="py-4 px-4">$0.8413</td>
421
+ <td class="py-4 px-4 negative">-$11.90</td>
422
+ <td class="py-4 px-4 text-right">
423
+ <button class="bg-blue-600 hover:bg-blue-700 text-white px-3 py-1 rounded-md text-sm mr-2">
424
+ <i class="fas fa-exchange-alt"></i>
425
+ </button>
426
+ <button class="bg-gray-700 hover:bg-gray-600 text-white px-3 py-1 rounded-md text-sm">
427
+ <i class="fas fa-ellipsis-v"></i>
428
+ </button>
429
+ </td>
430
+ </tr>
431
+ </tbody>
432
+ </table>
433
+ </div>
434
+
435
+ <div class="flex justify-between items-center mt-4">
436
+ <p class="text-gray-400 text-sm">Showing 7 of 75 assets</p>
437
+ <div class="flex space-x-2">
438
+ <button class="bg-gray-800 hover:bg-gray-700 text-white px-3 py-1 rounded-md">
439
+ <i class="fas fa-chevron-left"></i>
440
+ </button>
441
+ <button class="bg-blue-600 text-white px-3 py-1 rounded-md">1</button>
442
+ <button class="bg-gray-800 hover:bg-gray-700 text-white px-3 py-1 rounded-md">2</button>
443
+ <button class="bg-gray-800 hover:bg-gray-700 text-white px-3 py-1 rounded-md">3</button>
444
+ <button class="bg-gray-800 hover:bg-gray-700 text-white px-3 py-1 rounded-md">...</button>
445
+ <button class="bg-gray-800 hover:bg-gray-700 text-white px-3 py-1 rounded-md">10</button>
446
+ <button class="bg-gray-800 hover:bg-gray-700 text-white px-3 py-1 rounded-md">
447
+ <i class="fas fa-chevron-right"></i>
448
+ </button>
449
+ </div>
450
+ </div>
451
+ </section>
452
+ </div>
453
+
454
+ <script>
455
+ // Simple script to toggle mobile menu if needed
456
+ document.addEventListener('DOMContentLoaded', function() {
457
+ // You can add more interactive functionality here
458
+ console.log('Portfolio tracker loaded');
459
+
460
+ // Example: Highlight row on click
461
+ const rows = document.querySelectorAll('tbody tr');
462
+ rows.forEach(row => {
463
+ row.addEventListener('click', function() {
464
+ rows.forEach(r => r.classList.remove('bg-gray-800'));
465
+ this.classList.add('bg-gray-800');
466
+ });
467
+ });
468
+ });
469
+ </script>
470
+ <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=amghsa/cry-amg" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
471
+ </html>