Ashanasri commited on
Commit
3882fc7
·
verified ·
1 Parent(s): 6ef6675

so my name is ASHA NASRI MALIKI

Browse files

and can you put an image to show me like find the image mtandaon and my email is ashanasri36@gmail.com, also my phone no is 0687725266 from Tanzania dar es salaam - Initial Deployment

Files changed (3) hide show
  1. README.md +6 -4
  2. index.html +307 -18
  3. prompts.txt +3 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Ashley
3
- emoji: 📉
4
- colorFrom: purple
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: ashley
3
+ emoji: 🐳
4
+ colorFrom: yellow
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,308 @@
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>Data Scientist & AI Engineer Portfolio</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/aos@2.3.1/dist/aos.css" rel="stylesheet">
10
+ <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
12
+ <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script>
13
+ <script src="https://unpkg.com/feather-icons"></script>
14
+ <style>
15
+ .hero-gradient {
16
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
17
+ }
18
+ .project-card:hover {
19
+ transform: translateY(-5px);
20
+ box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
21
+ }
22
+ .skill-badge:hover {
23
+ background-color: #4f46e5;
24
+ color: white;
25
+ }
26
+ </style>
27
+ </head>
28
+ <body class="font-sans antialiased text-gray-800 bg-gray-50">
29
+ <!-- Hero Section with Vanta.js Background -->
30
+ <div id="hero" class="relative overflow-hidden hero-gradient text-white min-h-screen flex items-center justify-center">
31
+ <div class="absolute inset-0" id="vanta-bg"></div>
32
+ <div class="relative z-10 container mx-auto px-6 py-20 text-center">
33
+ <h1 class="text-4xl md:text-6xl font-bold mb-4" data-aos="fade-down">Hi, I'm <span class="text-yellow-300">ASHA NASRI MALIKI</span></h1>
34
+ <h2 class="text-2xl md:text-3xl font-semibold mb-8" data-aos="fade-down" data-aos-delay="100">Data Scientist | AI/ML Engineer | Data Analyst</h2>
35
+ <p class="text-lg md:text-xl max-w-2xl mx-auto mb-10" data-aos="fade-up" data-aos-delay="200">
36
+ Transforming raw data into intelligent solutions through machine learning and artificial intelligence.
37
+ </p>
38
+ <div class="flex justify-center space-x-4" data-aos="fade-up" data-aos-delay="300">
39
+ <a href="#projects" class="px-6 py-3 bg-white text-indigo-700 font-medium rounded-lg hover:bg-gray-100 transition duration-300">View Projects</a>
40
+ <a href="#contact" class="px-6 py-3 border-2 border-white text-white font-medium rounded-lg hover:bg-white hover:text-indigo-700 transition duration-300">Contact Me</a>
41
+ </div>
42
+ </div>
43
+ </div>
44
+
45
+ <!-- About Section -->
46
+ <section id="about" class="py-20 bg-white">
47
+ <div class="container mx-auto px-6">
48
+ <h2 class="text-3xl font-bold text-center mb-16" data-aos="fade-up">About Me</h2>
49
+ <div class="flex flex-col md:flex-row items-center gap-12">
50
+ <div class="md:w-1/3" data-aos="fade-right">
51
+ <img src="http://static.photos/people/640x360/123" alt="Asha Nasri Maliki" class="rounded-xl shadow-xl w-full max-w-md mx-auto">
52
+ </div>
53
+ <div class="md:w-2/3" data-aos="fade-left">
54
+ <p class="text-lg mb-6">
55
+ I'm a passionate data scientist and AI/ML engineer with expertise in developing machine learning models, analyzing complex datasets, and creating data-driven solutions.
56
+ </p>
57
+ <p class="text-lg mb-6">
58
+ My work spans across various domains including healthcare, finance, education, and agriculture. I specialize in predictive modeling, natural language processing, computer vision, and recommendation systems.
59
+ </p>
60
+ <div class="flex flex-wrap gap-2 mb-6">
61
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">Python</span>
62
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">TensorFlow</span>
63
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">PyTorch</span>
64
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">Pandas</span>
65
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">Numpy</span>
66
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">Scikit-learn</span>
67
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">OpenCV</span>
68
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">SQL</span>
69
+ <span class="px-4 py-2 bg-indigo-100 text-indigo-800 rounded-full font-medium">Tableau</span>
70
+ </div>
71
+ <a href="#contact" class="inline-flex items-center px-6 py-3 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition duration-300">
72
+ <i data-feather="download" class="mr-2"></i> Download Resume
73
+ </a>
74
+ </div>
75
+ </div>
76
+ </div>
77
+ </section>
78
+
79
+ <!-- Projects Section -->
80
+ <section id="projects" class="py-20 bg-gray-50">
81
+ <div class="container mx-auto px-6">
82
+ <h2 class="text-3xl font-bold text-center mb-16" data-aos="fade-up">My Projects</h2>
83
+
84
+ <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
85
+ <!-- Project 1 -->
86
+ <div class="project-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300" data-aos="fade-up">
87
+ <img src="http://static.photos/finance/640x360/1" alt="Customer Churn Prediction" class="w-full h-48 object-cover">
88
+ <div class="p-6">
89
+ <h3 class="text-xl font-bold mb-2">Customer Churn Prediction</h3>
90
+ <p class="text-gray-600 mb-4">
91
+ Developed a machine learning model to predict customer churn for a telecom company with 92% accuracy.
92
+ </p>
93
+ <div class="flex flex-wrap gap-2 mb-4">
94
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Random Forest</span>
95
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Feature Engineering</span>
96
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">XGBoost</span>
97
+ </div>
98
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center">
99
+ View Details <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i>
100
+ </a>
101
+ </div>
102
+ </div>
103
+
104
+ <!-- Project 2 -->
105
+ <div class="project-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300" data-aos="fade-up" data-aos-delay="100">
106
+ <img src="http://static.photos/medical/640x360/2" alt="Brain Tumor Detection" class="w-full h-48 object-cover">
107
+ <div class="p-6">
108
+ <h3 class="text-xl font-bold mb-2">Brain Tumor Detection</h3>
109
+ <p class="text-gray-600 mb-4">
110
+ CNN-based system to detect brain tumors from MRI scans with 96% accuracy using deep learning.
111
+ </p>
112
+ <div class="flex flex-wrap gap-2 mb-4">
113
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">TensorFlow</span>
114
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">CNN</span>
115
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Medical Imaging</span>
116
+ </div>
117
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center">
118
+ View Details <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i>
119
+ </a>
120
+ </div>
121
+ </div>
122
+
123
+ <!-- Project 3 -->
124
+ <div class="project-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300" data-aos="fade-up" data-aos-delay="200">
125
+ <img src="http://static.photos/education/640x360/3" alt="Student Course Recommender" class="w-full h-48 object-cover">
126
+ <div class="p-6">
127
+ <h3 class="text-xl font-bold mb-2">Student Course Recommender</h3>
128
+ <p class="text-gray-600 mb-4">
129
+ Content-based recommender system that suggests courses to students based on their academic history.
130
+ </p>
131
+ <div class="flex flex-wrap gap-2 mb-4">
132
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Recommendation System</span>
133
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">NLP</span>
134
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Cosine Similarity</span>
135
+ </div>
136
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center">
137
+ View Details <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i>
138
+ </a>
139
+ </div>
140
+ </div>
141
+
142
+ <!-- Project 4 -->
143
+ <div class="project-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300" data-aos="fade-up">
144
+ <img src="http://static.photos/security/640x360/4" alt="Camera Theft Detection" class="w-full h-48 object-cover">
145
+ <div class="p-6">
146
+ <h3 class="text-xl font-bold mb-2">Camera Theft Detection</h3>
147
+ <p class="text-gray-600 mb-4">
148
+ Real-time surveillance system that detects suspicious activities and potential theft using computer vision.
149
+ </p>
150
+ <div class="flex flex-wrap gap-2 mb-4">
151
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">OpenCV</span>
152
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">YOLO</span>
153
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Object Detection</span>
154
+ </div>
155
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center">
156
+ View Details <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i>
157
+ </a>
158
+ </div>
159
+ </div>
160
+
161
+ <!-- Project 5 -->
162
+ <div class="project-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300" data-aos="fade-up" data-aos-delay="100">
163
+ <img src="http://static.photos/handwriting/640x360/5" alt="Handwritten Text Detection" class="w-full h-48 object-cover">
164
+ <div class="p-6">
165
+ <h3 class="text-xl font-bold mb-2">Handwritten Text Detection</h3>
166
+ <p class="text-gray-600 mb-4">
167
+ OCR system that converts handwritten notes to digital text with 89% accuracy using deep learning.
168
+ </p>
169
+ <div class="flex flex-wrap gap-2 mb-4">
170
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">LSTM</span>
171
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">CRNN</span>
172
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">OCR</span>
173
+ </div>
174
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center">
175
+ View Details <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i>
176
+ </a>
177
+ </div>
178
+ </div>
179
+
180
+ <!-- Project 6 -->
181
+ <div class="project-card bg-white rounded-xl shadow-md overflow-hidden transition duration-300" data-aos="fade-up" data-aos-delay="200">
182
+ <img src="http://static.photos/agriculture/640x360/6" alt="Green Cure Hub" class="w-full h-48 object-cover">
183
+ <div class="p-6">
184
+ <h3 class="text-xl font-bold mb-2">Green Cure Hub</h3>
185
+ <p class="text-gray-600 mb-4">
186
+ AI-powered platform for mitishamba dawa za asili that helps farmers identify medicinal plants and their uses.
187
+ </p>
188
+ <div class="flex flex-wrap gap-2 mb-4">
189
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Image Classification</span>
190
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">Flask</span>
191
+ <span class="text-xs px-2 py-1 bg-gray-100 rounded">AgriTech</span>
192
+ </div>
193
+ <a href="#" class="text-indigo-600 hover:text-indigo-800 font-medium flex items-center">
194
+ View Details <i data-feather="arrow-right" class="ml-2 w-4 h-4"></i>
195
+ </a>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </div>
200
+ </section>
201
+
202
+ <!-- Contact Section -->
203
+ <section id="contact" class="py-20 bg-white">
204
+ <div class="container mx-auto px-6 max-w-4xl">
205
+ <h2 class="text-3xl font-bold text-center mb-16" data-aos="fade-up">Get In Touch</h2>
206
+ <div class="bg-gray-50 rounded-xl shadow-md p-8" data-aos="fade-up">
207
+ <form class="space-y-6">
208
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
209
+ <div>
210
+ <label for="name" class="block text-sm font-medium text-gray-700 mb-1">Name</label>
211
+ <input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-indigo-500 focus:border-indigo-500">
212
+ </div>
213
+ <div>
214
+ <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Email</label>
215
+ <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-indigo-500 focus:border-indigo-500">
216
+ </div>
217
+ </div>
218
+ <div>
219
+ <label for="subject" class="block text-sm font-medium text-gray-700 mb-1">Subject</label>
220
+ <input type="text" id="subject" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-indigo-500 focus:border-indigo-500">
221
+ </div>
222
+ <div>
223
+ <label for="message" class="block text-sm font-medium text-gray-700 mb-1">Message</label>
224
+ <textarea id="message" rows="4" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-indigo-500 focus:border-indigo-500"></textarea>
225
+ </div>
226
+ <button type="submit" class="w-full md:w-auto px-8 py-3 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition duration-300 flex items-center justify-center">
227
+ <i data-feather="send" class="mr-2"></i> Send Message
228
+ </button>
229
+ </form>
230
+ </div>
231
+ <div class="mt-12 flex flex-col md:flex-row justify-center space-y-6 md:space-y-0 md:space-x-12 text-center" data-aos="fade-up">
232
+ <div class="flex flex-col items-center">
233
+ <div class="w-12 h-12 bg-indigo-100 rounded-full flex items-center justify-center mb-3">
234
+ <i data-feather="mail" class="text-indigo-600"></i>
235
+ </div>
236
+ <p class="font-medium">Email</p>
237
+ <a href="mailto:ashanasri36@gmail.com" class="text-indigo-600 hover:text-indigo-800">ashanasri36@gmail.com</a>
238
+ </div>
239
+ <div class="flex flex-col items-center">
240
+ <div class="w-12 h-12 bg-indigo-100 rounded-full flex items-center justify-center mb-3">
241
+ <i data-feather="phone" class="text-indigo-600"></i>
242
+ </div>
243
+ <p class="font-medium">Phone</p>
244
+ <a href="tel:+255687725266" class="text-indigo-600 hover:text-indigo-800">+255 687 725 266</a>
245
+ </div>
246
+ <div class="flex flex-col items-center">
247
+ <div class="w-12 h-12 bg-indigo-100 rounded-full flex items-center justify-center mb-3">
248
+ <i data-feather="map-pin" class="text-indigo-600"></i>
249
+ </div>
250
+ <p class="font-medium">Location</p>
251
+ <p class="text-gray-600">Dar es Salaam, Tanzania</p>
252
+ </div>
253
+ </div>
254
+ </div>
255
+ </section>
256
+
257
+ <!-- Footer -->
258
+ <footer class="py-10 bg-gray-900 text-white">
259
+ <div class="container mx-auto px-6">
260
+ <div class="flex flex-col md:flex-row justify-between items-center">
261
+ <div class="mb-6 md:mb-0">
262
+ <p>&copy; 2023 ASHA NASRI MALIKI. All rights reserved.</p>
263
+ </div>
264
+ <div class="flex space-x-6">
265
+ <a href="#" class="text-gray-400 hover:text-white transition duration-300">
266
+ <i data-feather="github"></i>
267
+ </a>
268
+ <a href="#" class="text-gray-400 hover:text-white transition duration-300">
269
+ <i data-feather="twitter"></i>
270
+ </a>
271
+ <a href="#" class="text-gray-400 hover:text-white transition duration-300">
272
+ <i data-feather="linkedin"></i>
273
+ </a>
274
+ <a href="#" class="text-gray-400 hover:text-white transition duration-300">
275
+ <i data-feather="instagram"></i>
276
+ </a>
277
+ </div>
278
+ </div>
279
+ </div>
280
+ </footer>
281
+
282
+ <!-- Scripts -->
283
+ <script>
284
+ // Initialize Vanta.js background
285
+ VANTA.GLOBE({
286
+ el: "#vanta-bg",
287
+ mouseControls: true,
288
+ touchControls: true,
289
+ gyroControls: false,
290
+ minHeight: 200.00,
291
+ minWidth: 200.00,
292
+ scale: 1.00,
293
+ scaleMobile: 1.00,
294
+ color: 0x3a86ff,
295
+ backgroundColor: 0x0,
296
+ size: 0.8
297
+ });
298
+
299
+ // Initialize AOS and Feather Icons
300
+ AOS.init({
301
+ duration: 800,
302
+ easing: 'ease-in-out',
303
+ once: true
304
+ });
305
+ feather.replace();
306
+ </script>
307
+ </body>
308
  </html>
prompts.txt ADDED
@@ -0,0 +1,3 @@
 
 
 
 
1
+ create for me my protifolio since i am data scientist, data analyst, AI and ML engineer and i ma done projects like customer churn prediction, handwritten text detection, brain tumor detection, camera theft detection also student course recommender and another project is green cure hub for mitishamba dawa za asili
2
+ so my name is ASHA NASRI MALIKI
3
+ and can you put an image to show me like find the image mtandaon and my email is ashanasri36@gmail.com, also my phone no is 0687725266 from Tanzania dar es salaam