Hugging Face's logo

Spaces:
Rayan545454
/
g5
Running

App Files Community
Rayan545454 commited on
Commit
c0fc4c5
·
verified ·
1 Parent(s): 45cc1ee

undefined - Initial Deployment

Browse files
Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +247 -18
  3. prompts.txt +0 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: G5
3
- emoji: 👀
4
  colorFrom: purple
5
- colorTo: indigo
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: g5
3
+ emoji: 🐳
4
  colorFrom: purple
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,248 @@
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="ar" dir="rtl">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>الأمن السيبراني</title>
7
+ <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
8
+ <script src="https://cdn.tailwindcss.com"></script>
9
+ <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
10
+ <script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
12
+ <script src="https://unpkg.com/feather-icons"></script>
13
+ <style>
14
+ @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap');
15
+ body {
16
+ font-family: 'Tajawal', sans-serif;
17
+ background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
18
+ color: #e2e8f0;
19
+ }
20
+ .cyber-card {
21
+ transition: all 0.3s ease;
22
+ border-radius: 15px;
23
+ overflow: hidden;
24
+ }
25
+ .cyber-card:hover {
26
+ transform: translateY(-10px);
27
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
28
+ }
29
+ .gradient-text {
30
+ background: linear-gradient(90deg, #60a5fa, #3b82f6, #8b5cf6);
31
+ -webkit-background-clip: text;
32
+ -webkit-text-fill-color: transparent;
33
+ }
34
+ .security-icon {
35
+ width: 70px;
36
+ height: 70px;
37
+ display: flex;
38
+ align-items: center;
39
+ justify-content: center;
40
+ border-radius: 50%;
41
+ background: rgba(59, 130, 246, 0.1);
42
+ margin: 0 auto 20px;
43
+ }
44
+ </style>
45
+ </head>
46
+ <body>
47
+ <!-- Hero Section -->
48
+ <div class="min-h-screen flex flex-col justify-center items-center text-center px-4 py-20 relative overflow-hidden">
49
+ <div class="absolute inset-0 z-0">
50
+ <div id="vanta-bg"></div>
51
+ </div>
52
+
53
+ <div class="relative z-10 max-w-4xl">
54
+ <h1 class="text-4xl md:text-6xl font-bold mb-6 gradient-text" data-aos="fade-up">
55
+ الأمن السيبراني
56
+ </h1>
57
+ <p class="text-xl md:text-2xl mb-10 text-gray-300" data-aos="fade-up" data-aos-delay="200">
58
+ حماية العالم الرقمي من التهديدات والجرائم الإلكترونية
59
+ </p>
60
+ <div class="flex flex-col sm:flex-row justify-center gap-4" data-aos="fade-up" data-aos-delay="400">
61
+ <button class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full transition duration-300 transform hover:scale-105">
62
+ ابدأ الآن
63
+ </button>
64
+ <button class="bg-transparent border-2 border-blue-500 text-blue-400 hover:bg-blue-500 hover:text-white font-bold py-3 px-8 rounded-full transition duration-300">
65
+ تعرف أكثر
66
+ </button>
67
+ </div>
68
+ </div>
69
+ </div>
70
+
71
+ <!-- About Section -->
72
+ <div class="py-20 px-4">
73
+ <div class="max-w-6xl mx-auto">
74
+ <div class="text-center mb-16" data-aos="fade-up">
75
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">ما هو الأمن السيبراني؟</h2>
76
+ <div class="w-24 h-1 bg-blue-500 mx-auto"></div>
77
+ </div>
78
+
79
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-12 items-center">
80
+ <div data-aos="fade-left">
81
+ <img src="http://static.photos/technology/640x360/123" alt="أمن المعلومات" class="rounded-2xl shadow-2xl">
82
+ </div>
83
+ <div data-aos="fade-right">
84
+ <h3 class="text-2xl font-bold mb-6">مجال متخصص يهدف إلى:</h3>
85
+ <ul class="space-y-4">
86
+ <li class="flex items-start">
87
+ <div class="security-icon">
88
+ <i data-feather="shield" class="text-blue-400 w-8 h-8"></i>
89
+ </div>
90
+ <span class="mr-4 text-lg">حماية الأنظمة والشبكات من الهجمات الإلكترونية</span>
91
+ </li>
92
+ <li class="flex items-start">
93
+ <div class="security-icon">
94
+ <i data-feather="lock" class="text-blue-400 w-8 h-8"></i>
95
+ </div>
96
+ <span class="mr-4 text-lg">تأمين البيانات والمعلومات من الاختراق أو التسريب</span>
97
+ </li>
98
+ <li class="flex items-start">
99
+ <div class="security-icon">
100
+ <i data-feather="eye" class="text-blue-400 w-8 h-8"></i>
101
+ </div>
102
+ <span class="mr-4 text-lg">الكشف المبكر عن التهديدات والتعامل معها بسرعة</span>
103
+ </li>
104
+ <li class="flex items-start">
105
+ <div class="security-icon">
106
+ <i data-feather="target" class="text-blue-400 w-8 h-8"></i>
107
+ </div>
108
+ <span class="mr-4 text-lg">تطوير استراتيجيات تمنع الجرائم الإلكترونية</span>
109
+ </li>
110
+ </ul>
111
+ </div>
112
+ </div>
113
+ </div>
114
+ </div>
115
+
116
+ <!-- Fields Section -->
117
+ <div class="py-20 px-4 bg-gray-900">
118
+ <div class="max-w-6xl mx-auto">
119
+ <div class="text-center mb-16" data-aos="fade-up">
120
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">مجالات الأمن السيبراني</h2>
121
+ <div class="w-24 h-1 bg-blue-500 mx-auto"></div>
122
+ <p class="mt-6 text-gray-400 max-w-2xl mx-auto">
123
+ تخصصات متنوعة تغطي جميع جوانب الحماية الرقمية
124
+ </p>
125
+ </div>
126
+
127
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
128
+ <div class="cyber-card bg-gray-800 p-8" data-aos="fade-up">
129
+ <div class="security-icon mb-6">
130
+ <i data-feather="database" class="text-blue-400 w-10 h-10"></i>
131
+ </div>
132
+ <h3 class="text-xl font-bold mb-4 text-center">حماية المعلومات</h3>
133
+ <p class="text-gray-400 text-center">
134
+ (Information Security) تأمين البيانات والمعلومات من الاختراق أو التسريب
135
+ </p>
136
+ </div>
137
+
138
+ <div class="cyber-card bg-gray-800 p-8" data-aos="fade-up" data-aos-delay="100">
139
+ <div class="security-icon mb-6">
140
+ <i data-feather="globe" class="text-blue-400 w-10 h-10"></i>
141
+ </div>
142
+ <h3 class="text-xl font-bold mb-4 text-center">أمن الشبكات</h3>
143
+ <p class="text-gray-400 text-center">
144
+ (Network Security) حماية الشبكات من الهجمات الإلكترونية والاختراق
145
+ </p>
146
+ </div>
147
+
148
+ <div class="cyber-card bg-gray-800 p-8" data-aos="fade-up" data-aos-delay="200">
149
+ <div class="security-icon mb-6">
150
+ <i data-feather="search" class="text-blue-400 w-10 h-10"></i>
151
+ </div>
152
+ <h3 class="text-xl font-bold mb-4 text-center">التحقيق الرقمي</h3>
153
+ <p class="text-gray-400 text-center">
154
+ (Digital Forensics) جمع وتحليل الأدلة الرقمية للكشف عن الجرائم الإلكترونية
155
+ </p>
156
+ </div>
157
+
158
+ <div class="cyber-card bg-gray-800 p-8" data-aos="fade-up" data-aos-delay="300">
159
+ <div class="security-icon mb-6">
160
+ <i data-feather="cpu" class="text-blue-400 w-10 h-10"></i>
161
+ </div>
162
+ <h3 class="text-xl font-bold mb-4 text-center">أمن الذكاء الاصطناعي</h3>
163
+ <p class="text-gray-400 text-center">
164
+ (AI Security) حماية أنظمة الذكاء الاصطناعي من التلاعب والهجمات السيبرانية
165
+ </p>
166
+ </div>
167
+
168
+ <div class="cyber-card bg-gray-800 p-8" data-aos="fade-up" data-aos-delay="400">
169
+ <div class="security-icon mb-6">
170
+ <i data-feather="zap" class="text-blue-400 w-10 h-10"></i>
171
+ </div>
172
+ <h3 class="text-xl font-bold mb-4 text-center">مكافحة الهجمات السيبرانية</h3>
173
+ <p class="text-gray-400 text-center">
174
+ (Cyber Attacks Prevention) تطوير استراتيجيات ومنصات لمنع الهجمات الإلكترونية
175
+ </p>
176
+ </div>
177
+
178
+ <div class="cyber-card bg-gray-800 p-8" data-aos="fade-up" data-aos-delay="500">
179
+ <div class="security-icon mb-6">
180
+ <i data-feather="users" class="text-blue-400 w-10 h-10"></i>
181
+ </div>
182
+ <h3 class="text-xl font-bold mb-4 text-center">أمان التطبيقات</h3>
183
+ <p class="text-gray-400 text-center">
184
+ (Application Security) تأمين البرمجيات والتطبيقات من الثغرات الأمنية
185
+ </p>
186
+ </div>
187
+ </div>
188
+ </div>
189
+ </div>
190
+
191
+ <!-- Goal Section -->
192
+ <div class="py-20 px-4">
193
+ <div class="max-w-4xl mx-auto text-center">
194
+ <div class="mb-16" data-aos="fade-up">
195
+ <h2 class="text-3xl md:text-4xl font-bold mb-4">الهدف من الأمن السيبراني</h2>
196
+ <div class="w-24 h-1 bg-blue-500 mx-auto"></div>
197
+ </div>
198
+
199
+ <div class="bg-gradient-to-r from-blue-900 to-purple-900 rounded-3xl p-10 shadow-2xl" data-aos="fade-up">
200
+ <div class="security-icon mx-auto mb-8">
201
+ <i data-feather="shield" class="text-white w-12 h-12"></i>
202
+ </div>
203
+ <h3 class="text-2xl font-bold mb-6">تأمين العالم الرقمي من التهديدات</h3>
204
+ <p class="text-xl leading-relaxed">
205
+ ضمان بيئة آمنة للمستخدمين والأفراد والشركات من خلال حماية الأنظمة والشبكات والبيانات من الهجمات الإلكترونية والجرائم السيبرانية
206
+ </p>
207
+ <div class="mt-10 flex justify-center">
208
+ <div class="flex items-center bg-gray-800 rounded-full px-6 py-3">
209
+ <i data-feather="users" class="text-blue-400 ml-3"></i>
210
+ <span>حماية الأفراد والشركات</span>
211
+ </div>
212
+ </div>
213
+ </div>
214
+ </div>
215
+ </div>
216
+
217
+ <!-- Footer -->
218
+ <footer class="py-10 px-4 bg-gray-900 border-t border-gray-800">
219
+ <div class="max-w-6xl mx-auto text-center">
220
+ <p class="text-gray-500">
221
+ © 2023 الأمن السيبراني. جميع الحقوق محفوظة.
222
+ </p>
223
+ </div>
224
+ </footer>
225
+
226
+ <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
227
+ <script>
228
+ AOS.init();
229
+ feather.replace();
230
+
231
+ // Vanta.js background
232
+ VANTA.GLOBE({
233
+ el: "#vanta-bg",
234
+ mouseControls: true,
235
+ touchControls: true,
236
+ gyroControls: false,
237
+ minHeight: 200.00,
238
+ minWidth: 200.00,
239
+ scale: 1.00,
240
+ scaleMobile: 1.00,
241
+ color: 0x3b82f6,
242
+ color2: 0x8b5cf6,
243
+ backgroundColor: 0x0f172a,
244
+ size: 1.50
245
+ });
246
+ </script>
247
+ </body>
248
  </html>
prompts.txt ADDED
File without changes