-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
138 lines (133 loc) · 4.58 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Joseph Tressler - Personal Website</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-color: #2c2c2c;
color: #d3d3d3;
display: flex;
flex-direction: column;
min-height: 100vh;
}
.container {
width: 80%;
margin: auto;
overflow: hidden;
}
header {
background: #1a1a1a;
color: #f0f0f0;
padding: 20px 0;
border-bottom: #00aaff 3px solid;
text-align: center;
}
header h1 {
margin: 0;
font-size: 2.5em; /* Title size */
}
.main {
padding: 20px;
background: #333;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
margin-top: 20px;
border-radius: 8px;
flex: 1;
}
.main h2 {
color: #00aaff;
font-size: 1.8em; /* Section header size */
border-bottom: 2px solid #00aaff;
padding-bottom: 10px;
margin-bottom: 20px;
}
.main p {
color: #d3d3d3;
line-height: 1.6;
font-size: 1.1em; /* Body text size */
}
.experience, .education {
padding-bottom: 20px;
}
.experience .header, .education .header {
display: flex;
justify-content: space-between;
align-items: center;
}
.experience .header h3, .education .header h3 {
margin: 0;
font-size: 1.3em; /* Section header size */
}
.main h4 {
font-size: 1.1em; /* Body text size */
color: #d3d3d3;
font-weight: bold;
margin: 5px 0 10px 0;
}
footer {
background: #1a1a1a;
color: #f0f0f0;
padding: 10px 0;
text-align: center;
border-top: #00aaff 3px solid;
}
footer a {
color: #f0f0f0;
margin: 0 10px;
font-size: 1.5em;
}
footer a:hover {
color: #00aaff;
}
</style>
</head>
<body>
<header>
<div class="container">
<h1>Joseph Tressler</h1>
</div>
</header>
<div class="container main">
<section id="about">
<h2>About Me</h2>
<p>Hi there! I'm Joseph, an electrical engineer and software developer based in Green Bay, WI. I love working on projects that make things run smoother and more efficiently. In my free time, I enjoy designing and building 3D printers and building and flying FPV drones. I also write scripts to automate mundane tasks and love reverse engineering things to figure out how they work. Additionally, I enjoy trying my hand at home improvement projects. Let's connect and share our passions for creating and improving things!</p>
</section>
<section id="experience">
<h2>Experience</h2>
<div class="experience">
<div class="header">
<h3><strong>Infinity Machine & Engineering Corp.</strong>, <em>Electrical Engineer</em></h3>
<span>De Pere, WI | 2019 to present</span>
</div>
</div>
<div class="experience">
<div class="header">
<h3><strong>Infinity Machine & Engineering Corp.</strong>, <em>Engineering Intern</em></h3>
<span>De Pere, WI | 2015 to 2017</span>
</div>
</div>
</section>
<section id="education">
<h2>Education</h2>
<div class="education">
<div class="header">
<h3><strong>Michigan Technological University</strong>, <em>BS Computer Engineering</em></h3>
<span>Houghton, MI | 2015 to 2019</span>
</div>
</div>
</section>
</div>
<footer>
<div class="container">
<a href="https://github.com/jhtressl" target="_blank"><i class="fab fa-github"></i></a>
<a href="https://linkedin.com/in/joetress" target="_blank"><i class="fab fa-linkedin"></i></a>
</div>
</footer>
</body>
</html>