-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathhtml.html
More file actions
509 lines (508 loc) · 31.5 KB
/
html.html
File metadata and controls
509 lines (508 loc) · 31.5 KB
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
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/skins/color-1.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<link rel="stylesheet" href="css/skins/color-1.css" class="alternate-style" title="color-1" disabled>
<link rel="stylesheet" href="css/skins/color-2.css" class="alternate-style" title="color-2" disabled>
<link rel="stylesheet" href="css/skins/color-3.css" class="alternate-style" title="color-3" disabled>
<link rel="stylesheet" href="css/skins/color-4.css" class="alternate-style" title="color-4" disabled>
<link rel="stylesheet" href="css/skins/color-5.css" class="alternate-style" title="color-5" disabled>
<link rel="stylesheet" href="./css/style-switcher.css">
</head>
<body>
<div class="main-container">
<div class="aside">
<div class="logo">
<a href="#"><span>G</span>odcodev</a>
</div>
<div class="nav-toggle">
<span></span>
</div>
<ul class="nav">
<li><a href="#home" class="active"><i class="fa fa-home"></i>Home</a></li>
<li><a href="#about"><i class="fa fa-user"></i>About</a></li>
<li><a href="#service"><i class="fa fa-list"></i>Service</a></li>
<li><a href="#portfolio"><i class="fa fa-briefcase"></i>Portfolio</a></li>
<li><a href="#contact"><i class="fa fa-comments"></i>Contact</a></li>
</ul>
</div>
<div class="main-content">
<section class="home active section" id="home">
<div class="container">
<div class="row">
<div class="home-info padd-15">
<h3 class="hello">Hello, my name is <span class="name">Mensah John</span></h3>
<h3 class="my-profession">I'm a <span class="typing">Web Designer</span></h3>
<p>I'm a Web Designer with extensive experience for over 10 year.My expertise is to create website, design, graphic design, and many more...</p>
<a href="#" class="btn">Download CV</a>
</div>
<div class="home-img padd-15">
<img src="./images/img1.png" alt="my-pic.">
</div>
</div>
</div>
</section>
<section class="about section" id="about">
<div class="container">
<div class="row">
<div class="section-title padd-15">
<h2>About Me</h2>
</div>
</div>
<div class="row">
<div class="about-content padd-15">
<div class="row">
<div class="about-text padd-15">
<h3>I'm Mensah John and <span class="typing">Web Developer</span></h3>
<p>As a web developer, I have the power to bring ideas to life on the digital canvas. With every line of code, I shape the online experiences of users around the world. Whether you're crafting responsive designs, optimizing performance, or integrating innovative features, your work has the potential to inspire, educate, and connect people in meaningful ways. Stay curious, keep learning, and push the boundaries of what's possible on the web - the possibilities are endless!</p>
</div>
</div>
<div class="row">
<div class="personal-info padd-15">
<div class="row">
<div class="info-item padd-15">
<p>Birthday : <span>16 Aug 1998</span></p>
</div>
<div class="info-item padd-15">
<p>Age : <span>25</span></p>
</div>
<div class="info-item padd-15">
<p>website : <span>github.com/BoadimensLab</span></p>
</div>
<div class="info-item padd-15">
<p>E-mail : <span>thinkermensah22@gmail.com</span></p>
</div>
<div class="info-item padd-15">
<p>Degree : <span>BSc I.T</span></p>
</div>
<div class="info-item padd-15">
<p>Phone : <span>+233-556-692-349</span></p>
</div>
<div class="info-item padd-15">
<p>City : <span>Accra-Ghana</span></p>
</div>
<div class="info-item padd-15">
<p>Freelance : <span>Available</span></p>
</div>
</div>
<div class="row">
<div class="button padd-15">
<a href="#contact" data-section-index="1" class="btn hire-me">Hire me</a>
</div>
</div>
</div>
<div class="skills padd-15">
<div class="row">
<div class="skill-item padd-15">
<h5>CSS</h5>
<div class="progress">
<div class="progress-in" style="width: 80%;"></div>
<div class="skill-percent">
80%
</div>
</div>
</div>
<div class="skill-item padd-15">
<h5>HTML</h5>
<div class="progress">
<div class="progress-in" style="width: 93%;"></div>
<div class="skill-percent">
93%
</div>
</div>
</div>
<div class="skill-item padd-15">
<h5>JS</h5>
<div class="progress">
<div class="progress-in" style="width: 76%;"></div>
<div class="skill-percent">
76%
</div>
</div>
</div>
<div class="skill-item padd-15">
<h5>Bootstrap</h5>
<div class="progress">
<div class="progress-in" style="width: 68%;"></div>
<div class="skill-percent">
68%
</div>
</div>
</div>
<div class="skill-item padd-15">
<h5>PHP</h5>
<div class="progress">
<div class="progress-in" style="width: 80%;"></div>
<div class="skill-percent">
80%
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="education padd-15">
<h3 class="title">Education</h3>
<div class="row">
<div class="timeline-box padd-15">
<div class="timeline shadow-dark">
<div class="timeline-item">
<div class="circle-dot"></div>
<h3 class="timeline-date">
<i class="fa fa-calendar"></i> 2024 - to date
</h3>
<h4 class="timeline-title">Master in Computer Science (Online) </h4>
<p class="timeline-text"> With a Master's degree in Computer Science, I bring a deep understanding of the latest technologies and methodologies to the table. My advanced education has equipped me with the skills to design, develop, and deploy complex software systems that meet the highest standards of quality, scalability, and reliability. My expertise in algorithms, data structures, and software engineering enables me to tackle challenging problems with confidence and creativity. Moreover, my research experience has taught me how to approach problems systematically, think critically, and communicate complex ideas effectively.</p>
</div>
<div class="timeline-item">
<div class="circle-dot"></div>
<h3 class="timeline-date">
<i class="fa fa-calendar"></i> 2022 - 2026
</h3>
<h4 class="timeline-title"> Bachelor's degree</h4>
<p class="timeline-text"> My Bachelor's degree in Information Technology from Knutsford University has provided me with a solid foundation in the principles and practices of IT. Throughout my undergraduate studies,I gained a comprehensive understanding of computer systems,networks, and software development,as well as a strong grasp of programming languages, data structures, and algorithms.The program's emphasis on hands-on learning and real-world applications allowed me to develop a range of practical skills,from designing and implementing databases to building and deploying web applications.</p>
</div>
<div class="timeline-item">
<div class="circle-dot"></div>
<h3 class="timeline-date">
<i class="fa fa-calendar"></i> 2013 - 2015
</h3>
<h4 class="timeline-title">Micro Soft Office (Online) </h4>
<p class="timeline-text"> As a seasoned Microsoft expert,I bring a wealth of knowledge and experience in designing, developing, and deploying scalable and efficient solutions on the Microsoft stack. With a deep understanding of .NET, Azure, and Microsoft 365, I can help you unlock the full potential of your business. My expertise spans from building robust and secure applications to integrating with various Microsoft services, such as Azure Active Directory, Microsoft Graph, and Power Platform. I'm confident that my skills and expertise will enable me to deliver high-quality solutions that meet your business needs and exceed your expectations</p>
</div>
</div>
</div>
</div>
</div>
<div class="experience padd-15">
<h3 class="title">Experience</h3>
<div class="row">
<div class="timeline-box padd-15">
<div class="timeline shadow-dark">
<div class="timeline-item">
<div class="circle-dot"></div>
<h3 class="timeline-date">
<i class="fa fa-calendar"></i> 2013 - To Data
</h3>
<h4 class="timeline-title">Web Technology</h4>
<p class="timeline-text"> As a seasoned web development expert, I possess a comprehensive skill set that spans the entire web development spectrum. Whether it's building a simple brochure website, a complex e-commerce platform, or a highly interactive web application, I have the expertise to deliver high-quality solutions that meet your business needs. My proficiency in front-end technologies such as HTML5, CSS3, JavaScript, and frameworks like React, Angular, and Vue.js enables me to craft visually stunning and user-friendly interfaces that provide an exceptional user experience. Meanwhile, my expertise in back-end technologies like Node.js, Ruby on Rails, Django, and .NET allows me to design and develop robust, scalable, and secure server-side applications that power your website.</p>
</div>
<div class="timeline-item">
<div class="circle-dot"></div>
<h3 class="timeline-date">
<i class="fa fa-calendar"></i> 2013 - 2015
</h3>
<h4 class="timeline-title">Master in Computer Science</h4>
<p class="timeline-text">As a seasoned data analysis expert, I possess a broad range of skills and expertise in extracting insights from complex data sets. With proficiency in a variety of tools and technologies, including Excel, SQL, Python, R, Tableau, Power BI, and machine learning algorithms, I can collect, analyze, and interpret large datasets to uncover hidden patterns, trends, and correlations. Whether it's data mining, data visualization, statistical modeling, or predictive analytics, I have the expertise to help you make data-driven decisions and drive business growth.</p>
</div>
<div class="timeline-item">
<div class="circle-dot"></div>
<h3 class="timeline-date">
<i class="fa fa-calendar"></i> 2013 - 2015
</h3>
<h4 class="timeline-title">Cyber Security (Online) </h4>
<p class="timeline-text"> As a seasoned cybersecurity expert, I possess a deep understanding of the latest threats and vulnerabilities, as well as the expertise to design and implement robust security solutions to protect your organization's digital assets. With proficiency in threat analysis, penetration testing, incident response, and security architecture, I can identify and mitigate risks, ensuring the confidentiality, integrity, and availability of your data. My expertise spans across various domains, including network security, cloud security, endpoint security, and compliance, and I'm well-versed in industry-leading frameworks and standards, such as NIST, ISO 27001, and PCI-DSS.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!---=========service==========-->
<section class="service section" id="service">
<div class="container">
<div class="row">
<div class="section-title padd-15">
<h2>Service</h2>
</div>
</div>
<div class="row">
<div class="service-item padd-15">
<div class="service-item-inner">
<div class="icon">
<i class="fa fa-mobile-alt"></i>
</div>
<h4>Web Designe</h4>
<p>Development is the increase of total output of goods and services.</p>
</div>
</div>
<div class="service-item padd-15">
<div class="service-item-inner">
<div class="icon">
<i class="fa fa-laptop-code"></i>
</div>
<h4>Web Designe</h4>
<p>Development is the increase of total output of goods and services.</p>
</div>
</div>
<div class="service-item padd-15">
<div class="service-item-inner">
<div class="icon">
<i class="fa fa-palette"></i>
</div>
<h4>Web Designe</h4>
<p>Development is the increase of total output of goods and services.</p>
</div>
</div>
<div class="service-item padd-15">
<div class="service-item-inner">
<div class="icon">
<i class="fa fa-code"></i>
</div>
<h4>Web Designe</h4>
<p>Development is the increase of total output of goods and services.</p>
</div>
</div>
<div class="service-item padd-15">
<div class="service-item-inner">
<div class="icon">
<i class="fa fa-search"></i>
</div>
<h4>Web Designe</h4>
<p>Development is the increase of total output of goods and services.</p>
</div>
</div>
<div class="service-item padd-15">
<div class="service-item-inner">
<div class="icon">
<i class="fa fa-bullhorn"></i>
</div>
<h4>Web Designe</h4>
<p>Development is the increase of total output of goods and services.</p>
</div>
</div>
</div>
</div>
</section>
<section class="portfolio section" id="portfolio">
<div class="container">
<div class="row">
<div class="section-title padd-15">
<h2>Portfolio</h2>
</div>
</div>
<div class="row">
<div class="portfolio-heading padd-15">
<h2>My last projects :</h2>
</div>
</div>
<div class="row">
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/sch.png" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/ks.jpg" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/fct.png" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/games.jpg" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/webg.png" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/ex.png" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/pro-1.jpeg" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/amazon-.png" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/App-development-process-Feature-image.jpg" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/dsc2.png" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/download.jpeg" alt="">
</div>
</div>
</div>
<div class="portfolio-item padd-15">
<div class="portfolio-item-inner shadow-dark">
<div class="portfolio-img">
<img src="./images/integrate-games-to-your-existing-app.webp" alt="">
</div>
</div>
</div>
</div>
</div>
</section>
<section class="contact section" id="contact">
<div class="container">
<div class="row">
<div class="section-title padd-15">
<h2>Contact Me</h2>
</div>
</div>
<h3 class="contact-title padd-15">Have Any Questions ?</h3>
<h4 class="contact-sub-title padd-15" >I'M AT YOUR SERVICES</h4>
<div class="row">
<div class="contact-info-item padd-15">
<div class="icon"><i class="fa fa-phone"></i></div>
<h4>Call Us On</h4>
<p>+233-999-999-999</p>
</div>
<div class="contact-info-item padd-15">
<div class="icon"><i class="fa fa-map-marker-alt"></i></div>
<h4>Office</h4>
<p>Accra-Ghana</p>
</div>
<div class="contact-info-item padd-15">
<div class="icon"><i class="fa fa-envelope"></i></div>
<h4>E-mail</h4>
<p>abcdef@gmail.com</p>
</div>
<div class="contact-info-item padd-15">
<div class="icon"><i class="fa fa-globe-europe"></i></div>
<h4>website</h4>
<p>www.godcodev.com</p>
</div>
</div>
<h3 class="contact-title padd-15">SEND ME AN E-MAIL</h3>
<h4 class="contact-sub-title padd-15">I'M VERY RESPONSIVE TO MESSAGES</h4>
<div class="row">
<div class="contact-form padd-15">
<div class="row">
<div class="form-item col-6 padd-15">
<div class="form-group">
<input type="text" class="form-control" placeholder="Name">
</div>
</div>
<div class="form-item col-6 padd-15">
<div class="form-group">
<input type="email" class="form-control" placeholder="E-mail">
</div>
</div>
</div>
<div class="row">
<div class="form-item col-12 padd-15">
<div class="form-group">
<input type="text" class="form-control" placeholder="Subject">
</div>
</div>
</div>
<div class="row">
<div class="form-item col-12 padd-15">
<div class="form-group">
<textarea name="" class="form-control" id="" placeholder="Message"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="form-item col-12 padd-15">
<button type="submit" class="btn">Send Message</button>
</div>
</div>
</div>
</div>
</div>
<!---
<footer>
<div class="footer-links">
<a href="#about">About</a> |
<a href="#projects">Projects</a> |
<a href="#contact">Contact</a> |
<a href="https://www.linkedin.com/in/yourprofile" target="_blank">LinkedIn</a>
</div>
<div class="contact-info">
<p>Email: <a href="mailto:yourname@example.com">yourname@example.com</a></p>
<p>Phone: (123) 456-7890</p>
</div>
<div class="social-media">
<a href="https://twitter.com/yourprofile" target="_blank">
<img src="twitter-icon.png" alt="Twitter">
</a>
<a href="https://github.com/yourprofile" target="_blank">
<img src="github-icon.png" alt="GitHub">
</a>
<a href="https://instagram.com/yourprofile" target="_blank">
<img src="instagram-icon.png" alt="Instagram">
</a>
</div>
<div class="footer-text">
<p>© 2024 Your Name. All rights reserved.</p>
</div>
</footer>
-->
</section>
</div>
</div>
<div class="style-switcher">
<div class="style-switcher-toggler s-icon">
<i class="fas fa-cog fa-spin"></i>
</div>
<div class="day-night s-icon">
<i class="fas "></i>
</div>
<h4>Theam colors</h4>
<div class="colors">
<span class="color-1" onclick="setActivestyle('color-1')"></span>
<span class="color-2" onclick="setActivestyle('color-2')"></span>
<span class="color-3" onclick="setActivestyle('color-3')"></span>
<span class="color-4" onclick="setActivestyle('color-4')"></span>
<span class="color-5" onclick="setActivestyle('color-5')"></span>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.12/typed.min.js" referrerpolicy="no-referrer"></script>
<script src="./js/react.js"></script>
<script src="./js/react-color-switcher.js"></script>
</body>
</html>