timoon811 commited on
Commit
16ea6c3
·
verified ·
1 Parent(s): a3ccfbc

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +272 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Paythema3412
3
- emoji: 💻
4
- colorFrom: gray
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: paythema3412
3
+ emoji: 🐳
4
+ colorFrom: purple
5
+ colorTo: pink
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,272 @@
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>Платёжки для арбитража трафика</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
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@700;900&display=swap');
11
+
12
+ body {
13
+ font-family: 'Inter', sans-serif;
14
+ background-color: #000;
15
+ overflow: hidden;
16
+ }
17
+
18
+ .neon-text {
19
+ text-shadow: 0 0 10px rgba(0, 255, 170, 0.7),
20
+ 0 0 20px rgba(0, 255, 170, 0.5);
21
+ }
22
+
23
+ .neon-border {
24
+ box-shadow: 0 0 10px rgba(0, 255, 170, 0.7),
25
+ inset 0 0 10px rgba(0, 255, 170, 0.3);
26
+ border: 1px solid rgba(0, 255, 170, 0.3);
27
+ }
28
+
29
+ .payment-path {
30
+ position: relative;
31
+ }
32
+
33
+ .payment-path::after {
34
+ content: '';
35
+ position: absolute;
36
+ top: 0;
37
+ left: 50%;
38
+ width: 2px;
39
+ height: 100%;
40
+ background: linear-gradient(to bottom,
41
+ transparent,
42
+ rgba(0, 255, 170, 0.7),
43
+ transparent);
44
+ transform: translateX(-50%);
45
+ }
46
+
47
+ .card-animation {
48
+ animation: float 3s ease-in-out infinite;
49
+ }
50
+
51
+ .shield-animation {
52
+ animation: pulse 2s ease-in-out infinite;
53
+ }
54
+
55
+ @keyframes float {
56
+ 0%, 100% { transform: translateY(0); }
57
+ 50% { transform: translateY(-10px); }
58
+ }
59
+
60
+ @keyframes pulse {
61
+ 0%, 100% { opacity: 1; }
62
+ 50% { opacity: 0.7; }
63
+ }
64
+
65
+ .transaction-line {
66
+ position: absolute;
67
+ background: linear-gradient(90deg, transparent, rgba(0, 255, 170, 0.5), transparent);
68
+ height: 1px;
69
+ transform-origin: left;
70
+ }
71
+
72
+ .declined {
73
+ animation: shake 0.5s ease-in-out;
74
+ }
75
+
76
+ @keyframes shake {
77
+ 0%, 100% { transform: translateX(0); }
78
+ 25% { transform: translateX(-5px); }
79
+ 75% { transform: translateX(5px); }
80
+ }
81
+ </style>
82
+ </head>
83
+ <body class="min-h-screen flex items-center justify-center p-4">
84
+ <div class="absolute inset-0 overflow-hidden">
85
+ <!-- Background elements -->
86
+ <div class="absolute top-0 left-0 w-full h-full opacity-20">
87
+ <!-- Grid pattern -->
88
+ <div class="absolute inset-0" style="background:
89
+ linear-gradient(rgba(0, 255, 170, 0.1) 1px, transparent 1px),
90
+ linear-gradient(90deg, rgba(0, 255, 170, 0.1) 1px, transparent 1px);
91
+ background-size: 40px 40px;"></div>
92
+
93
+ <!-- Floating UI elements -->
94
+ <div class="absolute top-1/4 left-1/4 w-32 h-20 bg-black neon-border rounded-lg opacity-70 transform rotate-12"></div>
95
+ <div class="absolute top-1/3 right-1/4 w-40 h-24 bg-black neon-border rounded-lg opacity-70 transform -rotate-6"></div>
96
+ <div class="absolute bottom-1/4 left-1/3 w-36 h-28 bg-black neon-border rounded-lg opacity-70 transform rotate-3"></div>
97
+
98
+ <!-- Transaction lines -->
99
+ <div class="transaction-line" style="top: 20%; left: 10%; width: 30%; transform: rotate(15deg);"></div>
100
+ <div class="transaction-line" style="top: 40%; left: 60%; width: 25%; transform: rotate(-10deg);"></div>
101
+ <div class="transaction-line" style="top: 70%; left: 20%; width: 35%; transform: rotate(5deg);"></div>
102
+
103
+ <!-- Floating currency symbols -->
104
+ <div class="absolute top-1/5 right-1/5 text-emerald-400 opacity-50 text-2xl">$</div>
105
+ <div class="absolute bottom-1/3 left-1/5 text-emerald-400 opacity-50 text-2xl">€</div>
106
+ <div class="absolute top-2/3 right-1/6 text-emerald-400 opacity-50 text-2xl">₿</div>
107
+ </div>
108
+ </div>
109
+
110
+ <div class="relative z-10 w-full max-w-6xl mx-auto flex flex-col md:flex-row items-center justify-between p-8">
111
+ <!-- Left content -->
112
+ <div class="w-full md:w-1/2 mb-10 md:mb-0">
113
+ <h1 class="text-5xl md:text-6xl lg:text-7xl font-black text-white neon-text leading-tight mb-6">
114
+ Платёжки для<br>арбитража трафика
115
+ </h1>
116
+
117
+ <div class="flex flex-wrap gap-4 mt-10">
118
+ <div class="px-4 py-2 bg-black neon-border rounded-full flex items-center">
119
+ <i class="fas fa-shield-alt text-emerald-400 mr-2 shield-animation"></i>
120
+ <span class="text-white text-sm font-bold">Анонимность</span>
121
+ </div>
122
+ <div class="px-4 py-2 bg-black neon-border rounded-full flex items-center">
123
+ <i class="fas fa-bolt text-emerald-400 mr-2"></i>
124
+ <span class="text-white text-sm font-bold">Скорость</span>
125
+ </div>
126
+ <div class="px-4 py-2 bg-black neon-border rounded-full flex items-center">
127
+ <i class="fas fa-expand text-emerald-400 mr-2"></i>
128
+ <span class="text-white text-sm font-bold">Масштабируемость</span>
129
+ </div>
130
+ </div>
131
+ </div>
132
+
133
+ <!-- Right content - Payment path -->
134
+ <div class="w-full md:w-1/2 relative payment-path pl-10">
135
+ <!-- Payment flow visualization -->
136
+ <div class="relative h-96">
137
+ <!-- Step 1: Advertiser -->
138
+ <div class="absolute top-0 left-0 w-40">
139
+ <div class="bg-gray-800 p-4 rounded-lg shadow-lg">
140
+ <div class="flex items-center mb-2">
141
+ <div class="w-8 h-8 bg-gray-600 rounded-full flex items-center justify-center">
142
+ <i class="fas fa-ad text-white"></i>
143
+ </div>
144
+ <span class="ml-2 text-white font-bold text-sm">Рекламодатель</span>
145
+ </div>
146
+ <div class="h-1 bg-gray-600 my-2"></div>
147
+ <div class="text-gray-400 text-xs">Ограниченные платежи</div>
148
+ </div>
149
+ <div class="h-6 w-px bg-emerald-400 ml-5"></div>
150
+ </div>
151
+
152
+ <!-- Step 2: Proxy accounts -->
153
+ <div class="absolute top-24 left-20 w-40">
154
+ <div class="bg-gray-900 p-4 rounded-lg shadow-lg">
155
+ <div class="flex items-center mb-2">
156
+ <div class="w-8 h-8 bg-emerald-500 rounded-full flex items-center justify-center">
157
+ <i class="fas fa-user-shield text-white"></i>
158
+ </div>
159
+ <span class="ml-2 text-white font-bold text-sm">Прокси-аккаунты</span>
160
+ </div>
161
+ <div class="h-1 bg-emerald-500 my-2"></div>
162
+ <div class="text-emerald-300 text-xs">Мультиаккаунтинг</div>
163
+ </div>
164
+ <div class="h-6 w-px bg-emerald-400 ml-5"></div>
165
+ </div>
166
+
167
+ <!-- Step 3: Payment systems -->
168
+ <div class="absolute top-48 left-40 w-44">
169
+ <div class="bg-black neon-border p-4 rounded-lg shadow-lg relative">
170
+ <div class="flex items-center mb-2">
171
+ <div class="w-8 h-8 bg-purple-500 rounded-full flex items-center justify-center">
172
+ <i class="fas fa-money-bill-wave text-white"></i>
173
+ </div>
174
+ <span class="ml-2 text-white font-bold text-sm">Платёжные системы</span>
175
+ </div>
176
+ <div class="h-1 bg-gradient-to-r from-emerald-400 to-purple-500 my-2"></div>
177
+ <div class="text-emerald-300 text-xs">Обход блокировок</div>
178
+
179
+ <!-- Payment status indicators -->
180
+ <div class="absolute -right-4 -top-4 w-8 h-8 bg-red-500 rounded-full flex items-center justify-center declined">
181
+ <i class="fas fa-times text-white"></i>
182
+ </div>
183
+ <div class="absolute -right-4 top-8 w-8 h-8 bg-yellow-500 rounded-full flex items-center justify-center">
184
+ <i class="fas fa-pause text-white"></i>
185
+ </div>
186
+ <div class="absolute -right-4 top-20 w-8 h-8 bg-emerald-500 rounded-full flex items-center justify-center">
187
+ <i class="fas fa-check text-white"></i>
188
+ </div>
189
+ </div>
190
+ </div>
191
+
192
+ <!-- Floating payment cards -->
193
+ <div class="absolute top-10 right-10 w-24 h-16 bg-gradient-to-br from-gray-800 to-gray-900 rounded-lg shadow-lg card-animation transform rotate-6">
194
+ <div class="absolute top-2 left-2 w-6 h-1 bg-gray-600"></div>
195
+ <div class="absolute top-4 left-2 w-10 h-1 bg-gray-600"></div>
196
+ <div class="absolute bottom-2 right-2 text-xs text-gray-400">•••• 1234</div>
197
+ </div>
198
+
199
+ <div class="absolute top-32 right-0 w-24 h-16 bg-gradient-to-br from-emerald-900 to-emerald-700 rounded-lg shadow-lg card-animation transform -rotate-6" style="animation-delay: 0.5s;">
200
+ <div class="absolute top-2 left-2 w-6 h-1 bg-emerald-400"></div>
201
+ <div class="absolute top-4 left-2 w-10 h-1 bg-emerald-400"></div>
202
+ <div class="absolute bottom-2 right-2 text-xs text-emerald-200">•••• 5678</div>
203
+ </div>
204
+
205
+ <!-- Crypto wallet -->
206
+ <div class="absolute bottom-10 right-5 w-20 h-20 bg-black neon-border rounded-full flex items-center justify-center">
207
+ <i class="fab fa-bitcoin text-yellow-500 text-2xl"></i>
208
+ </div>
209
+
210
+ <!-- QR code -->
211
+ <div class="absolute bottom-24 right-24 w-16 h-16 bg-white p-1">
212
+ <div class="w-full h-full grid grid-cols-4 gap-px">
213
+ <div class="bg-black"></div><div class="bg-black"></div><div class="bg-black"></div><div class="bg-black"></div>
214
+ <div class="bg-black"></div><div class="bg-white"></div><div class="bg-white"></div><div class="bg-black"></div>
215
+ <div class="bg-black"></div><div class="bg-white"></div><div class="bg-black"></div><div class="bg-black"></div>
216
+ <div class="bg-black"></div><div class="bg-black"></div><div class="bg-white"></div><div class="bg-black"></div>
217
+ </div>
218
+ </div>
219
+ </div>
220
+ </div>
221
+ </div>
222
+
223
+ <script>
224
+ // Create additional floating elements
225
+ document.addEventListener('DOMContentLoaded', function() {
226
+ const background = document.querySelector('.absolute.inset-0');
227
+
228
+ // Create more transaction lines
229
+ for (let i = 0; i < 5; i++) {
230
+ const line = document.createElement('div');
231
+ line.className = 'transaction-line';
232
+
233
+ const top = Math.random() * 100;
234
+ const left = Math.random() * 100;
235
+ const width = 20 + Math.random() * 30;
236
+ const angle = -15 + Math.random() * 30;
237
+
238
+ line.style.top = `${top}%`;
239
+ line.style.left = `${left}%`;
240
+ line.style.width = `${width}%`;
241
+ line.style.transform = `rotate(${angle}deg)`;
242
+
243
+ background.appendChild(line);
244
+ }
245
+
246
+ // Create floating currency symbols
247
+ for (let i = 0; i < 8; i++) {
248
+ const symbol = document.createElement('div');
249
+ symbol.className = 'absolute text-emerald-400 opacity-30 text-xl';
250
+
251
+ const symbols = ['$', '€', '£', '₿', '₽', '¥', '₮', '₴'];
252
+ const randomSymbol = symbols[Math.floor(Math.random() * symbols.length)];
253
+
254
+ symbol.textContent = randomSymbol;
255
+ symbol.style.top = `${Math.random() * 100}%`;
256
+ symbol.style.left = `${Math.random() * 100}%`;
257
+
258
+ background.appendChild(symbol);
259
+ }
260
+
261
+ // Animate declined transaction
262
+ setInterval(() => {
263
+ const declined = document.querySelector('.declined');
264
+ declined.classList.remove('declined');
265
+ setTimeout(() => {
266
+ declined.classList.add('declined');
267
+ }, 10);
268
+ }, 3000);
269
+ });
270
+ </script>
271
+ <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=timoon811/paythema3412" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
272
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ ТЗ сайт - обложка на тему: Тема: Работа с платёжками в арбитраже трафика Текст на обложке: Платёжки для арбитража трафика ⸻ Стиль и визуальные требования: • Фон: абстрактный, в духе «теневой финансовой системы» — элементы онлайн-банкинга, UI перевода средств, карты и транзакции • Цветовая гамма: чёрный + изумрудно-зелёный, серебристый, элементы синего/фиолетового неона • Графические элементы: • Силуэты платёжных систем: виртуальные карты, P2P-переводы, криптокошельки • Условные иконки (без нарушения бренда): карта, QR, валюта, shield (безопасность) • Стрелки перевода средств, линии маршрутов платежей • Шрифт: • Жирный, контрастный, в стиле финтеха • Без засечек, идеально читабельный на мобильных устройствах • Размещение текста: • Текст — по центру или с лёгким смещением влево • Справа — иконки платежей или путь «серый рекламодатель → прокси-аккаунт → платёжка» ⸻ Дополнительно: • Можно визуализировать конфликт: отказ в платеже / одобрение / заморозка • Подчеркнуть тему обхода блокировок, регистрации в разных гео, мультиаккаунты • Сделать упор на анонимность, скорость, масштабируемость