-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
163 lines (148 loc) · 8.2 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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-KGDLCXK');</script>
<!-- End Google Tag Manager -->
<title>Michael Kolber</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="assets/css/styles.css" />
<link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,700" rel="stylesheet">
</head>
<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KGDLCXK" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<header class="intro">
<div class="intro__content-wrapper">
<h1 class="header">Hey, I'm <br class="header__linebreak"><span class="header__name">Michael Kolber</span>.</h1>
<p class="intro__tagline">Web developer, designer, computer hobbyist</p>
<nav id="nav" class="nav">
<a class="nav__item" href="#about">About</a>
<a class="nav__item" href="#work">Work</a>
<a class="nav__item" href="https://github.com/michaelkolber">GitHub</a>
<a class="nav__item" href="#contact">Contact</a>
</nav>
</div>
</header>
<section id="about" class="about">
<h2 class="header header--subheader">About</h2>
<div class="text about__text">
<p>
I am a college student studying computer science.
I have a few years of experience with web design and development, and
have been tinkering with hardware since I was a kid. Nowadays I mostly
work on web-based projects.<br />
<br />
Languages and systems I am familiar with (in approximate order of familiarity):
</p>
<ul class="about__list">
<li><span class="language--python">Python</span></li>
<li><span class="language--html">HTML</span>/<span class="language--css">CSS</span></li>
<li><span class="language--sass">Sass</span></li>
<li><span class="language--javascript">Javascript</span></li>
<li><span class="language--typescript">TypeScript</span></li>
<li><span class="language--nodejs">Node.js</span></li>
<li><span class="language--java">Java</span></li>
<li><span class="language--cpp">C++</span></li>
<li><span class="language--redis">Redis</span></li>
<li><span class="language--postgres">PostgreSQL</span></li>
<li><span class="language--vba">VBA</span></li>
</ul>
</div>
</section>
<section id="work" class="work">
<h2 class="header header--subheader">Work</h2>
<div class="work-gallery">
<a class="work-item-wrapper" href="https://graded.nyc">
<div class="work-item" style="background-image: url('assets/images/work-item_gradednyc.png')">
<div class="work-item__overlay">
<p class="work-item__description">
Location-based NYC restaurant grades and inspection results.
</p>
</div>
</div>
<div class="work-item__name-wrapper"><span class="work-item__name">Graded NYC</span></div>
</a>
<a class="work-item-wrapper" href="https://cunysecond.com/GN-Core/">
<div class="work-item" style="background-image: url('assets/images/work-item_gn-site.png')">
<div class="work-item__overlay">
<p class="work-item__description">
A responsive website for a student project that sends texts when grades are available.
</p>
</div>
</div>
<div class="work-item__name-wrapper"><span class="work-item__name">Grade Notifier Website</span></div>
</a>
<a class="work-item-wrapper" href="/word-clock/">
<div class="work-item" style="background-image: url('assets/images/work-item_word-clock.png')">
<div class="work-item__overlay">
<p class="work-item__description">
A JavaScript clock that tells the time using words.
</p>
</div>
</div>
<div class="work-item__name-wrapper"><span class="work-item__name">Word Clock</span></div>
</a>
<a class="work-item-wrapper" href="https://www.michaelkolber.com/ltp-website/">
<div class="work-item" style="background-image: url('assets/images/work-item_ltp-site.png')">
<div class="work-item__overlay">
<p class="work-item__description">
A website for the Let's Talk Python college club.
</p>
</div>
</div>
<div class="work-item__name-wrapper"><span class="work-item__name">Let's Talk Python Website</span></div>
</a>
<a class="work-item-wrapper" href="/whatsapp-viewer/">
<div class="work-item" style="background-image: url('assets/images/work-item_wa-viewer.png')">
<div class="work-item__overlay">
<p class="work-item__description">
A website that lets you view exported WhatsApp chats in an easy-to-read fashion (unmaintained).
</p>
</div>
</div>
<div class="work-item__name-wrapper"><span class="work-item__name">WhatsApp Viewer</span></div>
</a>
</div>
<a class="button button--outline button--github" href="https://github.com/michaelkolber">
<img class="button--github__icon" src="assets/images/GitHub-Mark-64px.png" alt="GitHub logo">
See more on GitHub
</a>
</section>
<section id="contact" class="contact">
<h2 class="header header--subheader">Contact Me</h2>
<p class="contact__text contact__text--default">
Just submit this form and I'll get back to you as soon as I can!
</p>
<p class="contact__text contact--submit-success__text">
Thanks for reaching out! I'll be in touch soon.
</p>
<div class="contact-form-wrapper">
<form id="contact-form" class="contact-form" action="https://formspree.io/[email protected]" method="POST">
<input class="contact-form__field" type="email" name="_replyto" placeholder="Your Email">
<input class="contact-form__field" name="_subject" placeholder="Subject">
<textarea class="contact-form__field contact-form__field--textarea" name="message" placeholder="Message"></textarea>
<input type="hidden" name="_next" value="https://www.michaelkolber.com/?formSubmitted=true#contact" />
<input id="contact-form__submit" class="contact-form__submit" type="submit" value="Send">
</form>
<!--
<div class="contact-form__overlay">
<p>
Success! I'll get back to you as soon as possible, thanks for your patience.
</p>
</div> -->
</div>
<p class="linkedin-shoutout">
You can also get me on <a href="https://www.linkedin.com/in/michael-kolber-59a596161/">LinkedIn</a> if you'd like.
</p>
</section>
<footer class="footer">
<p class="footer__text">
Michael Kolber
</p>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="assets/js/scripts.js"></script>
</body>
</html>