-
Notifications
You must be signed in to change notification settings - Fork 73
/
Copy pathindex.html
79 lines (74 loc) · 3.91 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>[NAME]</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="icon" href="image/logo.ico">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Sacramento&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Merriweather+Sans:wght@300&family=Merriweather:wght@300&display=swap"
rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap" rel="stylesheet">
</head>
<body>
<div class="top-container">
<img class="top-cloud" src="image/cloud.png" width="15%" alt="cloud-pic">
<h1>I'm [FIRST NAME]</h1>
<p style="font-size: 20px;">a <span style="text-decoration: overline;"></span>[CAREER]</p>
<img src="image/mountain.png" alt="mountain-pic"> <br>
<img class="bottom-cloud" src="image/cloud.png" width="15%" alt="cloud-pic">
</div>
<div class="middle-container">
<div class="profile">
<img src="image/profile-pic.png" width="250" height="250" alt="My profile picture">
<h2>Hello there!</h2>
<p class="intro">I'm [AGE] years old. I'm studying [PROGRAM] at <a class="uni"
href="https://www.bugemauniv.ac.ug">University
</a>. My dream work is to become a [CAREER-1] and
[CAREER-2]. I love [HOBBY-1], [HOBBY-2], [HOBBY-3] and [HOBBY-4].</p>
<p class="intro">Nice to meet you!</p>
</div>
<hr>
<div class="skills">
<h2>Skills</h2>
<div class="skill-row">
<img class="code-image" src="image/web-programming.png" alt="dev-pic">
<h3>[SKILL-1] E.G ==> [Design & Development]</h3>
<p>[SKILL DESCRIPTION] E.G ==> I started learning to code when I was 15 years old because I want to make my own games and my own
website. Overtime, I have gained a wealth of experience designing and developing web applications
and some small games.
</p>
</div>
<div class="skill-row">
<img class="success-image" src="image/success.png" alt="success-pic">
<h3>[SKILL-2] E.G ==> Winning Prize</h3>
<p>[SKILL DESCRIPTION] E.G ==> I got a bronze medal at the final round of IOE (English) when I was grade 5. I have took part two
times IT competition
at city level and won two "1st prize", two "2nd prize". Once
my project was choosen to be attended at country final round. </p>
</div>
</div>
<hr>
<div class="contact-message">
<h2>Get In Touch <img class="laugh-image" src="image/laugh.png" width="60" height="60" alt="laugh-pic"></h2>
<h3>My biggest love is to be your friend</h3>
<p>Deep friendships like these offer solace during hard times and laugh till your face hurts happiness other
times.</p>
<a class="btn" href="mailto:[YOUR EMAIL]">CONTACT ME</a>
</div>
</div>
<div class="bottom-container">
<a class="footer-link" href="[YOUR LINKEDIN URL]">LinkedIn</a>
<a class="footer-link" href="[YOUR GITHUB PROFILE URL]">GitHub</a>
<a class="footer-link" href="[YOUR FACEBOOK PROFILE URL]">Facebook</a>
<p>©2021 Created by [YOUR NAME]</p>
</div>
</body>
</html>