-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
139 lines (108 loc) · 5.22 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Usayd Manning - Designer - Developer - photographer</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Cairo|Montserrat|Roboto|Roboto+Condensed|Sacramento&display=swap" rel="stylesheet">
</head>
<body>
<div id="top-container">
<div class="main-text">
<img class="logo-top" src="Logo.png" alt="">
<h1 id="my-name">Usayd Manning</h1>
<header>
<nav>
<a href="#middle-container">About</a>
<a href="#skills">Skills</a>
<a href="#contact-me">Contact</a>
<a href="#portfolio">Portfolio</a>
<a href="#skill-mid" class="wif">Why I Freelance</a>
</nav>
</header>
<p id="my-tag">A Designer, Developer, <br> with good photography skills</p>
<hr class="hr">
</div>
</div>
<div id="middle-container">
<div class="profile">
<img class="logo" src="Logo.png" alt="">
<h2 class="name">Usayd Manning</h2>
<p id="my-speech">Hello Every body my name is Usayd (Al-Asad) Manning. I'm a Visual designer, and Web Developer
from the United Kingdom. I have a pre-eminent record of neat and nice designs that can be seen across my
portfolio. My passion for the Industry has led me to begin learning not one but 3 more development languages
Javascript, bootstrap, react and Node jS. development is like a metaphor "Countless routes that lead the way"</p>
</div>
<hr class="hr">
<div id="skills">
<h2 class="name">My Skills.</h2>
<div class="skill-row">
<img class="skill-img-design" src="devices.png" alt="">
<h3>Visual Design</h3>
<p>I like to keep it simple. My focus is to make your design look marvelous but still relative to your industry clients.</p>
</div>
<div class="skill-row">
<img class="skill-img-webflow" src="text.png" alt="">
<h3>WebFlow</h3>
<p>With webflow i have designed webpages websites and apps i have become very skilled in webflow</p>
</div>
<div class="skill-row">
<img class="skill-img-coding" src="coding.png" alt="">
<h3>Web development</h3>
<p>Using Html CSS JS and (bootstrap) I creat beautifull and iteractive websites and webpages'</p>
</div>
<div class="skill-row">
<img class="skill-img-photo" src="camera.png" alt="">
<h3>Photography</h3>
<p>I have never taken courses on Photography but it was an ambition of mine when I was younger and I found I take really good Photos</p>
</div>
</div>
<div id="skill-mid">
<img class="skill-img-business" src="cloud.png" alt="">
<h3 id="skill-img-heading">Why I Freelance</h3>
<p id="skill-img-para">I was born in London but spent most of my time abroad which is why I have an decided that instead of being tied down to working in an office I was goin to start up my own business with the help of my father and brothers
Who are also Designers and Developers) that way I could have a reliable source of income whilst also traveling
to every corner of the world</p>
</div>
<div id="portfolio">
<h2 class="name portfolio">My Portfolio.</h2>
<ul id="port-list">
<li class="list-item"><a href="https://www.behance.net/umann2003e2a0"><img src="img-1.png"></a></li>
<li class="list-item"><a href="https://www.behance.net/umann2003e2a0"><img src="cinema.png"></a></li>
<li class="list-item"><a href="https://www.behance.net/umann2003e2a0"><img src="img-2.png"></a></li>
</ul>
<ul id="port-list">
<li class="list-item"><a href="https://www.behance.net/umann2003e2a0"><img src="adidas.png"></a></li>
<li class="list-item"><a href="https://www.behance.net/umann2003e2a0"><img src="countdown.png"></a></li>
<li class="list-item"><a href="https://www.behance.net/umann2003e2a0"><img src="levante.jpg"></a></li>
</ul>
</div>
<div class="clear">
</div>
<div id="contact-me">
<h3 class="talk">I'm ready to talk</h3>
<p class="talk-text">I am Currently available for freelance hire</p>
<a class="btn" href="mailto:[email protected]">CONTACT ME</a>
</div>
</div>
<div class="bottom-container">
<a class="footer-link" href="https://uk.linkedin.com/in/usayd-manning-33a618171">LinkedIn</a>
<a class="footer-link" href="https://www.behance.net/umann2003e2a0">Behance</a>
<a class="footer-link" href="https://www.facebook.com/usayd.manning.98">Facebook</a>
<p class="umann">© 2020 Usayd Manning.</p>
</div>
</body>
</html>
<script type="text/javascript">
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
document.querySelector(this.getAttribute('href')).scrollIntoView({
behavior: 'smooth'
});
});
});
</script>
<!--Atributions
<div>Icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a></div>-->