Hugging Face's logo

Spaces:
PersianAICommunity
/
README
Running

App Files Community
masoudmarandi commited on
Commit
10c39ef
·
verified ·
1 Parent(s): f97eab6

Create index.html

Browse files
Files changed (1) hide show
  1. index.html +267 -0
index.html ADDED
@@ -0,0 +1,267 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en" dir="ltr">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Persian AI Community | جامعه هوش مصنوعی فارسی</title>
7
+ <meta name="description" content="Advancing Persian AI through collaborative datasets, models, and research">
8
+
9
+ <!-- Fonts -->
10
+ <link rel="preconnect" href="https://fonts.googleapis.com">
11
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
12
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet">
13
+
14
+ <!-- Tailwind -->
15
+ <script src="https://cdn.tailwindcss.com"></script>
16
+
17
+ <!-- Feather Icons -->
18
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
19
+ <script src="https://unpkg.com/feather-icons"></script>
20
+ <!-- Custom Styles -->
21
+ <link rel="stylesheet" href="style.css">
22
+
23
+ <!-- Additional Fonts for Enhanced Design -->
24
+ <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Playfair+Display:wght@400;700;900&display=swap" rel="stylesheet">
25
+
26
+ <!-- Tailwind Config -->
27
+ <script>
28
+ tailwind.config = {
29
+ theme: {
30
+ extend: {
31
+ fontFamily: {
32
+ 'en': ['Inter', 'sans-serif'],
33
+ 'fa': ['Vazirmatn', 'sans-serif'],
34
+ },
35
+ colors: {
36
+ 'hf-orange': '#FF6B00',
37
+ 'hf-blue': '#3B82F6',
38
+ 'hf-green': '#10B981',
39
+ 'hf-purple': '#8B5CF6',
40
+ }
41
+ }
42
+ }
43
+ }
44
+ </script>
45
+ </head>
46
+ <body class="font-en">
47
+ <!-- Language Toggle -->
48
+ <a href="index-fa.html" class="fixed top-4 right-4 z-50 px-4 py-2 bg-[#FF6B00] border border-[#FF6B00] text-white font-medium rounded-lg hover:bg-[#E55A00] transition-colors duration-200 text-sm" style="font-family: 'Vazirmatn', sans-serif;">
49
+ فارسی
50
+ </a>
51
+ <!-- Hero Section -->
52
+ <section class="min-h-screen flex items-center justify-center relative overflow-hidden bg-gradient-to-br from-[#FFEEE4] via-[#F9F5FF] to-[#E8F4FD]">
53
+ <!-- Background Pattern similar to Hugging Face -->
54
+ <div class="absolute inset-0 opacity-5">
55
+ <div class="absolute inset-0" style="background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(59,130,246,0.1) 35px, rgba(59,130,246,0.1) 70px);"></div>
56
+ </div>
57
+ <!-- Enhanced Hero Content -->
58
+ <div class="relative z-10 text-center px-4 max-w-6xl mx-auto">
59
+ <!-- Logo similar to Hugging Face -->
60
+ <div class="mb-8">
61
+ <div class="inline-flex items-center justify-center w-24 h-24 bg-gradient-to-br from-[#FF6B00] to-[#FF8E53] rounded-2xl mb-6 shadow-lg">
62
+ <i data-feather="cpu" class="w-12 h-12 text-white"></i>
63
+ </div>
64
+ </div>
65
+ <h1 class="text-5xl md:text-6xl font-bold mb-6 bg-gradient-to-r from-[#FF6B00] to-[#3B82F6] bg-clip-text text-transparent" style="font-weight: 700;">
66
+ Persian AI Community
67
+ </h1>
68
+ <p class="text-xl md:text-2xl text-gray-600 mb-8 max-w-3xl mx-auto leading-relaxed">
69
+ Advancing Persian AI through collaborative datasets, models, and research
70
+ </p>
71
+ <div class="flex flex-wrap gap-4 justify-center mb-12">
72
+ <a href="https://huggingface.co/PersianAICommunity" target="_blank" class="inline-flex items-center gap-2 px-6 py-3 bg-[#FF6B00] hover:bg-[#E55A00] text-white font-medium rounded-lg shadow-md hover:shadow-lg transition-all duration-200">
73
+ <i data-feather="home" class="w-4 h-4"></i>
74
+ View on HuggingFace
75
+ </a>
76
+ <a href="#collections" class="inline-flex items-center gap-2 px-6 py-3 bg-white text-[#FF6B00] border border-[#FF6B00] font-medium rounded-lg hover:bg-[#FFF8F5] transition-all duration-200">
77
+ <i data-feather="grid" class="w-4 h-4"></i>
78
+ Explore Collections
79
+ </a>
80
+ </div>
81
+ <!-- Stats -->
82
+ <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mt-12">
83
+ <div class="stat-card bg-white rounded-lg p-6 hover:shadow-lg transition-all duration-300 border border-gray-200">
84
+ <div class="text-2xl font-bold text-gray-900 mb-1">
85
+ <i data-feather="database" class="w-8 h-8 mx-auto mb-2 text-[#3B82F6]"></i>
86
+ </div>
87
+ <div class="text-3xl font-bold text-gray-900">50+</div>
88
+ <div class="text-md text-gray-700 font-semibold">Datasets</div>
89
+ <div class="text-sm text-gray-500">Premium quality</div>
90
+ </div>
91
+ <div class="stat-card bg-white rounded-lg p-6 hover:shadow-lg transition-all duration-300 border border-gray-200">
92
+ <div class="text-2xl font-bold text-gray-900 mb-1">
93
+ <i data-feather="box" class="w-8 h-8 mx-auto mb-2 text-[#10B981]"></i>
94
+ </div>
95
+ <div class="text-3xl font-bold text-gray-900">100+</div>
96
+ <div class="text-md text-gray-700 font-semibold">Models</div>
97
+ <div class="text-sm text-gray-500">Advanced tech</div>
98
+ </div>
99
+ <div class="stat-card bg-white rounded-lg p-6 hover:shadow-lg transition-all duration-300 border border-gray-200">
100
+ <div class="text-2xl font-bold text-gray-900 mb-1">
101
+ <i data-feather="users" class="w-8 h-8 mx-auto mb-2 text-[#F59E0B]"></i>
102
+ </div>
103
+ <div class="text-3xl font-bold text-gray-900">1000+</div>
104
+ <div class="text-md text-gray-700 font-semibold">Community</div>
105
+ <div class="text-sm text-gray-500">Researchers</div>
106
+ </div>
107
+ </div>
108
+ </div>
109
+ <!-- Scroll Indicator -->
110
+ <div class="absolute bottom-8 left-1/2 transform -translate-x-1/2 animate-bounce">
111
+ <i data-feather="chevron-down" class="w-8 h-8 text-gray-400"></i>
112
+ </div>
113
+ </section>
114
+ <!-- Mission Section -->
115
+ <section class="py-20 px-4 bg-gray-50">
116
+ <div class="max-w-6xl mx-auto">
117
+ <h2 class="text-4xl md:text-5xl font-bold text-center mb-16 text-gray-900">
118
+ Our Mission
119
+ </h2>
120
+ <div class="grid md:grid-cols-3 gap-8">
121
+ <div class="mission-card text-center p-8 rounded-xl bg-white hover:shadow-lg transition-all duration-200 border border-gray-200">
122
+ <div class="w-16 h-16 mx-auto mb-6 bg-gradient-to-br from-[#3B82F6] to-[#1E40AF] rounded-xl flex items-center justify-center">
123
+ <i data-feather="trending-up" class="w-8 h-8 text-white"></i>
124
+ </div>
125
+ <h3 class="text-xl font-bold mb-4 text-gray-900">Advance Persian AI</h3>
126
+ <p class="text-gray-600 leading-relaxed">Developing state-of-the-art models and research for Persian language processing</p>
127
+ </div>
128
+
129
+ <div class="mission-card text-center p-8 rounded-xl bg-white hover:shadow-lg transition-all duration-200 border border-gray-200">
130
+ <div class="w-16 h-16 mx-auto mb-6 bg-gradient-to-br from-[#10B981] to-[#047857] rounded-xl flex items-center justify-center">
131
+ <i data-feather="unlock" class="w-8 h-8 text-white"></i>
132
+ </div>
133
+ <h3 class="text-xl font-bold mb-4 text-gray-900">Open Access</h3>
134
+ <p class="text-gray-600">Making quality datasets and models freely available to everyone</p>
135
+ </div>
136
+
137
+ <div class="mission-card text-center p-8 rounded-xl bg-white hover:shadow-lg transition-all duration-200 border border-gray-200">
138
+ <div class="w-16 h-16 mx-auto mb-6 bg-gradient-to-br from-[#F59E0B] to-[#D97706] rounded-xl flex items-center justify-center">
139
+ <i data-feather="users" class="w-8 h-8 text-white"></i>
140
+ </div>
141
+ <h3 class="text-xl font-bold mb-4 text-gray-900">Community First</h3>
142
+ <p class="text-gray-600">Building a global network of Persian AI researchers and developers</p>
143
+ </div>
144
+ </div>
145
+ </div>
146
+ </section>
147
+ <!-- Collections Section -->
148
+ <section id="collections" class="py-20 px-4 bg-white">
149
+ <div class="max-w-6xl mx-auto">
150
+ <h2 class="text-4xl md:text-5xl font-bold text-center mb-16 text-gray-900">
151
+ Popular Collections
152
+ </h2>
153
+ <div class="grid md:grid-cols-3 gap-6">
154
+ <a href="https://huggingface.co/collections/PersianAICommunity/fibonacci-ai" target="_blank" class="collection-card group block bg-white rounded-xl overflow-hidden border border-gray-200 hover:shadow-lg transition-all duration-200">
155
+ <div class="h-32 bg-gradient-to-br from-[#8B5CF6] to-[#EC4899] flex items-center justify-center">
156
+ <i data-feather="git-branch" class="w-16 h-16 text-white"></i>
157
+ </div>
158
+ <div class="p-5">
159
+ <h3 class="text-lg font-semibold mb-2 text-gray-900 group-hover:text-[#FF6B00]">Fibonacci AI</h3>
160
+ <p class="text-sm text-gray-600">Advanced neural architectures with mathematical optimization</p>
161
+ <div class="mt-3 text-[#3B82F6] text-sm">8 models →</div>
162
+ </div>
163
+ </a>
164
+
165
+ <a href="https://huggingface.co/collections/PersianAICommunity/persian-datasets" target="_blank" class="collection-card group block bg-white rounded-xl overflow-hidden border border-gray-200 hover:shadow-lg transition-all duration-200">
166
+ <div class="h-32 bg-gradient-to-br from-[#3B82F6] to-[#60A5FA] flex items-center justify-center">
167
+ <i data-feather="database" class="w-16 h-16 text-white"></i>
168
+ </div>
169
+ <div class="p-5">
170
+ <h3 class="text-lg font-semibold mb-2 text-gray-900 group-hover:text-[#FF6B00]">Persian Datasets</h3>
171
+ <p class="text-sm text-gray-600">High-quality curated data for sentiment analysis and NMT</p>
172
+ <div class="mt-3 text-[#3B82F6] text-sm">15 datasets →</div>
173
+ </div>
174
+ </a>
175
+
176
+ <a href="https://huggingface.co/collections/PersianAICommunity/persian-models1" target="_blank" class="collection-card group block bg-white rounded-xl overflow-hidden border border-gray-200 hover:shadow-lg transition-all duration-200">
177
+ <div class="h-32 bg-gradient-to-br from-[#10B981] to-[#34D399] flex items-center justify-center">
178
+ <i data-feather="cpu" class="w-16 h-16 text-white"></i>
179
+ </div>
180
+ <div class="p-5">
181
+ <h3 class="text-lg font-semibold mb-2 text-gray-900 group-hover:text-[#FF6B00]">Persian Models</h3>
182
+ <p class="text-sm text-gray-600">State-of-the-art transformer models optimized for Farsi</p>
183
+ <div class="mt-3 text-[#3B82F6] text-sm">12 models →</div>
184
+ </div>
185
+ </a>
186
+ </div>
187
+ </div>
188
+ </section>
189
+ <!-- Get Involved Section -->
190
+ <section class="py-20 px-4 bg-gray-50">
191
+ <div class="max-w-4xl mx-auto">
192
+ <h2 class="text-4xl md:text-5xl font-bold text-center mb-16 text-gray-900">
193
+ Get Involved
194
+ </h2>
195
+ <div class="bg-white rounded-xl p-8 border border-gray-200">
196
+ <div class="space-y-8">
197
+ <div class="flex items-start gap-4">
198
+ <div class="flex-shrink-0 w-10 h-10 bg-[#3B82F6] rounded-lg flex items-center justify-center">
199
+ <i data-feather="upload" class="w-5 h-5 text-white"></i>
200
+ </div>
201
+ <div>
202
+ <h3 class="text-lg font-semibold mb-1 text-gray-900">Share Models</h3>
203
+ <p class="text-gray-600">Upload your Persian AI models to share with the community</p>
204
+ </div>
205
+ </div>
206
+
207
+ <div class="flex items-start gap-4">
208
+ <div class="flex-shrink-0 w-10 h-10 bg-[#10B981] rounded-lg flex items-center justify-center">
209
+ <i data-feather="database" class="w-5 h-5 text-white"></i>
210
+ </div>
211
+ <div>
212
+ <h3 class="text-lg font-semibold mb-1 text-gray-900">Contribute Datasets</h3>
213
+ <p class="text-gray-600">Help us build better datasets for Persian language tasks</p>
214
+ </div>
215
+ </div>
216
+
217
+ <div class="flex items-start gap-4">
218
+ <div class="flex-shrink-0 w-10 h-10 bg-[#F59E0B] rounded-lg flex items-center justify-center">
219
+ <i data-feather="users" class="w-5 h-5 text-white"></i>
220
+ </div>
221
+ <div>
222
+ <h3 class="text-lg font-semibold mb-1 text-gray-900">Join Discussions</h3>
223
+ <p class="text-gray-600">Connect with researchers and developers in our community</p>
224
+ </div>
225
+ </div>
226
+ </div>
227
+
228
+ <div class="text-center mt-8">
229
+ <a href="https://huggingface.co/PersianAICommunity" target="_blank" class="inline-flex items-center gap-2 px-6 py-3 bg-[#FF6B00] hover:bg-[#E55A00] text-white font-medium rounded-lg shadow-md hover:shadow-lg transition-all duration-200">
230
+ Visit Our Hub
231
+ </a>
232
+ </div>
233
+ </div>
234
+ </div>
235
+ </section>
236
+ <!-- Footer -->
237
+ <footer class="py-12 px-4 bg-white border-t border-gray-200">
238
+ <div class="max-w-6xl mx-auto">
239
+ <div class="text-center">
240
+ <div class="flex justify-center gap-6 mb-8">
241
+ <a href="https://huggingface.co/PersianAICommunity" target="_blank" class="text-gray-600 hover:text-[#FF6B00] transition-colors">
242
+ <i data-feather="home" class="w-5 h-5"></i>
243
+ </a>
244
+ <a href="https://t.me/persianaichannel" target="_blank" class="text-gray-600 hover:text-[#FF6B00] transition-colors">
245
+ <i data-feather="send" class="w-5 h-5"></i>
246
+ </a>
247
+ <a href="mailto:models@vectordbcloud.com" class="text-gray-600 hover:text-[#FF6B00] transition-colors">
248
+ <i data-feather="mail" class="w-5 h-5"></i>
249
+ </a>
250
+ </div>
251
+
252
+ <p class="text-gray-600 mb-2">
253
+ © 2024 Persian AI Community. All rights reserved.
254
+ </p>
255
+
256
+ <p class="text-sm text-gray-500">
257
+ Building the future of Persian language AI through innovation and collaboration
258
+ </p>
259
+ </div>
260
+ </div>
261
+ </footer>
262
+ </body>
263
+ </html>
264
+ <script src="script.js"></script>
265
+ <script>
266
+ feather.replace();
267
+ </script>