-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
201 lines (187 loc) · 9.53 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
<!DOCTYPE HTML>
<html>
<head>
<title>Stevens Software Services</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" />
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<!-- Header -->
<section id="header">
<!-- <div class = "cornerContent cornerInner" style="z-index: 10;">
<span class="image fit radius cornerImage"><img id="headshot" src="images/headshot.png" alt="Thomas Stevens"></span>
<ul class="icons">
<li><a href="https://twitter.com/ThomasAlanStev" class="icon brands alt fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="https://www.linkedin.com/in/thomas-alan-stevens/" class="icon brands alt fa-linkedin"><span class="label">Linkedin</span></a></li>
<li><a href="https://github.com/ThomasAlanStevens" class="icon brands alt fa-github"><span class="label">GitHub</span></a></li>
<li><a href="mailto:thomaalanstevens@gmail.com?subject=Hello%20from%20Thomas%27s%20site" class="icon solid alt fa-envelope"><span class="label">Email</span></a></li>
</ul>
</div> -->
<div class="inner">
<span class="icon solid major fa-code"></span>
<h1>Hello there, I'm <strong>Thomas Stevens</strong>,<br/>
a full-stack software engineer.</h1>
<p>Feel free to take a look at some of my recent projects!</p>
<ul class="actions special">
<li><a href="#myServices" class="button scrolly">I need a site</a></li>
<li><a href="dev.html" class="button scrolly">I need a dev</a></li>
</ul>
</div>
</section>
<!-- Hero -->
<section id="hero" class="main style1">
<div class="container">
<div class="row gtr-150">
<div class="col-6 col-12-medium">
<header class="major">
<h2>Need to develop a better <br> web presence?</h2>
</header>
<p>Will your current website entice customers to come check out your products and services? Will the user experience make them want to stay regardless of what device they are using? </p>
<p> I offer small businesses, startups, and individuals around me a chance to be seen on the web, the largest marketplace ever. This includes creating a website from the ground up according to your specifications and needs, and updating an existing online presence.</p>
</div>
<div class="col-6 col-12-medium imp-medium">
<span class="image fit"><img src="images/pic01.jpg" alt="" /></span>
</div>
</div>
</div>
</section>
<!-- My Work -->
<section id="myWork" class="main style2 special">
<div class="container">
<header class="major">
<h2>My work</h2>
</header>
<p>Here are a few of my most recent projects, feel free to check them out!</p>
<div class="row gtr-150">
<div class="col-4 col-12-medium">
<span class="image fit"><a href="https://stevens-side-projects.netlify.app/" target="_blank"><img src="/images/stevens-side-projects.PNG" alt="stevens side projects preview"></a></span>
<br>
<h3>Stevens Side Apps</h3>
<p>A collection of some of my recent smaller projects. Feel free to explore my work!</p>
<ul class="actions special">
<li><a href="https://stevens-side-projects.netlify.app/" target="_blank" class="button">View</a></li>
</ul>
</div>
<div class="col-4 col-12-medium">
<span class="image fit"><a href="https://seasons-salon.netlify.app/" target="_blank"><img src="images/seasonsSalon.PNG" alt="Seasons Salon Preview"></a></span>
<br>
<h3>Seasons Salon</h3>
<p>An elegant, colorful, and fully responsive website for new trendy salon.</p>
<ul class="actions special">
<li><a href="https://seasons-salon.netlify.app/" target="_blank" class="button">View</a></li>
</ul>
</div>
<div class="col-4 col-12-medium">
<span class="image fit"><a href="https://shana340.netlify.app/" target="_blank"><img src="images/shana340.PNG" alt="Shana Freelance Artist Preview"></a></span>
<br>
<h3>Shana Freelance Artist</h3>
<p>An contemporary site to create an online showcase of Eugenie Laurent's art.</p>
<ul class="actions special">
<li><a href="https://shana340.netlify.app/" target="_blank" class="button">View</a></li>
</ul>
</div>
</div>
</div>
</section>
<!-- My Services-->
<section id="myServices" class="main style1">
<div class="container">
<div class="row gtr-150">
<div class="col-6 col-12-medium">
<ul class="major-icons">
<li><span class="icon solid style1 major fa-user"></span></li>
<li><span class="icon solid style2 major fa-envelope"></span></li>
<li><span class="icon solid style3 major fa-code"></span></li>
<li><span class="icon solid style4 major fa-cog"></span></li>
<li><span class="icon solid style6 major fa-rocket"></span></li>
</ul>
</div>
<div class="col-6 col-12-medium">
<header class="major">
<h2>Services Offered</h2>
</header>
<p> I dedicate myself to making sure I am able meet and even exceed my clients initial goals and expectations. Want to know more about my process before we work together? Here is my five step framework that I use to ensure success:</p>
<ol>
<li><strong>Consultation - </strong> Every project first begins with a conversation. Here we can figure out what this project is all about!</li>
<li><strong>Proposal - </strong> A clear plan of action will be decided on based off of a provided project proposal and visual preview.</li>
<li><strong>Creation & Communication - </strong> The actual creation of the site including all the features detailed in the proposal will now take place! During this process the client will receive regular updates regarding the status of their project.</li>
<li><strong>Testing - </strong> A simulated heavy stress is placed on the site in order to measure performance, and ensure the site is responsive and performs well across all platforms and devices</li>
<li><strong>Launch & Support - </strong> The site is launched and the client has the option to obtain ongoing support if necessary! </li>
</ol>
</div>
</div>
</div>
</section>
<!-- About -->
<section id="about" class="main style2">
<div class="container">
<div class="row gtr-150">
<div class="col-6 col-12-medium">
<header class="major">
<h2>I'm a Software Engineer<br>
based in Los Angeles, CA</h2>
</header>
<p>Learning, teaching, solving problems, and giving the solutions back to the tech community is my passion.</p>
<p>When I'm not coding, you can find me spending time with my chinchilla, reading fantasy stories, and playing video games.</p>
</div>
<div class="col-6 col-12-medium imp-medium">
<span class="image fit "><img id="headshot" src="images/headshot.png" alt="Thomas Stevens"></span>
</div>
</div>
</div>
</section>
<!-- Contact -->
<section id="contact" class="main style1 special container">
<div class="container">
<header class="major">
<h2>Let's connect!</h2>
</header>
<p>I am currently accepting new freelance clients and interesting project opportunities!</p>
<p>Email me at: <strong><a class = "email"href="mailto:thomaalanstevens@gmail.com">thomaalanstevens@gmail.com</a></strong><br>
Or send me a quick message here:</p>
</div>
<section>
<form method="POST" name="contact"><input type="hidden" name="form-name" value="contact">
<div class="row gtr-uniform gtr-50">
<div class="col-6 col-12-xsmall">
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Name">
</div>
<div class="col-6 col-12-xsmall">
<input type="email" name="demo-email" id="demo-email" value="" placeholder="Email">
</div>
<div class="col-12">
<textarea name="demo-message" id="demo-message" placeholder="Form submissions are disabled for the time being. If you need me, please reach out via email, twitter, or linkedin." rows="6" spellcheck="false"></textarea>
</div>
<div class="col-12">
<ul class="actions">
<li><input disabled="" type="submit" value="Send Message" class="primary"></li>
<li><input disabled="" type="reset" value="Reset"></li>
</ul>
</div>
</div>
</form>
</section>
</section>
<!-- Footer -->
<section id="footer">
<ul class="icons">
<li><a href="https://twitter.com/ThomasAlanStev" class="icon brands alt fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="https://www.linkedin.com/in/thomas-alan-stevens/" class="icon brands alt fa-linkedin"><span class="label">Linkedin</span></a></li>
<li><a href="https://github.com/ThomasAlanStevens" class="icon brands alt fa-github"><span class="label">GitHub</span></a></li>
<li><a href="mailto:thomaalanstevens@gmail.com?subject=Hello%20from%20Thomas%27s%20site" class="icon solid alt fa-envelope"><span class="label">Email</span></a></li>
</ul>
<ul class="copyright">
<li>©Stevens Software Services</li>
</ul>
</section>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>