privateuserh commited on
Commit
e3fce7c
·
verified ·
1 Parent(s): 8b671ff

Add 2 files

Browse files
Files changed (2) hide show
  1. README.md +6 -4
  2. index.html +434 -19
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Tstyladbot
3
- emoji: 🌖
4
- colorFrom: green
5
  colorTo: purple
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: tstyladbot
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
  colorTo: purple
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,434 @@
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>Advertise With Us - Telegram Ad Platform</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
+ .gradient-bg {
11
+ background: linear-gradient(135deg, #6e8efb, #a777e3);
12
+ }
13
+ .payment-modal {
14
+ transition: all 0.3s ease;
15
+ opacity: 0;
16
+ visibility: hidden;
17
+ }
18
+ .payment-modal.active {
19
+ opacity: 1;
20
+ visibility: visible;
21
+ }
22
+ .qr-code-placeholder {
23
+ background: repeating-linear-gradient(45deg, #f0f0f0, #f0f0f0 10px, #e0e0e0 10px, #e0e0e0 20px);
24
+ }
25
+ </style>
26
+ </head>
27
+ <body class="bg-gray-50 min-h-screen">
28
+ <!-- Header -->
29
+ <header class="gradient-bg text-white shadow-lg">
30
+ <div class="container mx-auto px-4 py-6">
31
+ <div class="flex justify-between items-center">
32
+ <div class="flex items-center space-x-2">
33
+ <i class="fab fa-telegram text-3xl"></i>
34
+ <h1 class="text-2xl font-bold">Telegram Ad Platform</h1>
35
+ </div>
36
+ <nav>
37
+ <ul class="flex space-x-6">
38
+ <li><a href="#" class="hover:underline">Home</a></li>
39
+ <li><a href="#" class="hover:underline">Pricing</a></li>
40
+ <li><a href="#" class="hover:underline">FAQ</a></li>
41
+ <li><a href="#" class="hover:underline">Contact</a></li>
42
+ </ul>
43
+ </nav>
44
+ </div>
45
+ </div>
46
+ </header>
47
+
48
+ <!-- Main Content -->
49
+ <main class="container mx-auto px-4 py-12">
50
+ <div class="max-w-4xl mx-auto">
51
+ <div class="text-center mb-12">
52
+ <h2 class="text-4xl font-bold text-gray-800 mb-4">Reach Thousands on Telegram</h2>
53
+ <p class="text-xl text-gray-600">Submit your ad copy, make payment, and we'll post it to our Telegram channels with thousands of subscribers.</p>
54
+ </div>
55
+
56
+ <!-- Ad Form -->
57
+ <div class="bg-white rounded-xl shadow-lg p-8 mb-12">
58
+ <h3 class="text-2xl font-semibold text-gray-800 mb-6">Create Your Ad</h3>
59
+
60
+ <form id="adForm">
61
+ <div class="mb-6">
62
+ <label for="adTitle" class="block text-gray-700 font-medium mb-2">Ad Title</label>
63
+ <input type="text" id="adTitle" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="Enter a catchy title" required>
64
+ </div>
65
+
66
+ <div class="mb-6">
67
+ <label for="adContent" class="block text-gray-700 font-medium mb-2">Ad Content</label>
68
+ <textarea id="adContent" rows="6" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="Write your ad content here..." required></textarea>
69
+ <p class="text-sm text-gray-500 mt-2">Maximum 500 characters. HTML tags will be removed.</p>
70
+ </div>
71
+
72
+ <div class="mb-6">
73
+ <label for="adLink" class="block text-gray-700 font-medium mb-2">Link (optional)</label>
74
+ <input type="url" id="adLink" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-purple-500" placeholder="https://example.com">
75
+ </div>
76
+
77
+ <div class="mb-6">
78
+ <label class="block text-gray-700 font-medium mb-2">Ad Duration</label>
79
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
80
+ <div class="border rounded-lg p-4 hover:border-purple-500 cursor-pointer duration-200">
81
+ <input type="radio" id="duration1" name="duration" value="1" class="hidden" checked>
82
+ <label for="duration1" class="flex flex-col items-center cursor-pointer">
83
+ <span class="font-semibold">24 Hours</span>
84
+ <span class="text-purple-600 font-bold">0.005 BCH</span>
85
+ <span class="text-sm text-gray-500">~$2.50</span>
86
+ </label>
87
+ </div>
88
+ <div class="border rounded-lg p-4 hover:border-purple-500 cursor-pointer duration-200">
89
+ <input type="radio" id="duration3" name="duration" value="3" class="hidden">
90
+ <label for="duration3" class="flex flex-col items-center cursor-pointer">
91
+ <span class="font-semibold">3 Days</span>
92
+ <span class="text-purple-600 font-bold">0.012 BCH</span>
93
+ <span class="text-sm text-gray-500">~$6.00</span>
94
+ </label>
95
+ </div>
96
+ <div class="border rounded-lg p-4 hover:border-purple-500 cursor-pointer duration-200">
97
+ <input type="radio" id="duration7" name="duration" value="7" class="hidden">
98
+ <label for="duration7" class="flex flex-col items-center cursor-pointer">
99
+ <span class="font-semibold">7 Days</span>
100
+ <span class="text-purple-600 font-bold">0.025 BCH</span>
101
+ <span class="text-sm text-gray-500">~$12.50</span>
102
+ </label>
103
+ </div>
104
+ </div>
105
+ </div>
106
+
107
+ <div class="flex justify-end">
108
+ <button type="submit" class="gradient-bg text-white px-8 py-3 rounded-lg font-semibold hover:opacity-90 transition duration-200 shadow-lg">
109
+ Continue to Payment <i class="fas fa-arrow-right ml-2"></i>
110
+ </button>
111
+ </div>
112
+ </form>
113
+ </div>
114
+
115
+ <!-- Stats Section -->
116
+ <div class="bg-white rounded-xl shadow-lg p-8 mb-12">
117
+ <h3 class="text-2xl font-semibold text-gray-800 mb-6">Our Reach</h3>
118
+ <div class="grid grid-cols-2 md:grid-cols-4 gap-6 text-center">
119
+ <div class="p-4">
120
+ <div class="text-4xl font-bold text-purple-600 mb-2">15+</div>
121
+ <div class="text-gray-600">Telegram Channels</div>
122
+ </div>
123
+ <div class="p-4">
124
+ <div class="text-4xl font-bold text-purple-600 mb-2">250K+</div>
125
+ <div class="text-gray-600">Total Subscribers</div>
126
+ </div>
127
+ <div class="p-4">
128
+ <div class="text-4xl font-bold text-purple-600 mb-2">10K+</div>
129
+ <div class="text-gray-600">Daily Views</div>
130
+ </div>
131
+ <div class="p-4">
132
+ <div class="text-4xl font-bold text-purple-600 mb-2">95%</div>
133
+ <div class="text-gray-600">Engagement Rate</div>
134
+ </div>
135
+ </div>
136
+ </div>
137
+ </div>
138
+ </main>
139
+
140
+ <!-- Payment Modal -->
141
+ <div id="paymentModal" class="payment-modal fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
142
+ <div class="bg-white rounded-xl shadow-2xl w-full max-w-md mx-4">
143
+ <div class="p-6">
144
+ <div class="flex justify-between items-center mb-6">
145
+ <h3 class="text-2xl font-bold text-gray-800">Complete Payment</h3>
146
+ <button id="closeModal" class="text-gray-500 hover:text-gray-700">
147
+ <i class="fas fa-times text-2xl"></i>
148
+ </button>
149
+ </div>
150
+
151
+ <div class="mb-6">
152
+ <div class="flex justify-between mb-2">
153
+ <span class="text-gray-600">Ad Duration:</span>
154
+ <span id="modalDuration" class="font-semibold">24 Hours</span>
155
+ </div>
156
+ <div class="flex justify-between mb-2">
157
+ <span class="text-gray-600">Amount Due:</span>
158
+ <span id="modalAmount" class="font-semibold text-purple-600">0.005 BCH</span>
159
+ </div>
160
+ <div class="flex justify-between">
161
+ <span class="text-gray-600">Approx USD:</span>
162
+ <span id="modalUsd" class="font-semibold">~$2.50</span>
163
+ </div>
164
+ </div>
165
+
166
+ <div class="mb-6 text-center">
167
+ <div class="qr-code-placeholder w-48 h-48 mx-auto mb-4 flex items-center justify-center">
168
+ <i class="fas fa-qrcode text-4xl text-gray-400"></i>
169
+ </div>
170
+ <div class="bg-gray-100 p-3 rounded-lg mb-4">
171
+ <p id="paymentAddress" class="font-mono text-sm break-all">bitcoincash:qpm2qsznhks23z7629mms6s4cwef74vcwvy22gdx6a</p>
172
+ </div>
173
+ <button id="copyAddress" class="text-purple-600 hover:text-purple-800 text-sm">
174
+ <i class="fas fa-copy mr-1"></i> Copy Address
175
+ </button>
176
+ </div>
177
+
178
+ <div class="mb-6">
179
+ <div class="flex items-center mb-2">
180
+ <div class="w-8 h-8 rounded-full bg-purple-100 flex items-center justify-center mr-2">
181
+ <i class="fas fa-clock text-purple-600"></i>
182
+ </div>
183
+ <div>
184
+ <p class="text-sm font-medium">Payment expires in <span id="paymentTimer" class="font-bold">15:00</span></p>
185
+ <p class="text-xs text-gray-500">Send exact amount to the address above</p>
186
+ </div>
187
+ </div>
188
+ </div>
189
+
190
+ <div class="bg-yellow-50 border border-yellow-200 rounded-lg p-4 mb-6">
191
+ <div class="flex">
192
+ <div class="flex-shrink-0">
193
+ <i class="fas fa-exclamation-circle text-yellow-500 mt-1"></i>
194
+ </div>
195
+ <div class="ml-3">
196
+ <p class="text-sm text-yellow-700">
197
+ Your ad will be automatically posted to our Telegram channels once payment is confirmed (usually within 15 minutes).
198
+ </p>
199
+ </div>
200
+ </div>
201
+ </div>
202
+
203
+ <div class="flex justify-between items-center">
204
+ <button id="cancelPayment" class="text-gray-600 hover:text-gray-800 font-medium">
205
+ <i class="fas fa-arrow-left mr-2"></i> Back
206
+ </button>
207
+ <button id="checkPayment" class="gradient-bg text-white px-6 py-2 rounded-lg font-semibold hover:opacity-90 transition duration-200">
208
+ <i class="fas fa-check-circle mr-2"></i> I've Paid
209
+ </button>
210
+ </div>
211
+ </div>
212
+ </div>
213
+ </div>
214
+
215
+ <!-- Success Modal -->
216
+ <div id="successModal" class="payment-modal fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
217
+ <div class="bg-white rounded-xl shadow-2xl w-full max-w-md mx-4">
218
+ <div class="p-8 text-center">
219
+ <div class="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-6">
220
+ <i class="fas fa-check text-green-500 text-3xl"></i>
221
+ </div>
222
+ <h3 class="text-2xl font-bold text-gray-800 mb-4">Payment Received!</h3>
223
+ <p class="text-gray-600 mb-6">Your ad has been successfully posted to our Telegram channels. Thank you for advertising with us!</p>
224
+ <div class="bg-gray-50 p-4 rounded-lg mb-6">
225
+ <p class="text-sm font-medium text-gray-700">Transaction ID:</p>
226
+ <p id="txId" class="font-mono text-sm break-all text-gray-600">a1b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6</p>
227
+ </div>
228
+ <button id="closeSuccessModal" class="gradient-bg text-white px-8 py-3 rounded-lg font-semibold hover:opacity-90 transition duration-200">
229
+ Done <i class="fas fa-check ml-2"></i>
230
+ </button>
231
+ </div>
232
+ </div>
233
+ </div>
234
+
235
+ <!-- Footer -->
236
+ <footer class="bg-gray-800 text-white py-12">
237
+ <div class="container mx-auto px-4">
238
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-8">
239
+ <div>
240
+ <h4 class="text-xl font-bold mb-4">Telegram Ad Platform</h4>
241
+ <p class="text-gray-400">The easiest way to reach thousands of potential customers through Telegram channels.</p>
242
+ </div>
243
+ <div>
244
+ <h4 class="text-lg font-semibold mb-4">Quick Links</h4>
245
+ <ul class="space-y-2">
246
+ <li><a href="#" class="text-gray-400 hover:text-white">Home</a></li>
247
+ <li><a href="#" class="text-gray-400 hover:text-white">Pricing</a></li>
248
+ <li><a href="#" class="text-gray-400 hover:text-white">How It Works</a></li>
249
+ <li><a href="#" class="text-gray-400 hover:text-white">Contact</a></li>
250
+ </ul>
251
+ </div>
252
+ <div>
253
+ <h4 class="text-lg font-semibold mb-4">Support</h4>
254
+ <ul class="space-y-2">
255
+ <li><a href="#" class="text-gray-400 hover:text-white">FAQ</a></li>
256
+ <li><a href="#" class="text-gray-400 hover:text-white">Privacy Policy</a></li>
257
+ <li><a href="#" class="text-gray-400 hover:text-white">Terms of Service</a></li>
258
+ <li><a href="#" class="text-gray-400 hover:text-white">Refund Policy</a></li>
259
+ </ul>
260
+ </div>
261
+ <div>
262
+ <h4 class="text-lg font-semibold mb-4">Connect With Us</h4>
263
+ <div class="flex space-x-4">
264
+ <a href="#" class="text-gray-400 hover:text-white text-2xl"><i class="fab fa-telegram"></i></a>
265
+ <a href="#" class="text-gray-400 hover:text-white text-2xl"><i class="fab fa-twitter"></i></a>
266
+ <a href="#" class="text-gray-400 hover:text-white text-2xl"><i class="fab fa-discord"></i></a>
267
+ </div>
268
+ <p class="text-gray-400 mt-4">[email protected]</p>
269
+ </div>
270
+ </div>
271
+ <div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400">
272
+ <p>&copy; 2023 Telegram Ad Platform. All rights reserved.</p>
273
+ </div>
274
+ </div>
275
+ </footer>
276
+
277
+ <script>
278
+ // Telegram Bot API Token (in a real app, this should be handled server-side)
279
+ const TELEGRAM_BOT_TOKEN = '6696162127:AAFOoREgdq4nHw4S8Bybcg4VCZbsJRCUT7c';
280
+ const CHAT_ID = '-1001234567890'; // Example chat ID
281
+
282
+ // DOM Elements
283
+ const adForm = document.getElementById('adForm');
284
+ const paymentModal = document.getElementById('paymentModal');
285
+ const successModal = document.getElementById('successModal');
286
+ const closeModal = document.getElementById('closeModal');
287
+ const closeSuccessModal = document.getElementById('closeSuccessModal');
288
+ const cancelPayment = document.getElementById('cancelPayment');
289
+ const checkPayment = document.getElementById('checkPayment');
290
+ const copyAddress = document.getElementById('copyAddress');
291
+ const paymentAddress = document.getElementById('paymentAddress');
292
+ const modalDuration = document.getElementById('modalDuration');
293
+ const modalAmount = document.getElementById('modalAmount');
294
+ const modalUsd = document.getElementById('modalUsd');
295
+ const paymentTimer = document.getElementById('paymentTimer');
296
+ const txId = document.getElementById('txId');
297
+
298
+ // Pricing data
299
+ const pricing = {
300
+ '1': { bch: '0.005', usd: '2.50', text: '24 Hours' },
301
+ '3': { bch: '0.012', usd: '6.00', text: '3 Days' },
302
+ '7': { bch: '0.025', usd: '12.50', text: '7 Days' }
303
+ };
304
+
305
+ // Form submission
306
+ adForm.addEventListener('submit', function(e) {
307
+ e.preventDefault();
308
+
309
+ const duration = document.querySelector('input[name="duration"]:checked').value;
310
+ const durationData = pricing[duration];
311
+
312
+ // Update modal with selected duration and price
313
+ modalDuration.textContent = durationData.text;
314
+ modalAmount.textContent = `${durationData.bch} BCH`;
315
+ modalUsd.textContent = `~$${durationData.usd}`;
316
+
317
+ // Show payment modal
318
+ paymentModal.classList.add('active');
319
+
320
+ // Start payment timer (15 minutes)
321
+ startPaymentTimer(15);
322
+ });
323
+
324
+ // Close modal
325
+ closeModal.addEventListener('click', function() {
326
+ paymentModal.classList.remove('active');
327
+ });
328
+
329
+ // Close success modal
330
+ closeSuccessModal.addEventListener('click', function() {
331
+ successModal.classList.remove('active');
332
+ });
333
+
334
+ // Cancel payment
335
+ cancelPayment.addEventListener('click', function() {
336
+ paymentModal.classList.remove('active');
337
+ });
338
+
339
+ // Copy payment address
340
+ copyAddress.addEventListener('click', function() {
341
+ navigator.clipboard.writeText(paymentAddress.textContent)
342
+ .then(() => {
343
+ const originalText = copyAddress.innerHTML;
344
+ copyAddress.innerHTML = '<i class="fas fa-check mr-1"></i> Copied!';
345
+ setTimeout(() => {
346
+ copyAddress.innerHTML = originalText;
347
+ }, 2000);
348
+ });
349
+ });
350
+
351
+ // Check payment (simulated)
352
+ checkPayment.addEventListener('click', function() {
353
+ // In a real implementation, you would check the blockchain for payment
354
+ // Here we simulate a successful payment after 2 seconds
355
+
356
+ checkPayment.disabled = true;
357
+ checkPayment.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> Checking...';
358
+
359
+ setTimeout(() => {
360
+ // Simulate successful payment
361
+ const randomTxId = 'tx_' + Math.random().toString(36).substr(2, 20);
362
+ txId.textContent = randomTxId;
363
+
364
+ // Get form data
365
+ const adTitle = document.getElementById('adTitle').value;
366
+ const adContent = document.getElementById('adContent').value;
367
+ const adLink = document.getElementById('adLink').value;
368
+
369
+ // Format the ad for Telegram
370
+ let telegramMessage = `*${adTitle}*\n\n`;
371
+ telegramMessage += `${adContent}\n\n`;
372
+ if (adLink) {
373
+ telegramMessage += `🔗 ${adLink}`;
374
+ }
375
+
376
+ // Send to Telegram (simulated in this frontend-only example)
377
+ // In a real app, this would be done server-side
378
+ console.log('Would send to Telegram:', telegramMessage);
379
+ // sendToTelegram(telegramMessage);
380
+
381
+ // Show success modal
382
+ paymentModal.classList.remove('active');
383
+ successModal.classList.add('active');
384
+
385
+ // Reset form
386
+ adForm.reset();
387
+ }, 2000);
388
+ });
389
+
390
+ // Start payment timer
391
+ function startPaymentTimer(minutes) {
392
+ let timeLeft = minutes * 60;
393
+
394
+ const timer = setInterval(() => {
395
+ if (timeLeft <= 0) {
396
+ clearInterval(timer);
397
+ paymentTimer.textContent = 'Expired';
398
+ paymentTimer.classList.add('text-red-500');
399
+ return;
400
+ }
401
+
402
+ const mins = Math.floor(timeLeft / 60);
403
+ const secs = timeLeft % 60;
404
+ paymentTimer.textContent = `${mins}:${secs < 10 ? '0' + secs : secs}`;
405
+ timeLeft--;
406
+ }, 1000);
407
+ }
408
+
409
+ // Function to send message to Telegram (would work in a real server implementation)
410
+ function sendToTelegram(message) {
411
+ const url = `https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage`;
412
+
413
+ fetch(url, {
414
+ method: 'POST',
415
+ headers: {
416
+ 'Content-Type': 'application/json',
417
+ },
418
+ body: JSON.stringify({
419
+ chat_id: CHAT_ID,
420
+ text: message,
421
+ parse_mode: 'Markdown'
422
+ })
423
+ })
424
+ .then(response => response.json())
425
+ .then(data => {
426
+ console.log('Message sent to Telegram:', data);
427
+ })
428
+ .catch(error => {
429
+ console.error('Error sending to Telegram:', error);
430
+ });
431
+ }
432
+ </script>
433
+ <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=privateuserh/tstyladbot" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
434
+ </html>