-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
149 lines (138 loc) · 6.48 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
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Natasha Blong</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" />
<script src="https://use.fontawesome.com/b45e9a3bb3.js"></script>
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
</head>
<body class="is-preload">
<!-- Wrapper-->
<div id="wrapper">
<!-- Nav -->
<nav id="nav">
<a href="#" class="icon solid fa-home"><span>About Me</span></a>
<a href="#projects" class="icon solid fa-microchip"><span>Projects</span></a>
<a href="#resume" class="icon solid fa-folder"><span>Resume</span></a>
<a href="#contact" class="icon solid fa-envelope"><span>Contact</span></a>
</nav>
<!-- Main -->
<div id="main">
<!-- Natasha Blong Bio -->
<article id="home" class="panel intro">
<header>
<h1>Natasha Blong</h1>
<p>Software Engineer</p>
</header>
<a href="#projects" class="jumplink pic">
<span class="arrow icon solid fa-chevron-right"><span>See my projects</span></span>
<img src="images/Natasha Blong.png" alt="Natasha Blong"/>
</a>
</article>
<!-- Projects -->
<article id="projects" class="panel">
<section class="posts">
<!-- Arduino Nano -->
<article>
<header>
<h2>Flex Fuel Translator</h2>
</header>
<a href="#" class="image fit"><img src="images/myCar.png" alt="Turbocharged 2015 Toyota 86, running E-85" /></a>
<p>I built a translator out of an Arduino Nano that converts the frequency output from a continental flex fuel sensor to an analog input voltage for an ECU.</p>
<ul class="actions special">
<li><a href="https://github.com/NatashaBlong/Universal-Flex-Fuel-Translator" target="_blank" rel="noopener noreferrer" class="button">View Code</a></li>
</ul>
</article>
<article>
<header>
<h2>Landscaping</h2>
</header>
<a href="#" class="image fit"><img src="images/Dana's Landscaping.png" alt="Landscaping Website" /></a>
<p>In a time when techology dominates nearly every facet of our lives, a professional and easy to navigate website is essential for even small businesses.</p>
<ul class="actions special">
<li><a href="https://github.com/NatashaBlong/Landscaping-Website/tree/main/Dana's%20Landscaping%20Website" target="_blank" rel="noopener noreferrer" class="button">View Code</a></li>
</ul>
</article>
<article>
<header>
<h2>Winederlust</h2>
</header>
<a href="#" class="image fit"><img src="images/Winederlust.png" alt="Winederlust Website" /></a>
<p>Wine website that recommends wine based on selected food, sweetness and flavor preferences.</p>
<ul class="actions special">
<li><a href="https://github.com/NatashaBlong/Winederlust/tree/main/Winederlust" target="_blank" rel="noopener noreferrer" class="button">View Code</a></li>
</ul>
</article>
<article>
<header>
<h2>Green Fee Form</h2>
</header>
<a href="#" class="image fit"><img src="images/Form Data.png" alt="Green Fee Form Data Page" /></a>
<p>A form to collect student's input on proposed 'Green' projects. The admins are able to view charts of the collected data to aid in the decision making process.</p>
<ul class="actions special">
<li><a href="https://github.com/NatashaBlong/Green-Fee-Form" target="_blank" rel="noopener noreferrer" class="button">View Code</a></li>
</ul>
</article>
</section>
</article>
<!-- Résumé -->
<article id="resume" class="panel">
<header>
<h2>Résumé</h2>
</header>
<p>
I am passionate about working with cutting-edge technology and enhancing our modern world through the use of data-driven solutions.
My background in Software and Test Development helps me to bring a well-rounded perspective to any Software Engineering Team.
</p>
<div>
<a href="https://docs.google.com/document/d/1eVT9e19ShBwgZcUZJa4cTHRB1Wcy1E2yQap6CcW8dvU/edit?usp=sharing" target="_blank" rel="noopener noreferrer" class="button">Updated Resume</a>
</div>
</article>
<!-- Contact -->
<article id="contact" class="panel">
<header>
<h2>Contact Me</h2>
</header>
<form action="https://docs.google.com/forms/u/0/d/e/1FAIpQLSd7PyqtU9i5iaDxuojJRXEvncgJPMZ5U_WglaXQm6Sa8iYpqQ/formResponse" method="post">
<div>
<div class="row">
<div class="col-6 col-12-medium">
<input type="text" name="entry.2005620554" placeholder="Name" required/>
</div>
<div class="col-6 col-12-medium">
<input type="text" name="entry.1045781291" placeholder="Email" required/>
</div>
<div class="col-12">
<input type="text" name="entry.1101262983" placeholder="Subject" required/>
</div>
<div class="col-12">
<textarea name="entry.931481888" placeholder="Message" rows="6" required></textarea>
</div>
<div class="col-12">
<input type="submit" value="Send Message" />
</div>
</div>
</div>
</form>
</article>
</div>
<!-- Footer -->
<div id="footer">
<ul class="copyright">
<li>Natasha Blong</li>
<li>[email protected]</a></li>
<li><a href="https://www.linkedin.com/in/natasha-blong/" target="_blank" rel="noopener noreferrer" class="icon brands fa-linkedin"><span class="label">LinkedIn</span></a></li>
<li><a href="https://github.com/NatashaBlong" target="_blank" rel="noopener noreferrer" class="icon brands fa-github"><span class="label">GitHubTwitter</span></a></li>
</ul>
</div>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.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>