-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
180 lines (173 loc) · 7.85 KB
/
about.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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<!-- link style sheet -->
<link rel="stylesheet" href="css/style.css">
<!-- font awesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
<!-- google fonts -->
<link href="https://fonts.googleapis.com/css?family=Raleway:400,500" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Merriweather" rel="stylesheet">
<!-- bootstrap -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<title>About Kate</title>
</head>
<body>
<div class="about-container">
<!-- header -->
<header id="index_header" class="header">
<div class="my-logo">
<img src="img/Logo.png" alt="kate-logo" id="logo">
</div>
<div class="index-title-block">
<h1 class="index-title">Katelynn Weingart</h1>
<p class="index-description">Developer</p>
</div>
<!-- navigation and external links -->
<div class="nav">
<!-- Main nav for index links -->
<ul id="nav" class="index-main-nav">
<li><a href="index.html"><span class="header-name">Home</span><i class="fas fa-home front-icon"></i></a></li>
<li class="active"><a href="about.html"><span class="header-name">About Me</span><i class="fas fa-user front-icon"></i></a></li>
<li><a href="resume.html"><span class="header-name">Resume</span><i class="fas fa-pencil-alt front-icon"></i></a></li>
<li><a href="portfolio.html"><span class="header-name">Portfolio</span><i class="fas fa-desktop front-icon"></i></a></li>
<li><a href="contact.html"><span class="header-name">Contact</span><i class="fas fa-phone front-icon"></i></a></li>
</ul>
<!-- Main menu for index links -->
<!-- External Links -->
<ul class="external-links">
<li>
<a href="https://github.com/kweingart08" target="_blank" class="external-button">
<i class="fab fa-github"></i>
</a>
</li>
<li>
<a href="https://www.linkedin.com/in/katelynnweingart/" target="_blank" class="external-button"><i class="fab fa-linkedin"></i>
</a>
</li>
<li>
<a href="https://profiles.generalassemb.ly/katelynn-weingart" target="_blank" class="external-button"><i class="fas fa-cog"></i>
</a>
</li>
</ul>
<!-- External Links -->
</div>
<!-- navigation and external links -->
</header>
<!-- about me main div -->
<div class="about-me">
<!-- header with title -->
<div class="about-me-header">
<img src="img/Kate_avatar.png" alt="kate-avatar" id="avatar">
<h2 class="header-title">About Me</h2>
</div>
<!-- header with title -->
<!-- about me description paragraph -->
<div class="about-me-description">
<p>Hi, I'm <span id="name">Kate!</span></p>
<p>I grew up in the small town of Coldwater, Ohio where my childhood was filled with biking to the park to make it to swim team practice, watching my brothers play baseball, and the exciting summer jobs of cleaning offices and filing paperwork.</p>
<p>I decided to be adventurous and move outside of Coldwater for college (not a lot of college options in Coldwater..okay, there are none). The moment I stepped onto Marquette's campus, I fell in love, and I knew I had made my decision. The next year, I moved to Milwaukee and started studying Biomedical Engineering. I also quickly learned what Miller Lite was (which is still my drink of choice).</p>
<p>I have a background in engineering and an inquisitive mind that led me to transform into a passionate, full stack web developer. I am a natural born problem solver that is eager to use my skills of collaboration to effectively and efficiently deliver powerful and beautiful solutions that meet customers needs.</p>
</div>
<!-- about me description paragraph -->
<!-- fun facts div -->
<div class="fun-facts">
<!-- fun fact header -->
<div class="fun-title">
<h3 class="fun-title-header">Fun Facts</h3>
</div>
<!-- fun fact header -->
<!-- fun facts row -->
<div class="row">
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-coffee"></i>
<h4 class="fact-header">Coffee Consumed</h4>
<span class="fact-value">>20,000</span>
</div>
</div>
<!-- fun fact column -->
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="far fa-snowflake"></i>
<h4 class="fact-header">Years Skiing</h4>
<span class="fact-value">7</span>
</div>
</div>
<!-- fun fact column -->
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-beer"></i>
<h4 class="fact-header">Koozies Designed</h4>
<span class="fact-value">>10</span>
</div>
</div>
<!-- fun fact column -->
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-birthday-cake"></i>
<h4 class="fact-header">Birthday</h4>
<span class="fact-value">8-8-88</span>
</div>
</div>
<!-- fun fact column -->
</div>
<!-- fun facts row -->
</div>
<!-- fun facts div -->
<!-- fun facts div -->
<div class="fun-facts">
<!-- fun fact header -->
<div class="fun-title">
<h3 class="fun-title-header">Interests</h3>
</div>
<!-- fun fact header -->
<!-- fun facts row -->
<div class="row">
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-coffee"></i>
<h4 class="fact-header">Coffee</h4>
</div>
</div>
<!-- fun fact column -->
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-bicycle"></i>
<h4 class="fact-header">Outdoors: biking, hiking, skiing</h4>
</div>
</div>
<!-- fun fact column -->
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-headphones"></i>
<h4 class="fact-header">Piano/Music</h4>
</div>
</div>
<!-- fun fact column -->
<!-- fun fact column -->
<div class="col-fact col-sm-6 col-md-3">
<div class="fact">
<i class="fas fa-paint-brush"></i>
<h4 class="fact-header">Creative Projects</h4>
</div>
</div>
<!-- fun fact column -->
</div>
<!-- fun facts row -->
</div>
<!-- fun facts div -->
</div>
<!-- about me main div -->
</div>
</body>
</html>