Hugging Face's logo

Spaces:
althafff
/
sample-web
Running

App Files Community
althafff commited on
Commit
9d26f18
·
verified ·
1 Parent(s): 4f1c7cb

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +291 -19
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Sample Web
3
- emoji: 🏢
4
- colorFrom: pink
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: sample-web
3
+ emoji: 🐳
4
+ colorFrom: gray
5
+ colorTo: yellow
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,291 @@
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>CyberDojo - Practice Cybersecurity Skills</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, #1e3a8a 0%, #0f172a 100%);
12
+ }
13
+ .challenge-card:hover {
14
+ transform: translateY(-5px);
15
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
16
+ }
17
+ .typewriter {
18
+ overflow: hidden;
19
+ border-right: .15em solid #3b82f6;
20
+ white-space: nowrap;
21
+ margin: 0 auto;
22
+ letter-spacing: .15em;
23
+ animation: typing 3.5s steps(40, end), blink-caret .75s step-end infinite;
24
+ }
25
+ @keyframes typing {
26
+ from { width: 0 }
27
+ to { width: 100% }
28
+ }
29
+ @keyframes blink-caret {
30
+ from, to { border-color: transparent }
31
+ 50% { border-color: #3b82f6 }
32
+ }
33
+ </style>
34
+ </head>
35
+ <body class="bg-gray-100 font-sans">
36
+ <!-- Navigation -->
37
+ <nav class="gradient-bg text-white shadow-lg">
38
+ <div class="container mx-auto px-6 py-3">
39
+ <div class="flex justify-between items-center">
40
+ <div class="flex items-center space-x-4">
41
+ <i class="fas fa-shield-alt text-2xl text-blue-400"></i>
42
+ <span class="font-bold text-xl">CyberDojo</span>
43
+ </div>
44
+ <div class="hidden md:flex items-center space-x-8">
45
+ <a href="#" class="hover:text-blue-300 transition">Home</a>
46
+ <a href="#challenges" class="hover:text-blue-300 transition">Challenges</a>
47
+ <a href="#ctf" class="hover:text-blue-300 transition">CTFs</a>
48
+ <a href="#resources" class="hover:text-blue-300 transition">Resources</a>
49
+ <a href="#about" class="hover:text-blue-300 transition">About</a>
50
+ </div>
51
+ <div class="md:hidden">
52
+ <button id="menu-btn" class="text-white focus:outline-none">
53
+ <i class="fas fa-bars text-xl"></i>
54
+ </button>
55
+ </div>
56
+ </div>
57
+ <!-- Mobile Menu -->
58
+ <div id="mobile-menu" class="hidden md:hidden mt-4 pb-4">
59
+ <a href="#" class="block py-2 hover:text-blue-300 transition">Home</a>
60
+ <a href="#challenges" class="block py-2 hover:text-blue-300 transition">Challenges</a>
61
+ <a href="#ctf" class="block py-2 hover:text-blue-300 transition">CTFs</a>
62
+ <a href="#resources" class="block py-2 hover:text-blue-300 transition">Resources</a>
63
+ <a href="#about" class="block py-2 hover:text-blue-300 transition">About</a>
64
+ </div>
65
+ </div>
66
+ </nav>
67
+
68
+ <!-- Hero Section -->
69
+ <section class="gradient-bg text-white py-20">
70
+ <div class="container mx-auto px-6 text-center">
71
+ <h1 class="text-4xl md:text-6xl font-bold mb-6">Hone Your <span class="text-blue-400">Cybersecurity</span> Skills</h1>
72
+ <p class="text-xl md:text-2xl mb-8 typewriter">Practice ethical hacking in a safe, legal environment.</p>
73
+ <div class="flex flex-col md:flex-row justify-center gap-4">
74
+ <a href="#challenges" class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-lg transition duration-300 transform hover:scale-105">
75
+ Start Challenges
76
+ </a>
77
+ <a href="#ctf" class="bg-transparent hover:bg-blue-800 text-white font-bold py-3 px-6 border border-blue-400 rounded-lg transition duration-300 transform hover:scale-105">
78
+ Join CTF
79
+ </a>
80
+ </div>
81
+ </div>
82
+ </section>
83
+
84
+ <!-- Features Section -->
85
+ <section class="py-16 bg-white">
86
+ <div class="container mx-auto px-6">
87
+ <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Why Practice With Us?</h2>
88
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
89
+ <div class="bg-gray-50 p-6 rounded-xl shadow-md hover:shadow-lg transition">
90
+ <div class="text-blue-500 mb-4">
91
+ <i class="fas fa-lock text-4xl"></i>
92
+ </div>
93
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Legal Environment</h3>
94
+ <p class="text-gray-600">Practice hacking techniques legally on our intentionally vulnerable systems designed for learning.</p>
95
+ </div>
96
+ <div class="bg-gray-50 p-6 rounded-xl shadow-md hover:shadow-lg transition">
97
+ <div class="text-blue-500 mb-4">
98
+ <i class="fas fa-trophy text-4xl"></i>
99
+ </div>
100
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Real-World Scenarios</h3>
101
+ <p class="text-gray-600">Challenges based on actual vulnerabilities found in the wild, updated regularly.</p>
102
+ </div>
103
+ <div class="bg-gray-50 p-6 rounded-xl shadow-md hover:shadow-lg transition">
104
+ <div class="text-blue-500 mb-4">
105
+ <i class="fas fa-users text-4xl"></i>
106
+ </div>
107
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Community Support</h3>
108
+ <p class="text-gray-600">Join our active community to discuss techniques, get hints, and share knowledge.</p>
109
+ </div>
110
+ </div>
111
+ </div>
112
+ </section>
113
+
114
+ <!-- Challenges Section -->
115
+ <section id="challenges" class="py-16 bg-gray-100">
116
+ <div class="container mx-auto px-6">
117
+ <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Practice Challenges</h2>
118
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
119
+ <!-- Challenge Card 1 -->
120
+ <div class="challenge-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
121
+ <div class="p-6">
122
+ <div class="flex justify-between items-center mb-4">
123
+ <span class="bg-green-100 text-green-800 text-xs font-semibold px-2.5 py-0.5 rounded">Beginner</span>
124
+ <span class="text-yellow-500">
125
+ <i class="fas fa-star"></i>
126
+ <i class="fas fa-star"></i>
127
+ <i class="far fa-star"></i>
128
+ </span>
129
+ </div>
130
+ <h3 class="text-xl font-semibold mb-2 text-gray-800">Web Security Basics</h3>
131
+ <p class="text-gray-600 mb-4">Learn about XSS, SQLi, and CSRF vulnerabilities in a controlled environment.</p>
132
+ <div class="flex flex-wrap gap-2 mb-4">
133
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">XSS</span>
134
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">SQLi</span>
135
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">CSRF</span>
136
+ </div>
137
+ <button class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition">
138
+ Start Challenge
139
+ </button>
140
+ </div>
141
+ </div>
142
+
143
+ <!-- Challenge Card 2 -->
144
+ <div class="challenge-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
145
+ <div class="p-6">
146
+ <div class="flex justify-between items-center mb-4">
147
+ <span class="bg-yellow-100 text-yellow-800 text-xs font-semibold px-2.5 py-0.5 rounded">Intermediate</span>
148
+ <span class="text-yellow-500">
149
+ <i class="fas fa-star"></i>
150
+ <i class="fas fa-star"></i>
151
+ <i class="fas fa-star"></i>
152
+ </span>
153
+ </div>
154
+ <h3 class="text-xl font-semibold mb-2 text-gray-800">Network Penetration</h3>
155
+ <p class="text-gray-600 mb-4">Practice network scanning, enumeration, and exploitation techniques.</p>
156
+ <div class="flex flex-wrap gap-2 mb-4">
157
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">Nmap</span>
158
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">Metasploit</span>
159
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">Wireshark</span>
160
+ </div>
161
+ <button class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition">
162
+ Start Challenge
163
+ </button>
164
+ </div>
165
+ </div>
166
+
167
+ <!-- Challenge Card 3 -->
168
+ <div class="challenge-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300">
169
+ <div class="p-6">
170
+ <div class="flex justify-between items-center mb-4">
171
+ <span class="bg-red-100 text-red-800 text-xs font-semibold px-2.5 py-0.5 rounded">Advanced</span>
172
+ <span class="text-yellow-500">
173
+ <i class="fas fa-star"></i>
174
+ <i class="fas fa-star"></i>
175
+ <i class="fas fa-star"></i>
176
+ <i class="fas fa-star"></i>
177
+ </span>
178
+ </div>
179
+ <h3 class="text-xl font-semibold mb-2 text-gray-800">Binary Exploitation</h3>
180
+ <p class="text-gray-600 mb-4">Dive into buffer overflows, ROP chains, and format string vulnerabilities.</p>
181
+ <div class="flex flex-wrap gap-2 mb-4">
182
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">GDB</span>
183
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">Pwntools</span>
184
+ <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">Assembly</span>
185
+ </div>
186
+ <button class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition">
187
+ Start Challenge
188
+ </button>
189
+ </div>
190
+ </div>
191
+ </div>
192
+ <div class="text-center mt-10">
193
+ <a href="#" class="text-blue-600 hover:text-blue-800 font-semibold inline-flex items-center">
194
+ View All Challenges
195
+ <i class="fas fa-arrow-right ml-2"></i>
196
+ </a>
197
+ </div>
198
+ </div>
199
+ </section>
200
+
201
+ <!-- CTF Section -->
202
+ <section id="ctf" class="py-16 bg-white">
203
+ <div class="container mx-auto px-6">
204
+ <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Capture The Flag Events</h2>
205
+ <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 items-center">
206
+ <div>
207
+ <h3 class="text-2xl font-semibold mb-4 text-gray-800">Upcoming CTF Competition</h3>
208
+ <p class="text-gray-600 mb-6">Join our monthly CTF competition to test your skills against other cybersecurity enthusiasts. Solve challenges across multiple categories including web, crypto, forensics, and more.</p>
209
+
210
+ <div class="bg-blue-50 p-6 rounded-lg mb-6">
211
+ <div class="flex items-center mb-4">
212
+ <div class="bg-blue-100 p-3 rounded-full mr-4">
213
+ <i class="fas fa-flag text-blue-600 text-xl"></i>
214
+ </div>
215
+ <div>
216
+ <h4 class="font-bold text-gray-800">CyberDojo CTF #42</h4>
217
+ <p class="text-sm text-gray-600">Starts in 3 days, 12 hours</p>
218
+ </div>
219
+ </div>
220
+ <div class="grid grid-cols-3 gap-4 text-center">
221
+ <div>
222
+ <div class="text-2xl font-bold text-blue-600">24</div>
223
+ <div class="text-xs text-gray-500">HOURS</div>
224
+ </div>
225
+ <div>
226
+ <div class="text-2xl font-bold text-blue-600">5</div>
227
+ <div class="text-xs text-gray-500">CATEGORIES</div>
228
+ </div>
229
+ <div>
230
+ <div class="text-2xl font-bold text-blue-600">30+</div>
231
+ <div class="text-xs text-gray-500">CHALLENGES</div>
232
+ </div>
233
+ </div>
234
+ </div>
235
+
236
+ <button class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-lg transition duration-300">
237
+ Register Now
238
+ </button>
239
+ </div>
240
+ <div class="bg-gray-100 p-8 rounded-xl">
241
+ <h4 class="font-semibold mb-4 text-gray-800">Previous CTF Winners</h4>
242
+ <div class="space-y-4">
243
+ <div class="flex items-center justify-between bg-white p-4 rounded-lg shadow-sm">
244
+ <div class="flex items-center">
245
+ <div class="bg-yellow-100 text-yellow-800 font-bold w-8 h-8 flex items-center justify-center rounded-full mr-3">1</div>
246
+ <div>
247
+ <div class="font-medium">h4x0r_elite</div>
248
+ <div class="text-xs text-gray-500">1250 points</div>
249
+ </div>
250
+ </div>
251
+ <span class="text-sm font-semibold text-blue-600">CTF #41</span>
252
+ </div>
253
+ <div class="flex items-center justify-between bg-white p-4 rounded-lg shadow-sm">
254
+ <div class="flex items-center">
255
+ <div class="bg-gray-200 text-gray-800 font-bold w-8 h-8 flex items-center justify-center rounded-full mr-3">2</div>
256
+ <div>
257
+ <div class="font-medium">crypto_knight</div>
258
+ <div class="text-xs text-gray-500">1180 points</div>
259
+ </div>
260
+ </div>
261
+ <span class="text-sm font-semibold text-blue-600">CTF #41</span>
262
+ </div>
263
+ <div class="flex items-center justify-between bg-white p-4 rounded-lg shadow-sm">
264
+ <div class="flex items-center">
265
+ <div class="bg-amber-600 text-white font-bold w-8 h-8 flex items-center justify-center rounded-full mr-3">3</div>
266
+ <div>
267
+ <div class="font-medium">web_wizard</div>
268
+ <div class="text-xs text-gray-500">1120 points</div>
269
+ </div>
270
+ </div>
271
+ <span class="text-sm font-semibold text-blue-600">CTF #41</span>
272
+ </div>
273
+ </div>
274
+ </div>
275
+ </div>
276
+ </div>
277
+ </section>
278
+
279
+ <!-- Resources Section -->
280
+ <section id="resources" class="py-16 bg-gray-100">
281
+ <div class="container mx-auto px-6">
282
+ <h2 class="text-3xl font-bold text-center mb-12 text-gray-800">Learning Resources</h2>
283
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
284
+ <div class="bg-white p-6 rounded-xl shadow-md hover:shadow-lg transition">
285
+ <div class="text-blue-500 mb-4 text-3xl">
286
+ <i class="fas fa-book"></i>
287
+ </div>
288
+ <h3 class="text-xl font-semibold mb-3 text-gray-800">Guides & Tutorials</h3>
289
+ <p class="text-gray-600 mb-4">Step-by-step guides for various cybersecurity concepts and tools.</p>
290
+ <a href="#" class="text-blue
291
+ </html>
prompts.txt ADDED
File without changes