-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
234 lines (233 loc) · 17.3 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-115540782-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'UA-115540782-1');
</script>
<meta charset="UTF-8">
<meta name="google-site-verification" content="h5vHbl4XSe5IpKar8huFPmXIRd5KnsrciYQ48oJkvMY" />
<title>Jimmy Thigpen | Software Developer</title>
<meta name="description" content="Software Developer">
<meta name="keywords" content="jimmy,thigpen,software,architect,developer,web,development,design,boulder,colorado">
<meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width,viewport-fit=cover">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="styles/main.css">
<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16" />
</head>
<body class="container" ontouchstart="">
<header>
<div class="inner-container">
<div class="header-left">
<a href="#first" class="logo">JT.</a>
</div>
<div class="header-right">
<ul class="menu">
<li><a href="#second">about</a></li>
<li><a href="#third">projects</a></li>
<li><a href="#fourth">connect</a></li>
</ul>
</div>
</div>
</header>
<div class="section first" name="first">
<div class="inner-container">
<div class="row-half left">
<img src="images/me.jpeg" class="me" alt="photo of me">
</div>
<div class="row-half right">
<section class="message">
<h1>I Love</h1>
<h1>Creativity </h1><h1>and </h1><h1>Adventure</h1>
<a href="#second">Explore</a>
</section>
</div>
</div>
</div>
<div class="section second" name="second">
<div class="inner-container">
<div class="row-full">
<h1 class="section-title">About</h1>
<p>
I’m a passionate software developer and outdoorsman from Charleston, SC. With over <span id="exp"></span> years in the field, my experience stems from a life-long interest in technology, a degree in Computer Information Systems, and The Iron Yard’s intensive Front End Engineer course. My mission is to grow my skills and contribute to awesome projects. I currently live in Boulder, Colorado and spend my time creating products people love with <a target="_blank" class="about-link" href="https://thoughtbot.com/">thoughtbot</a>.
</p>
</div>
<div class="row-full">
<div class="row-3">
<h2>My Toolbox</h2>
</div>
<div class="row-9">
<ul class="toolbox-list">
<li><img src="images/tech2/react.png" title="React" alt="React" /></li>
<li><img src="images/tech2/nextjs.png" title="NextJS" alt="Next"/></li>
<li><img src="images/tech2/redux.png" title="Redux" alt="Redux"/></li>
<li><img src="images/tech2/node.png" title="NodeJS" alt="NodeJS" /></li>
<li><img src="images/tech2/apollo.png" title="Apollo Graphql" alt="Apollo Graphql"/></li>
<li><img src="images/tech2/aws.png" title="Amazon Web Services" alt="Amazon Web Services"/></li>
</ul>
</div>
</div>
<div class="row-full">
<div class="row-3">
<h2>Web Languages</h2>
</div>
<div class="row-9">
<ul class="lang-list">
<li>html</li>
<li>css</li>
<li>javascript</li>
</ul>
</div>
</div>
<div class="row-full">
<div class="row-3">
<h2>Hobbies</h2>
</div>
<div class="row-9">
<ul class="hobbies-list">
<li class="icon-bicycle"></li>
<li class="icon-tree"></li>
<li class="icon-camera"></li>
<li class="icon-book-open"></li>
<li class="icon-skiing"></li>
<li class="icon-gamepad"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="section third" name="third">
<div class="inner-container">
<div class="row-full">
<h1 class="section-title">Projects</h1>
<p>Always ready for a challenge.</p>
<div id="cbp-fwslider" class="cbp-fwslider slides">
<ul>
<li>
<a class="disabled" href="#"><img src="images/hfb-map.png" alt="Houston Food Bank" /></a>
<h2>Houston Food Bank Maps</h2>
<p>Partner locator map for the city of Houston.<br />Built for Houston Food Bank.</br>NodeJS, Google APIs, Apollo GraphQL, and SQL</p>
<a target="_blank" href="https://map.houstonfoodbank.org/" class="live-link">View</a>
<a target="_blank" href="https://poetic.io/" class="live-link poetic">
Built with<svg viewBox="0 0 70 70" version="1.1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<g id="Poetic" fill="none">
<g id="poetic-symbol" transform="translate(15.000000, 12.000000)">
<path
d="M32.633121,16.6887994 C32.633121,16.136824 32.3388535,15.6267464 31.8649682,15.3511431 L20.9961783,9.03994251 C20.522293,8.76357043 19.9375796,8.76357043 19.4598726,9.03994251 L8.5910828,15.3511431 C8.11719745,15.6267464 7.82292994,16.136824 7.82292994,16.6887994 L7.82292994,39.2921151 L1.58980892,35.6719868 C0.603821656,35.1000234 0,34.0429674 0,32.8994251 L0,13.1009593 C0,11.9570326 0.603821656,10.900361 1.58980892,10.3283976 L18.6382166,0.428972525 C19.6242038,-0.142990842 20.8356688,-0.142990842 21.8216561,0.428972525 L38.866242,10.3283976 C39.8522293,10.900361 40.4598726,11.9570326 40.4598726,13.1009593 L40.4598726,32.8994251 C40.4598726,34.0429674 39.8522293,35.1000234 38.866242,35.6719868 L21.8216561,45.5710275 C20.8356688,46.1429908 19.6242038,46.1429908 18.6382166,45.5710275 L16.7235669,44.4597734 C15.7375796,43.88781 15.133758,42.8307541 15.133758,41.6872117 L15.133758,22.9996156 C15.133758,21.1684103 16.1044586,19.476352 17.6789809,18.560365 C19.2573248,17.644378 21.1987261,17.644378 22.7770701,18.5599806 C24.355414,19.476352 25.3261146,21.1684103 25.3261146,22.9996156 C25.3261146,24.8308209 24.355414,26.5232636 22.7770701,27.4388662 L18.3745223,29.9950197 C17.3923567,30.5669831 16.7847134,31.6236547 16.7847134,32.7675814 L16.7847134,39.4062772 L31.8649682,30.6488569 C32.3388535,30.3728692 32.633121,29.863176 32.633121,29.3112006 L32.633121,16.6887994 Z"
id="poetic" fill="#fff" sketch:type="MSShapeGroup">
</path>
</g>
</g>
</svg>
</a>
</li>
<li>
<a class="disabled" href="#"><img src="images/thrive.png" alt="Thrive CRM"/></a>
<h2>Thrive CRM</h2>
<p>Thrive CRM for Gmail and Inbox.</br>Add contacts with a single click.</br>Convert emails into trackable opportunities.</p>
<a target="_blank" href="https://poetic.io/" class="live-link poetic">
Built with<svg viewBox="0 0 70 70" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<g id="Poetic" fill="none">
<g id="poetic-symbol" transform="translate(15.000000, 12.000000)">
<path d="M32.633121,16.6887994 C32.633121,16.136824 32.3388535,15.6267464 31.8649682,15.3511431 L20.9961783,9.03994251 C20.522293,8.76357043 19.9375796,8.76357043 19.4598726,9.03994251 L8.5910828,15.3511431 C8.11719745,15.6267464 7.82292994,16.136824 7.82292994,16.6887994 L7.82292994,39.2921151 L1.58980892,35.6719868 C0.603821656,35.1000234 0,34.0429674 0,32.8994251 L0,13.1009593 C0,11.9570326 0.603821656,10.900361 1.58980892,10.3283976 L18.6382166,0.428972525 C19.6242038,-0.142990842 20.8356688,-0.142990842 21.8216561,0.428972525 L38.866242,10.3283976 C39.8522293,10.900361 40.4598726,11.9570326 40.4598726,13.1009593 L40.4598726,32.8994251 C40.4598726,34.0429674 39.8522293,35.1000234 38.866242,35.6719868 L21.8216561,45.5710275 C20.8356688,46.1429908 19.6242038,46.1429908 18.6382166,45.5710275 L16.7235669,44.4597734 C15.7375796,43.88781 15.133758,42.8307541 15.133758,41.6872117 L15.133758,22.9996156 C15.133758,21.1684103 16.1044586,19.476352 17.6789809,18.560365 C19.2573248,17.644378 21.1987261,17.644378 22.7770701,18.5599806 C24.355414,19.476352 25.3261146,21.1684103 25.3261146,22.9996156 C25.3261146,24.8308209 24.355414,26.5232636 22.7770701,27.4388662 L18.3745223,29.9950197 C17.3923567,30.5669831 16.7847134,31.6236547 16.7847134,32.7675814 L16.7847134,39.4062772 L31.8649682,30.6488569 C32.3388535,30.3728692 32.633121,29.863176 32.633121,29.3112006 L32.633121,16.6887994 Z" id="poetic" fill="#fff" sketch:type="MSShapeGroup">
</path>
</g>
</g>
</svg>
</a>
</li>
<li>
<a class="disabled" href="#"><img src="images/gastronaut.png" alt="Gastronaut"/></a>
<h2>Gastronaut</h2>
<p>Find restaurants and food news.</br>Available in:</br>Houston, TX, Seattle, WA, and Portland, OR.</p>
<a target="_blank" href="https://poetic.io/" class="live-link poetic">
Built with<svg viewBox="0 0 70 70" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<g id="Poetic" fill="none">
<g id="poetic-symbol" transform="translate(15.000000, 12.000000)">
<path d="M32.633121,16.6887994 C32.633121,16.136824 32.3388535,15.6267464 31.8649682,15.3511431 L20.9961783,9.03994251 C20.522293,8.76357043 19.9375796,8.76357043 19.4598726,9.03994251 L8.5910828,15.3511431 C8.11719745,15.6267464 7.82292994,16.136824 7.82292994,16.6887994 L7.82292994,39.2921151 L1.58980892,35.6719868 C0.603821656,35.1000234 0,34.0429674 0,32.8994251 L0,13.1009593 C0,11.9570326 0.603821656,10.900361 1.58980892,10.3283976 L18.6382166,0.428972525 C19.6242038,-0.142990842 20.8356688,-0.142990842 21.8216561,0.428972525 L38.866242,10.3283976 C39.8522293,10.900361 40.4598726,11.9570326 40.4598726,13.1009593 L40.4598726,32.8994251 C40.4598726,34.0429674 39.8522293,35.1000234 38.866242,35.6719868 L21.8216561,45.5710275 C20.8356688,46.1429908 19.6242038,46.1429908 18.6382166,45.5710275 L16.7235669,44.4597734 C15.7375796,43.88781 15.133758,42.8307541 15.133758,41.6872117 L15.133758,22.9996156 C15.133758,21.1684103 16.1044586,19.476352 17.6789809,18.560365 C19.2573248,17.644378 21.1987261,17.644378 22.7770701,18.5599806 C24.355414,19.476352 25.3261146,21.1684103 25.3261146,22.9996156 C25.3261146,24.8308209 24.355414,26.5232636 22.7770701,27.4388662 L18.3745223,29.9950197 C17.3923567,30.5669831 16.7847134,31.6236547 16.7847134,32.7675814 L16.7847134,39.4062772 L31.8649682,30.6488569 C32.3388535,30.3728692 32.633121,29.863176 32.633121,29.3112006 L32.633121,16.6887994 Z" id="poetic" fill="#fff" sketch:type="MSShapeGroup">
</path>
</g>
</g>
</svg>
</a>
</li>
<li>
<a class="disabled" href="#"><img src="images/youtrade.png" alt="Youtrade"/></a>
<h2>YouTrade</h2>
<p>An all-in-one stock market trading</br>app for the everyday investor.</p>
<a target="_blank" href="https://poetic.io/" class="live-link poetic">
Built with<svg viewBox="0 0 70 70" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<g id="Poetic" fill="none">
<g id="poetic-symbol" transform="translate(15.000000, 12.000000)">
<path d="M32.633121,16.6887994 C32.633121,16.136824 32.3388535,15.6267464 31.8649682,15.3511431 L20.9961783,9.03994251 C20.522293,8.76357043 19.9375796,8.76357043 19.4598726,9.03994251 L8.5910828,15.3511431 C8.11719745,15.6267464 7.82292994,16.136824 7.82292994,16.6887994 L7.82292994,39.2921151 L1.58980892,35.6719868 C0.603821656,35.1000234 0,34.0429674 0,32.8994251 L0,13.1009593 C0,11.9570326 0.603821656,10.900361 1.58980892,10.3283976 L18.6382166,0.428972525 C19.6242038,-0.142990842 20.8356688,-0.142990842 21.8216561,0.428972525 L38.866242,10.3283976 C39.8522293,10.900361 40.4598726,11.9570326 40.4598726,13.1009593 L40.4598726,32.8994251 C40.4598726,34.0429674 39.8522293,35.1000234 38.866242,35.6719868 L21.8216561,45.5710275 C20.8356688,46.1429908 19.6242038,46.1429908 18.6382166,45.5710275 L16.7235669,44.4597734 C15.7375796,43.88781 15.133758,42.8307541 15.133758,41.6872117 L15.133758,22.9996156 C15.133758,21.1684103 16.1044586,19.476352 17.6789809,18.560365 C19.2573248,17.644378 21.1987261,17.644378 22.7770701,18.5599806 C24.355414,19.476352 25.3261146,21.1684103 25.3261146,22.9996156 C25.3261146,24.8308209 24.355414,26.5232636 22.7770701,27.4388662 L18.3745223,29.9950197 C17.3923567,30.5669831 16.7847134,31.6236547 16.7847134,32.7675814 L16.7847134,39.4062772 L31.8649682,30.6488569 C32.3388535,30.3728692 32.633121,29.863176 32.633121,29.3112006 L32.633121,16.6887994 Z" id="poetic" fill="#fff" sketch:type="MSShapeGroup">
</path>
</g>
</g>
</svg>
</a>
</li>
<li>
<a class="disabled" href="#"><img src="images/trail.png" alt="Trail"/></a>
<h2>Trail</h2>
<p>Connecting runners and cyclist so they</br>can enjoy the outdoors together.</br>-The Iron Yard Final Project</p>
</li>
<li>
<a class="disabled" href="#"><img src="images/cafe.png" alt="Swamp Rabbit Cafe"/></a>
<h2>Swamp Rabbit Cafe</h2>
<p>An ordering and recipe creation application</br>for a local cafe in Greenville, SC.</br>-The Iron Yard Team Project</p>
</li>
<li>
<a class="disabled" href="#"><img src="images/surf.png" alt="Surf & Paddle"/></a>
<h2>Surf & Paddle</h2>
<p>Pixel perfect rendition of a PSD file</br>using HTML5, CSS3. and SASS.<br />-The Iron Yard Weekend Project</p>
<a target="_blank" href="http://jimmythigpen.github.io/Surf-and-Paddles-SASS/" class="live-link">View</a>
</li>
<li>
<a class="disabled" href="#"><i class="icon-github-circled"></i></a>
<h2>Want to see more?</h2>
<p>Check out my GitHub profile.</p>
<a target="_blank" href="https://github.com/jimmythigpen" class="live-link">View</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="section fourth" name="fourth">
<div class="inner-container">
<div class="row-full top">
<h1 class="section-title">Connect</h1>
</div>
<div class="row-half left">
<p>I am avaliable for freelancing and would love to hear from you.</p>
<p>Feel free to contact me.</p>
</div>
<div class="row-half right">
<p><a href="mailto:[email protected]">[email protected]</a></p>
<p><a target="_blank" href="https://drive.google.com/file/d/1-wlmYrPt06xONSJJV1NbB1h36RfF98dv/view?usp=sharing">Resume</a></p>
<a target="_blank" class="icon icon-twitter" href="https://twitter.com/jimmythigpen"></a>
<a target="_blank" class="icon icon-facebook" href="https://www.facebook.com/jimmythigpen"></a>
<a target="_blank" class="icon icon-instagram" href="https://instagram.com/jimmythigpen/"></a>
<a target="_blank" class="icon icon-linkedin" href="https://www.linkedin.com/in/thigpenjimmy"></a>
</div>
</div>
</div>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="scripts/numtranslate.js"></script>
<script src="scripts/easing.js"></script>
<script src="scripts/modernizr.js"></script>
<script src="scripts/slider.js"></script>
<script src="scripts/headroom.js"></script>
<script src="scripts/main.js"></script>
<script>
const exp = new Date(new Date() - new Date("2015-05-01T00:00:00")).getFullYear() - 1970;
document.getElementById('exp').innerHTML = numWords(exp);
</script>
</body>
</html>