-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
205 lines (193 loc) · 9.26 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
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Ashleigh Halverstadt</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes"/>
<meta name="description" content="Ashleigh Halverstadt, a Denver-based software engineer specializing in full-stack web development.">
<link rel="stylesheet" href="assets/css/main.css" />
<script defer src="https://kit.fontawesome.com/c70c69bd1d.js" crossorigin="anonymous"></script>
</head>
<body class="is-preload">
<!-- Nav -->
<nav id="nav">
<ul class="container">
<li><a href="#top">Home</a></li>
<li><a href="#work">Services</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
<!-- Home -->
<article id="top" class="wrapper style1">
<div class="container">
<h1>Every business is a tech business</h2>
<p>It's hard for an organization to thrive without an online presence. Every business needs a website. And every website needs to function as beautifully on mobile as it does on desktop - because that's where most online traffic lives.</p>
<p>Need to build or refresh your site? I can help.</p>
<a href="#work" class="button large scrolly">Learn more</a>
</div>
</article>
<!-- Services -->
<article id="work" class="wrapper style2">
<div class="container">
<header>
<h2>Getting started is easier than you think</h2>
<p>Web development doesn't have to be an overwhelming or expensive process. I specialize in getting individuals, small businesses, and nonprofits up and running with simple, compelling websites designed to help them reach their goals. If you'd like to explore a partnership, the process is straightforward:</p>
</header>
<div class="row aln-center">
<div class="col-3 col-6-medium col-12-small">
<section class="box style1">
<span class="icon featured fa-solid fa-comments"></span>
<h3>Consultation</h3>
<p>Let's talk! Tell me about yourself, your goals, and your vision for your site, and I'll tell you how I can help. Consultations are always free.</p>
</section>
</div>
<div class="col-3 col-6-medium col-12-small">
<section class="box style1">
<span class="icon featured fa-solid fa-handshake-simple"></span>
<h3>Proposal</h3>
<p>I'll develop a project proposal (also free) detailing how we can reach your goals within your budget. If you like what you see, we'll sign a contract.</p>
</section>
</div>
<div class="col-3 col-6-medium col-12-small">
<section class="box style1">
<span class="icon featured fa-solid fa-laptop-code"></span>
<h3>Development</h3>
<p>With frequent input from you, I'll design, build, and test your new site. You'll get weekly progress updates, so you'll always know where we stand.</p>
</section>
</div>
<div class="col-3 col-6-medium col-12-small">
<section class="box style1">
<span class="icon featured fa-solid fa-rocket"></span>
<h3>Launch</h3>
<p>We'll take your shiny new website live! If you want me by your side for ongoing support, I'm available, but a retainer is never required.</p>
</section>
</div>
</div>
<footer>
<a href="#portfolio" class="button large scrolly">See an example</a>
</footer>
</div>
</article>
<!-- Portfolio -->
<article id="portfolio" class="wrapper style3">
<div class="container">
<header>
<h2>Check out my work</h2>
<p>Here are just a few of the projects I've been working on.</p>
</header>
<div class="row">
<div class="col-5 col-6-medium col-12-small">
<article class="box style2">
<a href="https://my-chronicle.onrender.com/" target="_blank" class="image featured"><img src="images/my-chronicle.jpg" alt="" loading="lazy"></a>
<h3><a href="https://my-chronicle.onrender.com/" target="_blank">MyChronicle</a></h3>
<p>A web application for people with chronic, undiagnosed illnesses</p>
</article>
</div>
<div class="col-5 col-6-medium col-12-small">
<article class="box style2">
<a href="https://edibleforestforays.netlify.app/" target="_blank" class="image featured"><img src="images/edible-forest.jpg" alt="" loading="lazy"></a>
<h3><a href="https://edibleforestforays.netlify.app/" target="_blank">Edible Forest Forays</a></h3>
<p>A mushroom foraging business</p>
</article>
</div>
<div class="col-5 col-6-medium col-12-small">
<article class="box style2">
<a href="https://wildscapes.netlify.app/" target="_blank" class="image featured"><img src="images/wildscapes.jpg" alt="" loading="lazy"></a>
<h3><a href="https://wildscapes.netlify.app/" target="_blank">Wildscapes</a></h3>
<p>A family-owned xeriscaping company</p>
</article>
</div>
<div class="col-5 col-6-medium col-12-small">
<article class="box style2">
<a href="https://reeseandrover.netlify.app/" target="_blank" class="image featured"><img src="images/reese-and-rover.jpg" alt="" loading="lazy"></a>
<h3><a href="https://reeseandrover.netlify.app/" target="_blank">Reese + Rover</a></h3>
<p>A local dog-walking service</p>
</article>
</div>
</div>
<footer>
<a href="#about" class="button large scrolly">Get to know me</a>
</footer>
</div>
</article>
<!-- About -->
<article id="about" class="wrapper style2">
<div class="container">
<div class="row">
<div class="col-8 col-7-large col-12-medium">
<h2>About me</h2>
<p>I'm a Denver-based software engineer, focused on full-stack web development.</p>
<p>An analytical thinker by nature, I'm always looking for a problem to solve or a system to improve - the gnarlier, the better. My work is driven by big-picture goals, while attentive to all the tiny details that put those goals within reach.</p>
<p>Equity and empathy are two of my most deeply held values, and it shows in my work.</p>
<p>When I'm not coding, you can find me hiking (I once walked from Mexico to Canada for fun!), mushroom foraging, dancing at electronic shows, traveling to places I've never been, and eating my way through Denver's best restaurants with my husband and close friends.</p>
</div>
<div class="col-4 col-5-large col-12-medium img-container">
<img class="image fit" src="images/ashleigh-halverstadt-headshot.jpg" alt="White woman with pixie-style brown hair smiling" loading="lazy">
</div>
</div>
<footer>
<a href="#contact" class="button large scrolly">Let's connect</a>
</footer>
</div>
</article>
<!-- Contact and footer -->
<article id="contact" class="wrapper style4">
<div class="container medium">
<header>
<h2>Ready to make your vision come to life?</h2>
<p>Send me a message, and let's see what we can build together.</p>
</header>
<div class="row">
<div class="col-12">
<form method="post" action="#" data-netlify="true">
<div class="row">
<div class="col-6 col-12-small">
<input type="text" name="name" id="name" placeholder="Name">
</div>
<div class="col-6 col-12-small">
<input type="text" name="email" id="email" placeholder="Email">
</div>
<div class="col-12">
<input type="text" name="subject" id="subject" placeholder="Subject">
</div>
<div class="col-12">
<textarea name="message" id="message" placeholder="Message"></textarea>
</div>
<div class="col-12">
<ul class="actions">
<li><input type="submit" value="Send Message"></li>
<li><input type="reset" value="Clear Form" class="alt"></li>
</ul>
</div>
</div>
</form>
</div>
<div class="col-12">
<hr />
<h3>Find me on ...</h3>
<ul class="social">
<li><a href="https://www.linkedin.com/in/ashleighhalverstadt/" target="_blank" class="icon brands fa-brands fa-linkedin"><span class="visually-hidden">LinkedIn</span></a></li>
<li><a href="https://twitter.com/heretoshleigh" target="_blank" class="icon brands fa-brands fa-twitter"><span class="visually-hidden">Twitter</span></a></li>
<li><a href="https://github.com/heretoshleigh" target="_blank" class="icon brands fa-brands fa-github"><span class="visually-hidden">Github</span></a></li>
</ul>
<hr />
</div>
</div>
<footer>
<ul id="copyright">
<li>© Ashleigh Halverstadt</li><li>Design: HTML5 UP</li>
</ul>
</footer>
</div>
</article>
<!-- 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>