Logistics commited on
Commit
badd690
·
verified ·
1 Parent(s): 6b61c43

создать телеграф веб апп майнинг онлайн, алгоритм как у биткоин

Browse files
Files changed (2) hide show
  1. README.md +7 -4
  2. index.html +239 -18
README.md CHANGED
@@ -1,10 +1,13 @@
1
  ---
2
- title: Bytebaron Mining Madness
3
- emoji: 👁
4
  colorFrom: purple
5
- colorTo: pink
 
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: ByteBaron Mining Madness ⛏️
 
3
  colorFrom: purple
4
+ colorTo: yellow
5
+ emoji: 🐳
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite-v3
10
  ---
11
 
12
+ # Welcome to your new DeepSite project!
13
+ This project was created with [DeepSite](https://deepsite.hf.co).
index.html CHANGED
@@ -1,19 +1,240 @@
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>ByteBaron | Bitcoin-like Mining</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <script src="https://unpkg.com/feather-icons"></script>
9
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
10
+ <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.net.min.js"></script>
11
+ <style>
12
+ .mining-animation {
13
+ animation: pulse 2s infinite;
14
+ }
15
+ @keyframes pulse {
16
+ 0% { opacity: 0.7; }
17
+ 50% { opacity: 1; }
18
+ 100% { opacity: 0.7; }
19
+ }
20
+ .gpu-card:hover {
21
+ transform: translateY(-5px);
22
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
23
+ }
24
+ </style>
25
+ </head>
26
+ <body class="bg-gray-900 text-white">
27
+ <div id="vanta-bg" class="fixed inset-0 -z-10"></div>
28
+
29
+ <header class="py-6 px-4 sm:px-6 lg:px-8 border-b border-gray-800">
30
+ <div class="flex justify-between items-center">
31
+ <div class="flex items-center space-x-2">
32
+ <i data-feather="cpu" class="text-yellow-500"></i>
33
+ <h1 class="text-2xl font-bold bg-gradient-to-r from-yellow-400 to-yellow-600 bg-clip-text text-transparent">ByteBaron</h1>
34
+ </div>
35
+ <nav class="hidden md:flex space-x-8">
36
+ <a href="#" class="hover:text-yellow-400 transition">Dashboard</a>
37
+ <a href="#" class="hover:text-yellow-400 transition">Mining</a>
38
+ <a href="#" class="hover:text-yellow-400 transition">Wallet</a>
39
+ <a href="#" class="hover:text-yellow-400 transition">Stats</a>
40
+ <a href="#" class="hover:text-yellow-400 transition">Support</a>
41
+ </nav>
42
+ <button class="md:hidden">
43
+ <i data-feather="menu"></i>
44
+ </button>
45
+ </div>
46
+ </header>
47
+
48
+ <main class="container mx-auto px-4 py-8">
49
+ <section class="mb-16 text-center">
50
+ <h2 class="text-4xl font-bold mb-4">Mine Cryptocurrency Like Bitcoin</h2>
51
+ <p class="text-xl text-gray-300 max-w-2xl mx-auto">Start mining with our SHA-256 algorithm using your browser's computational power</p>
52
+ </section>
53
+
54
+ <section class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
55
+ <div class="bg-gray-800 rounded-xl p-6 shadow-lg border border-gray-700">
56
+ <div class="flex items-center mb-4">
57
+ <i data-feather="zap" class="text-yellow-500 mr-3"></i>
58
+ <h3 class="text-xl font-semibold">Instant Start</h3>
59
+ </div>
60
+ <p class="text-gray-300">Begin mining immediately with zero setup required. Just click and earn.</p>
61
+ </div>
62
+
63
+ <div class="bg-gray-800 rounded-xl p-6 shadow-lg border border-gray-700">
64
+ <div class="flex items-center mb-4">
65
+ <i data-feather="shield" class="text-yellow-500 mr-3"></i>
66
+ <h3 class="text-xl font-semibold">Secure Transactions</h3>
67
+ </div>
68
+ <p class="text-gray-300">All transactions are secured with SHA-256 encryption just like Bitcoin.</p>
69
+ </div>
70
+
71
+ <div class="bg-gray-800 rounded-xl p-6 shadow-lg border border-gray-700">
72
+ <div class="flex items-center mb-4">
73
+ <i data-feather="dollar-sign" class="text-yellow-500 mr-3"></i>
74
+ <h3 class="text-xl font-semibold">Real Profits</h3>
75
+ </div>
76
+ <p class="text-gray-300">Earn real cryptocurrency that you can withdraw or exchange anytime.</p>
77
+ </div>
78
+ </section>
79
+
80
+ <section class="bg-gray-800 rounded-xl p-8 mb-16 shadow-lg border border-gray-700">
81
+ <div class="flex flex-col md:flex-row items-center justify-between">
82
+ <div class="mb-6 md:mb-0 md:w-1/2">
83
+ <h2 class="text-2xl font-bold mb-4">Start Mining Now</h2>
84
+ <p class="text-gray-300 mb-6">Join thousands of miners earning cryptocurrency right from their browsers.</p>
85
+ <div class="flex space-x-4">
86
+ <button class="bg-yellow-500 hover:bg-yellow-600 text-black font-bold py-3 px-6 rounded-lg transition flex items-center">
87
+ <i data-feather="play" class="mr-2"></i> Start Mining
88
+ </button>
89
+ <button class="border border-yellow-500 text-yellow-500 hover:bg-yellow-500 hover:text-black font-bold py-3 px-6 rounded-lg transition flex items-center">
90
+ <i data-feather="info" class="mr-2"></i> Learn More
91
+ </button>
92
+ </div>
93
+ </div>
94
+ <div class="md:w-1/2 flex justify-center">
95
+ <div class="relative">
96
+ <div class="mining-animation bg-yellow-500 rounded-full w-40 h-40 flex items-center justify-center">
97
+ <i data-feather="cpu" class="text-black w-16 h-16"></i>
98
+ </div>
99
+ <div class="absolute -bottom-4 -right-4 bg-gray-900 rounded-lg p-3 shadow-lg border border-gray-700">
100
+ <div class="text-center">
101
+ <p class="text-sm text-gray-300">Current Hashrate</p>
102
+ <p class="text-xl font-bold text-yellow-500">0 H/s</p>
103
+ </div>
104
+ </div>
105
+ </div>
106
+ </div>
107
+ </div>
108
+ </section>
109
+
110
+ <section class="mb-16">
111
+ <h2 class="text-2xl font-bold mb-8 text-center">Mining Statistics</h2>
112
+ <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
113
+ <div class="bg-gray-800 rounded-lg p-6 text-center border border-gray-700">
114
+ <p class="text-gray-300 mb-2">Total Miners</p>
115
+ <p class="text-3xl font-bold text-yellow-500" id="totalMiners">12,843</p>
116
+ </div>
117
+ <div class="bg-gray-800 rounded-lg p-6 text-center border border-gray-700">
118
+ <p class="text-gray-300 mb-2">Network Hashrate</p>
119
+ <p class="text-3xl font-bold text-yellow-500" id="networkHashrate">4.2 TH/s</p>
120
+ </div>
121
+ <div class="bg-gray-800 rounded-lg p-6 text-center border border-gray-700">
122
+ <p class="text-gray-300 mb-2">Blocks Mined</p>
123
+ <p class="text-3xl font-bold text-yellow-500" id="blocksMined">1,284</p>
124
+ </div>
125
+ <div class="bg-gray-800 rounded-lg p-6 text-center border border-gray-700">
126
+ <p class="text-gray-300 mb-2">Avg. Block Time</p>
127
+ <p class="text-3xl font-bold text-yellow-500" id="blockTime">2.4 min</p>
128
+ </div>
129
+ </div>
130
+ </section>
131
+
132
+ <section>
133
+ <h2 class="text-2xl font-bold mb-8 text-center">How It Works</h2>
134
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
135
+ <div class="bg-gray-800 rounded-xl p-6 border border-gray-700">
136
+ <div class="flex justify-center mb-4">
137
+ <div class="bg-gray-700 rounded-full w-16 h-16 flex items-center justify-center">
138
+ <i data-feather="user" class="text-yellow-500 w-8 h-8"></i>
139
+ </div>
140
+ </div>
141
+ <h3 class="text-xl font-semibold text-center mb-3">1. Create Account</h3>
142
+ <p class="text-gray-300 text-center">Sign up in seconds to start your mining journey.</p>
143
+ </div>
144
+ <div class="bg-gray-800 rounded-xl p-6 border border-gray-700">
145
+ <div class="flex justify-center mb-4">
146
+ <div class="bg-gray-700 rounded-full w-16 h-16 flex items-center justify-center">
147
+ <i data-feather="cpu" class="text-yellow-500 w-8 h-8"></i>
148
+ </div>
149
+ </div>
150
+ <h3 class="text-xl font-semibold text-center mb-3">2. Start Mining</h3>
151
+ <p class="text-gray-300 text-center">Click the start button to begin earning cryptocurrency.</p>
152
+ </div>
153
+ <div class="bg-gray-800 rounded-xl p-6 border border-gray-700">
154
+ <div class="flex justify-center mb-4">
155
+ <div class="bg-gray-700 rounded-full w-16 h-16 flex items-center justify-center">
156
+ <i data-feather="dollar-sign" class="text-yellow-500 w-8 h-8"></i>
157
+ </div>
158
+ </div>
159
+ <h3 class="text-xl font-semibold text-center mb-3">3. Earn & Withdraw</h3>
160
+ <p class="text-gray-300 text-center">Collect your earnings and withdraw to your wallet.</p>
161
+ </div>
162
+ </div>
163
+ </section>
164
+ </main>
165
+
166
+ <footer class="bg-gray-900 border-t border-gray-800 py-8 mt-16">
167
+ <div class="container mx-auto px-4">
168
+ <div class="flex flex-col md:flex-row justify-between items-center">
169
+ <div class="mb-6 md:mb-0">
170
+ <div class="flex items-center space-x-2">
171
+ <i data-feather="cpu" class="text-yellow-500"></i>
172
+ <span class="text-xl font-bold">ByteBaron</span>
173
+ </div>
174
+ <p class="text-gray-400 mt-2">Mining the future, one hash at a time.</p>
175
+ </div>
176
+ <div class="flex space-x-6">
177
+ <a href="#" class="text-gray-400 hover:text-yellow-500 transition">
178
+ <i data-feather="twitter"></i>
179
+ </a>
180
+ <a href="#" class="text-gray-400 hover:text-yellow-500 transition">
181
+ <i data-feather="github"></i>
182
+ </a>
183
+ <a href="#" class="text-gray-400 hover:text-yellow-500 transition">
184
+ <i data-feather="linkedin"></i>
185
+ </a>
186
+ <a href="#" class="text-gray-400 hover:text-yellow-500 transition">
187
+ <i data-feather="mail"></i>
188
+ </a>
189
+ </div>
190
+ </div>
191
+ <div class="border-t border-gray-800 mt-8 pt-8 flex flex-col md:flex-row justify-between items-center">
192
+ <p class="text-gray-500 text-sm mb-4 md:mb-0">© 2023 ByteBaron. All rights reserved.</p>
193
+ <div class="flex space-x-6">
194
+ <a href="#" class="text-gray-400 hover:text-yellow-500 text-sm transition">Privacy Policy</a>
195
+ <a href="#" class="text-gray-400 hover:text-yellow-500 text-sm transition">Terms of Service</a>
196
+ <a href="#" class="text-gray-400 hover:text-yellow-500 text-sm transition">FAQ</a>
197
+ <a href="#" class="text-gray-400 hover:text-yellow-500 text-sm transition">Contact</a>
198
+ </div>
199
+ </div>
200
+ </div>
201
+ </footer>
202
+
203
+ <script>
204
+ // Initialize Vanta.js background
205
+ VANTA.NET({
206
+ el: "#vanta-bg",
207
+ mouseControls: true,
208
+ touchControls: true,
209
+ gyroControls: false,
210
+ minHeight: 200.00,
211
+ minWidth: 200.00,
212
+ scale: 1.00,
213
+ scaleMobile: 1.00,
214
+ color: 0xffb300,
215
+ backgroundColor: 0x111827,
216
+ points: 12.00,
217
+ maxDistance: 24.00,
218
+ spacing: 18.00
219
+ });
220
+
221
+ // Update mining stats every 2 seconds (demo purposes)
222
+ setInterval(() => {
223
+ document.getElementById('totalMiners').textContent =
224
+ (parseInt(document.getElementById('totalMiners').textContent.replace(/,/g, '')) + Math.floor(Math.random() * 10)).toLocaleString();
225
+
226
+ const networkHash = (Math.random() * 2 + 3.5).toFixed(1);
227
+ document.getElementById('networkHashrate').textContent = networkHash + ' TH/s';
228
+
229
+ document.getElementById('blocksMined').textContent =
230
+ (parseInt(document.getElementById('blocksMined').textContent.replace(/,/g, '')) + Math.floor(Math.random() * 3)).toLocaleString();
231
+
232
+ document.getElementById('blockTime').textContent =
233
+ (Math.random() * 0.5 + 2.2).toFixed(1) + ' min';
234
+ }, 2000);
235
+
236
+ // Initialize feather icons
237
+ feather.replace();
238
+ </script>
239
+ </body>
240
  </html>