-
Notifications
You must be signed in to change notification settings - Fork 26
/
index.html
161 lines (156 loc) · 7.06 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
<title>Software Engineer</title>
<link href="css/index.css" rel="stylesheet">
<link href="lib/fontello/css/fontello.css" rel="stylesheet">
</head>
<body>
<header class="header-container">
</header>
<main>
<div class="container">
<div class="lead">
<h1 class="lead__heading">Hi, I'm John Smith</h1>
<div class="lead__sub">
I'm a college junior currently taking up Computer Science in University X. I'm a freelance developer with 4 years of experience, having worked with clients such as X, Y, Z. I enjoy building everything from small business sites to rich interactive web
apps.
</div>
<div class="call-to-action">
<a href="resume.pdf" target="_blank" class="btn btn--primary btn--lg">Get my resume</a>
<div class="socials">
<a class="socials__link" href="//" target="_blank">
<i class="icon-twitter"></i>
</a>
<a class="socials__link" href="//" target="_blank">
<i class="icon-github-circled"></i>
</a>
<a class="socials__link" href="mailto:[email protected]" target="_blank">
<i class="icon-mail-alt"></i>
</a>
<a class="socials__link" href="//" target="_blank">
<i class="icon-dribbble"></i>
</a>
<a class="socials__link" href="//" target="_blank">
<i class="icon-skype"></i>
</a>
<a class="socials__link" href="//" target="_blank">
<i class="icon-linkedin-squared"></i>
</a>
</div>
</div>
</div>
</div>
<div class="container experience-container">
<h1>Experience</h1>
<div class="timeline">
<div class="timeline__line"></div>
<div class="timeline__item">
<div class="experience">
<header class="experience__header">Jan 2016 - Present</header>
<h2 class="experience__name">
Senior Software Engineer at Company A
</h2>
<div class="skill-tags">
</div>
<p>Implemented Gamification for system</p>
<ul>
</ul>
</div>
</div>
<div class="timeline__item">
<div class="experience">
<header class="experience__header">Feb 2015 - Dec 2015</header>
<h2 class="experience__name">
Fullstack Software Engineer at Company B
</h2>
<div class="skill-tags">
</div>
<p></p>
<ul>
<li>Worked with a global team of developers and artists for the implementation of new features in Existing Codebase of a Free-to-play MMO</li>
<li>Increased rate of tickets/tasks done by the team up to 300% within first few weeks!</li>
<li>Added Abstractions on Server API to Minimize Duplicate Code</li>
</ul>
</div>
</div>
</div>
</div>
<div class="container project-container">
<h1>My Projects</h1>
<div class="project">
<div class="project__img-container">
<img class="project__img" src="img/combustion.png" alt="Combustion Screenshot">
</div>
<div class="project__details">
<h2 class="project__name">
Combustion
</h2>
<div class="skill-tags">
<div class="skill-tag">React</div>
<div class="skill-tag">Javascript</div>
<div class="skill-tag">Webpack</div>
<div class="skill-tag">Mobx</div>
<div class="skill-tag">CSSModules</div>
</div>
<p>
Combustion is a sleek, modern web client for the transmission bittorrent client.
<div>
<a class="btn" href="//" target="_blank">View Project</a>
</div>
</p>
</div>
</div>
<div class="project">
<div class="project__img-container">
<img class="project__img" src="img/merc-01.png" alt="Merc-01 Screenshot">
</div>
<div class="project__details">
<h2 class="project__name">
Merc-01
</h2>
<div class="skill-tags">
<div class="skill-tag">Python</div>
<div class="skill-tag">WebGL</div>
<div class="skill-tag">Pyglet</div>
</div>
<p>
Merc-01 is a fast paced twin-stick shooter built on top of pyglet.
<div>
<a class="btn" href="//" target="_blank">View Project</a>
</div>
</p>
</div>
</div>
</div>
<div class="container">
<h2>Testimonials</h2>
<blockquote class="testimonial">
<p>“Incredibly talented and hardworking. A super friendly guy who is a frequent communicator”</p>
<cite title="Person Name">
Person Name
(CEO at Company)
</cite>
</blockquote>
<blockquote class="testimonial">
<p>“Wow, thank you for this, you probably have the most intuitive explanation for this problem!”</p>
<cite title="Person Name">
Person Name
</cite>
</blockquote>
<div class='contact'>
<h2>Contact</h2>
<p class='contact__msg'>I'm currently available for freelance projects or full-time work. If you're interested in working with me, please get in touch through <a href='mailto:[email protected]'>[email protected]</a>.
</div>
</div>
</main>
<footer class='footer'>
<h1 class='footer__name'>John Smith</h1>
<h2 class='footer__title'>Software Engineer</h2>
Copyright © John Smith
</footer>
<script src="js/index.js"></script>
</body>
</html>