-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
428 lines (424 loc) · 19.6 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
<!DOCTYPE html>
<html lang="en"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="description" content="A clean, beautiful and responsive portfolio template for Developers! using only Html, CSS, and JavaScript">
<meta name="author" content="Mansour hassan">
<title>Mansour Hassan | Machine Learning Engineer</title>
<link href="./css/header.css" rel="stylesheet">
<link href="./css/main.css" rel="stylesheet">
<link href="./css/home.css" rel="stylesheet">
<link href="./css/about.css" rel="stylesheet">
<link href="./css/service.css" rel="stylesheet">
<link href="./css/portfolio.css" rel="stylesheet">
<link href="./css/testimonials.css" rel="stylesheet">
<link href="./css/testimonials.css" rel="stylesheet">
<link href="./css/blog.css" rel="stylesheet">
<link href="./css/contact.css" rel="stylesheet">
<link href="./css/footer.css" rel="stylesheet">
</head>
<body>
<header class="">
<div class="container">
<div class="row">
<div class="brand-name">
<a href="/" class="logo">Puskar</a>
</div>
<div class="hamburger">
<i class="fa fa-bars"></i>
</div>
<div class="navbar">
<ul>
<li><a href="#home" class="active">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#blog">Blog</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</div>
</div>
</header>
<section class="home" id="home">
<div class="container">
<div class="row full-screen">
<div class="home-content">
<div class="block">
<h6>Hi, my name is</h6>
<h1>Mansour hassan</h1>
<h3>I work with data</h3>
<div class="cv-btn">
<a href="#">Donwload CV</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="about" id="about">
<div class="container">
<div class="row">
<div class="title">
<h1>About Me</h1>
<p>Know more about me</p>
</div>
</div>
<div class="row">
<div class="about-content">
<div class="row">
<div class="img">
<img src="img/me.png" alt="me">
</div>
<div class="text">
<h4>I'm Puskar Adhikari</h4>
<h6>A <span>Web developer</span> and <span>machine learning engineer</span> living and working in
Khartoum, Sudan
</h6>
<p>I'm passionate about creating and developing creative products. I specialize in
building machine learning models and data driven solutions for small to medium size business. I keep my code clean, readable, modular and
well refactored. I enjoy working with complex challenges and problems that are related to scoial and enviruoment concperns.
</p>
<div class="skills">
<h6>Here are My few Tech Stack I've been working:</h6>
<div class="skills-list">
<ul class="fa-ul">
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>python</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>SQL</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>IaaS</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>Tensorflow</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>R</li>
</ul>
<ul class="fa-ul">
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>Version Control</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>Google cloud platfrom</li>
<li><span class="fa-li"><i class="fas fa-check-square"></i></span>google eirth engine</li>
</ul>
</div>
</div>
<div class="social">
<a href=""><i class="fa fa-facebook"></i></a>
<a href=""><i class="fa fa-twitter"></i></a>
<a href=""><i class="fa fa-instagram"></i></a>
<a href=""><i class="fa fa-github"></i></a>
<a href=""><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
</div>
</div></section>
<section class="services" id="services">
<div class="container">
<div class="row">
<div class="title text-center">
<h1>Services</h1>
</div>
</div>
<div class="row">
<div class="service-content">
<div class="box">
<div class="icon"><i class="fa fa-laptop"></i></div>
<h5>Data Analysis</h5>
<p>drive insights from a bile of data, and hepl transifer data to decision</p>
</div>
<div class="box">
<div class="icon"><i class="fa fa-code"></i></div>
<h5>Data engineering</h5>
<p>develop pipelines that are highly scalable and reliable for all voriaity of application</p>
</div>
<div class="box">
<div class="icon"><i class="fas fa-palette"></i></div>
<h5>Data visulations</h5>
<p>Can create appealing story from every data</p>
</div>
<div class="box">
<div class="icon"><i class="fas fa-wallet"></i></div>
<h5>Business Application</h5>
<p>I take an innovation-led approach to business application
services that make use of emerging technology and
software-as-a-service.
</p>
</div>
<div class="box">
<div class="icon"><i class="fa fa-mobile"></i></div>
<h5>Embeeded software</h5>
<p>To match the pace, I give my best to design eye-catching
designs and prominent user-interfaces.
</p>
</div>
<div class="box">
<div class="icon"><i class="fa fa-rocket"></i></div>
<h5>SEO</h5>
<p>SEO is a critical component of online marketing. I use a
combination of the latest onsite and off-site strategies to
produce top results.
</p>
</div>
</div>
</div>
</div>
</section>
<section class="portfolio" id="portfolio">
<div class="container">
<div class="row">
<div class="title text-center">
<h1>Latest Works</h1>
</div>
</div>
<div class="row">
<div class="filter-btn">
<ul id="filterBtn">
<li class="active" data-target="all">All</li>
<li data-target="web">Web Design</li>
<li data-target="app">App Interface</li>
<li data-target="ui">UI/UX</li>
</ul>
</div>
</div>
<div class="row">
<div class="gallery">
<div class="item" data-id="web">
<div class="inner">
<img src="./img/portfolio/web.jpg" alt="portfolio">
<div class="overlay">
<span class="fa fa-plus"></span>
<h4>Web Design</h4>
</div>
</div>
</div>
<div class="item" data-id="web">
<div class="inner">
<img src="./img/portfolio/web2.png" alt="portfolio">
<div class="overlay">
<span class="fa fa-plus"></span>
<h4>Web Design</h4>
</div>
</div>
</div>
<div class="item" data-id="app">
<div class="inner">
<img src="./img/portfolio/app.png" alt="portfolio">
<div class="overlay">
<span class="fa fa-plus"></span>
<h4>App Interface</h4>
</div>
</div>
</div>
<div class="item" data-id="app">
<div class="inner">
<img src="./img/portfolio/app2.png" alt="portfolio">
<div class="overlay">
<span class="fa fa-plus"></span>
<h4>App Interface</h4>
</div>
</div>
</div>
<div class="item" data-id="ui">
<div class="inner">
<img src="./img/portfolio/ui2.png" alt="portfolio">
<div class="overlay">
<span class="fa fa-plus"></span>
<h4>UI/UX Design</h4>
</div>
</div>
</div>
<div class="item" data-id="ui">
<div class="inner">
<img src="./img/portfolio/ui3.png" alt="portfolio">
<div class="overlay">
<span class="fa fa-plus"></span>
<h4>UI/UX Design</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="message">
<div class="container">
<div class="row align-items-center">
<div class="message-text">
<h2>My inbox is always open. Whether you have a question or just want to say hi or want to hire me, I'll try my best to get back to you!</h2>
</div>
<div class="button ">
<a href="">Get In Touch</a>
</div>
</div>
</div>
</section>
<section class="testimonials">
<div class="container">
<div class="row">
<div class="title text-center">
<h1>Testimonials</h1>
</div>
</div>
<div class="row">
<div class="testimonials-content">
<div class="testimonials-box" style="width: 2280px; margin-left: 0px;">
<div class="testimonials-img" style="width: 540px; margin: 15px;">
<div class="test-img">
<img src="./img/testimonials/1.jpeg">
</div>
<div class="testimonials-text">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias, aliquam. Corrupti molestias quae culpa accusamus magni accusantium itaque dolore soluta.</p>
<h6>Mosh Hamedani</h6>
<p>Software Engineer</p>
</div>
</div>
<div class="testimonials-img" style="width: 540px; margin: 15px;">
<div class="test-img">
<img src="./img/testimonials/2.jpg">
</div>
<div class="testimonials-text">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias, aliquam. Corrupti molestias quae culpa accusamus magni accusantium itaque dolore soluta.</p>
<h6>Kyle Simpson</h6>
<p>JavaScript Engineer</p>
</div>
</div>
<div class="testimonials-img" style="width: 540px; margin: 15px;">
<div class="test-img">
<img src="./img/testimonials/3.jpg">
</div>
<div class="testimonials-text">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias, aliquam. Corrupti molestias quae culpa accusamus magni accusantium itaque dolore soluta.</p>
<h6>Ryan Florence</h6>
<p>ReactJS Engineer</p>
</div>
</div>
<div class="testimonials-img" style="width: 540px; margin: 15px;">
<div class="test-img">
<img src="./img/testimonials/4.jpg">
</div>
<div class="testimonials-text">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias, aliquam. Corrupti molestias quae culpa accusamus magni accusantium itaque dolore soluta.</p>
<h6>Amelia Madyson</h6>
<p>Front-End Developer</p>
</div>
</div>
</div>
<div class="slider"><div id="0" onclick="controlSlide(this)" class="active"></div><div id="1" onclick="controlSlide(this)" class=""></div></div>
</div>
</div>
</div>
</section>
<section class="blog" id="blog">
<div class="container">
<div class="row">
<div class="title text-center">
<h1>Latest Blogs</h1>
</div>
</div>
<div class="row">
<div class="blog-content">
<div class="blog-box">
<div class="blog-img">
<img src="./img/blogs/1.jpg">
</div>
<div class="blog-text">
<div class="blog-info">
<span>May 3, 2020</span>
<span>Version Control</span>
</div>
<h3>Why every developer uses Git.</h3>
<p>Git allows us to have a “version” of a project which shows the changes that were made to the code over time, and allows us to backtrack if necessary and undo the changes.</p>
<a href="https://devpuskar.netlify.app/blogs/04git">Read More</a>
</div>
</div>
<div class="blog-box">
<div class="blog-img">
<img src="./img/blogs/2.png">
</div>
<div class="blog-text">
<div class="blog-info">
<span>May 1, 2020</span>
<span>Web Development</span>
</div>
<h3>JavaScript Promises</h3>
<p>Before we use promises, our code was full of confusing callback tricks and asynchronous. Switching to promises made our code easier to read, understand, and test.</p>
<a href="https://devpuskar.netlify.app/blogs/03jspromises">Read More</a>
</div>
</div>
<div class="blog-box">
<div class="blog-img">
<img src="./img/blogs/3.jpg">
</div>
<div class="blog-text">
<div class="blog-info">
<span>April 27, 2020</span>
<span>Programming</span>
</div>
<h3>Why we don’t need a degree to be a Developer.</h3>
<p>That's right. You don’t need a degree to be a developer. Whilst university is definitely the right path for some people, it is not right for everyone.</p>
<a href="https://devpuskar.netlify.app/blogs/01developerdegree">Read More</a>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="contact" id="contact">
<div class="container">
<div class="row">
<div class="title text-center">
<h1>Get In Touch</h1>
</div>
</div>
<div class="row">
<div class="contact-form">
<div class="row">
<div class="contact-text">
<h2>Drop Me message</h2>
<p>My inbox is always open I'll try my best to get back to you!</p>
</div>
</div>
<div class="row space-between">
<div class="col-6">
<input type="text" class="form-control" name="" placeholder="Name">
</div>
<div class="col-6">
<input type="text" class="form-control" name="" placeholder="Email">
</div>
</div>
<div class="row">
<div class="col-12">
<textarea class="form-control" placeholder="Your Message"></textarea>
</div>
</div>
<div class="row">
<div class="button btn">
<a href="#">Get In Touch</a>
</div>
</div>
</div>
</div>
</div>
</section>
<footer>
<div class="container">
<div class="row">
<div class="footer-logo">Puskar</div>
<div class="social-link">
<a href=""><i class="fa fa-facebook"></i></a>
<a href=""><i class="fa fa-instagram"></i></a>
<a href=""><i class="fa fa-twitter"></i></a>
<a href=""><i class="fa fa-linkedin"></i></a>
<a href=""><i class="fa fa-github"></i></a>
</div>
</div>
</div>
</footer>
<section class="copyright">
<div class="container">
<p>© <span id="year">2021</span> | Designed and Developed By Puskar Adhikari. | All rights reserved.</p>
</div>
</section>
<div class="lightbox hide">
<span class="close-lightbox fa fa-close"></span>
<img src="" alt="portfolio">
</div>
<script src="./js/app.js"></script>
<div id="save-code-popup-parent"></div></body></html>