ADD: Added resume tab.
This commit is contained in:
MajorDroolz
@@ -1,2 +1,3 @@
|
|||||||
# maximhutz.github.io
|
# The Personal Website of Maxim Voldman Hutz
|
||||||
My portfolio website: a summary of what I've done.
|
This website serves as an exhibit of who I am, what I've done, what I'm doing,
|
||||||
|
and what I plan to do.
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Hank Quinlan, Horrible Cop</title>
|
<title>My Resume</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<nav>
|
<nav>
|
||||||
|
|||||||
377
resume/index.css
Normal file
377
resume/index.css
Normal file
@@ -0,0 +1,377 @@
|
|||||||
|
/*---- Base ------------------------------------------------------------------*/
|
||||||
|
|
||||||
|
:root {
|
||||||
|
font-family: sans-serif;
|
||||||
|
--timing: cubic-bezier(.2,1,0,1);
|
||||||
|
--enter: 2s var(--timing) 0.2s backwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
html {
|
||||||
|
font-size: 1vw;
|
||||||
|
background: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
html {
|
||||||
|
font-size: 0.7rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Generic Styles --------------------------------------------------------*/
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
font-size: 1.15em;
|
||||||
|
}
|
||||||
|
|
||||||
|
h5 {
|
||||||
|
font-size: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
padding-inline-start: 2em;
|
||||||
|
margin: 0.5em 0;
|
||||||
|
list-style-type: '— ';
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Navbar ----------------------------------------------------------------*/
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
height: 18em;
|
||||||
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
z-index: -1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav.navbar {
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resume-header {
|
||||||
|
color: white;
|
||||||
|
filter: opacity(0.5);
|
||||||
|
font: bold 8em 'Poppins';
|
||||||
|
animation: var(--enter) title-enter;
|
||||||
|
will-change: transform, filter;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer.navbar {
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.resume-footer {
|
||||||
|
font: bold 8em monospace;
|
||||||
|
animation: var(--enter) footer-enter;
|
||||||
|
will-change: transform, filter;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-icon {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-img {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 0.75em;
|
||||||
|
user-select: none;
|
||||||
|
filter: brightness(0) invert(1);
|
||||||
|
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 0.5;
|
||||||
|
transition: transform 0.3s, opacity 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer-img:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Page ------------------------------------------------------------------*/
|
||||||
|
|
||||||
|
article {
|
||||||
|
background: whitesmoke;
|
||||||
|
border: 2px solid gainsboro;
|
||||||
|
padding: 3em;
|
||||||
|
margin: 18em 16em;
|
||||||
|
border-radius: 1em;
|
||||||
|
animation: var(--enter) page-enter, var(--enter) scroll-enter;
|
||||||
|
will-change: transform, filter;
|
||||||
|
box-shadow: 0 2.5em 5em 0 #0004,
|
||||||
|
inset 1.5em 1.5em 5em 2.5em white;
|
||||||
|
}
|
||||||
|
|
||||||
|
body::before {
|
||||||
|
background: lightsteelblue linear-gradient(45deg, #F008, #00F8);
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
content: "";
|
||||||
|
display: inline-block;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: -2;
|
||||||
|
animation: var(--enter) gradient-enter;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Header ----------------------------------------------------------------*/
|
||||||
|
|
||||||
|
.contact-details {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-style: normal;
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.contact-detail {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.email {
|
||||||
|
color: dodgerblue;
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone {
|
||||||
|
color: orangered;
|
||||||
|
}
|
||||||
|
|
||||||
|
.location {
|
||||||
|
color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Sectioning ------------------------------------------------------------*/
|
||||||
|
|
||||||
|
.topic-title {
|
||||||
|
padding-bottom: 3px;
|
||||||
|
border-bottom: 2px solid cornflowerblue;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic {
|
||||||
|
margin-top: 2em;
|
||||||
|
page-break-inside: avoid;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Experience Title ------------------------------------------------------*/
|
||||||
|
|
||||||
|
.experience {
|
||||||
|
margin-top: 2em;
|
||||||
|
margin-bottom: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-family: Verdana;
|
||||||
|
color: steelblue;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title > i {
|
||||||
|
font-weight: normal;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.date {
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place {
|
||||||
|
font-weight: normal;
|
||||||
|
display: block;
|
||||||
|
color: dimgray;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Skill List ------------------------------------------------------------*/
|
||||||
|
|
||||||
|
.skill-list {
|
||||||
|
list-style: none;
|
||||||
|
padding-inline-start: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skill-list > li {
|
||||||
|
border: 1px solid gainsboro;
|
||||||
|
display: inline-flex;
|
||||||
|
padding: 0.5em 1em;
|
||||||
|
border-radius: 0.5em;
|
||||||
|
color: steelblue;
|
||||||
|
background: whitesmoke;
|
||||||
|
font-family: monospace;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
align-items: center;
|
||||||
|
font-weight: bold;
|
||||||
|
user-select: none;
|
||||||
|
margin: 0.5em;
|
||||||
|
box-shadow: 0 0.25em 0.25em 0 #0004,
|
||||||
|
inset 0.15em 0.15em 0.5em 0.25em white;
|
||||||
|
transform: scale(1);
|
||||||
|
transition: transform var(--timing) 1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skill-list > li img {
|
||||||
|
height: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skill-list > li:hover {
|
||||||
|
transform: scale(1.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Classes List ----------------------------------------------------------*/
|
||||||
|
|
||||||
|
.classes-list {
|
||||||
|
list-style: none;
|
||||||
|
padding-inline-start: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.classes-list > li::before {
|
||||||
|
content: '— ';
|
||||||
|
}
|
||||||
|
|
||||||
|
.classes-list > li {
|
||||||
|
width: calc(50% - 3ch);
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Miscellaneous ---------------------------------------------------------*/
|
||||||
|
|
||||||
|
.hflex {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
margin-right: 0.5em;
|
||||||
|
user-select: none;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.freshmanuals {
|
||||||
|
color: steelblue;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Animations ------------------------------------------------------------*/
|
||||||
|
|
||||||
|
@keyframes page-enter {
|
||||||
|
0% {
|
||||||
|
filter: opacity(0);
|
||||||
|
transform: scale(1.5) translate3d(0, 50%, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
99% {
|
||||||
|
filter: opacity(1);
|
||||||
|
transform: scale(1) translate3d(0, 0%, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
filter: opacity(1);
|
||||||
|
transform: scale(1) translate3d(0, 0%, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes gradient-enter {
|
||||||
|
0% {
|
||||||
|
filter: opacity(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
filter: opacity(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes title-enter {
|
||||||
|
0% {
|
||||||
|
filter: opacity(0);
|
||||||
|
transform: scale(2) translate3d(0, -200%, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
filter: opacity(0.5);
|
||||||
|
transform: scale(1) translate3d(0, 0%, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes footer-enter {
|
||||||
|
0% {
|
||||||
|
filter: opacity(0);
|
||||||
|
transform: scale(2) translate3d(0, 1000%, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
filter: opacity(1);
|
||||||
|
transform: scale(1) translate3d(0, 0%, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes scroll-enter {
|
||||||
|
0% {
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
|
|
||||||
|
25% {
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
position: static;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*---- Print Styles ----------------------------------------------------------*/
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
article {
|
||||||
|
margin: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
border: 0;
|
||||||
|
padding: 0;
|
||||||
|
background: white;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
overflow: auto;
|
||||||
|
height: auto;
|
||||||
|
background: white;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body {
|
||||||
|
overflow: auto;
|
||||||
|
background: white;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skill-list > li {
|
||||||
|
box-shadow: none;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
article * {
|
||||||
|
-webkit-print-color-adjust: exact;
|
||||||
|
print-color-adjust: exact;
|
||||||
|
}
|
||||||
|
}
|
||||||
155
resume/index.html
Normal file
155
resume/index.html
Normal file
@@ -0,0 +1,155 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<title>Resume of Maxim Voldman Hutz</title>
|
||||||
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
|
||||||
|
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/>
|
||||||
|
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,500;0,800;0,900;1,100;1,500;1,800;1,900&display=swap" rel="stylesheet"/>
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css"/>
|
||||||
|
|
||||||
|
<link rel="stylesheet" type="text/css" href="index.css"/>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<nav class="navbar">
|
||||||
|
<header class="resume-header">Resume</header>
|
||||||
|
</nav>
|
||||||
|
<article class="container">
|
||||||
|
<header>
|
||||||
|
<h1 class="topic-title">Maxim Voldman Hutz</h1>
|
||||||
|
<address class="contact-details">
|
||||||
|
<a href="mailto:maximhutz@gmail.com" class="contact-detail email">
|
||||||
|
<i class="bi bi-envelope-fill icon"></i>
|
||||||
|
maximhutz@gmail.com
|
||||||
|
</a>
|
||||||
|
<a href="tel:+19142165972" class="contact-detail phone">
|
||||||
|
<i class="bi bi-telephone-fill icon"></i>
|
||||||
|
914.216.5972
|
||||||
|
</a>
|
||||||
|
<a class="contact-detail location">
|
||||||
|
<i class="bi bi-geo-fill icon"></i>
|
||||||
|
New York City or Tri-State Area Preferred
|
||||||
|
</a>
|
||||||
|
</address>
|
||||||
|
</header>
|
||||||
|
<section class="topic">
|
||||||
|
<h2 class="topic-title">
|
||||||
|
<i class="bi bi-briefcase-fill topic-icon"></i>
|
||||||
|
Experience
|
||||||
|
</h2>
|
||||||
|
<section>
|
||||||
|
<header class="experience">
|
||||||
|
<div class="hflex">
|
||||||
|
<h4 class="place">Tightrope Interactive, <i>Cold Spring, NY</i></h4>
|
||||||
|
<aside class="date">05/2022 - 08/2022</aside>
|
||||||
|
</div>
|
||||||
|
<h3 class="title">Software Engineer Internship</h3>
|
||||||
|
</header>
|
||||||
|
<p>Created mobile companion to
|
||||||
|
<a href="https://freshmanuals.com" target="_blank" class="freshmanuals">Fresh Manuals</a>
|
||||||
|
website.</p>
|
||||||
|
<ul>
|
||||||
|
<li>Built user interface using React/React-Native</li>
|
||||||
|
<li>Used Firestore/Firebase to store and access user account data</li>
|
||||||
|
<li>Used Fetch API to request user manual data from website API endpoints</li>
|
||||||
|
<li>Integrated paid yahoo search results into mobile search results</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<header class="experience">
|
||||||
|
<div class="hflex">
|
||||||
|
<h4 class="place">Tightrope Interactive, <i>Cold Spring, NY</i></h4>
|
||||||
|
<aside class="date">05/2021 - 8/2021</aside>
|
||||||
|
</div>
|
||||||
|
<h3 class="title">Junior Software Engineer Internship</h3>
|
||||||
|
</header>
|
||||||
|
<p>Software developer in project team developing a user manual aggregator site
|
||||||
|
<a href="https://freshmanuals.com" target="_blank" class="freshmanuals">Fresh Manuals</a>.
|
||||||
|
</p>
|
||||||
|
<ul>
|
||||||
|
<li>Used PHP to extract data on user manuals from individual websites and aggregators</li>
|
||||||
|
<li>Over 20 individual web scrapers developed and customized to individual websites</li>
|
||||||
|
<li>Created PDF viewer using Javascript, HTML, and CSS to upload/print files</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
<section class="topic">
|
||||||
|
<h2 class="topic-title">
|
||||||
|
<i class="bi bi-tools topic-icon"></i>
|
||||||
|
Skills
|
||||||
|
</h2>
|
||||||
|
<ul class="skill-list">
|
||||||
|
<li>JAVASCRIPT</li>
|
||||||
|
<li>TYPESCRIPT</li>
|
||||||
|
<li>PYTHON</li>
|
||||||
|
<li>JAVA</li>
|
||||||
|
<li>HTML</li>
|
||||||
|
<li>CSS</li>
|
||||||
|
<li>C</li>
|
||||||
|
<li>C++</li>
|
||||||
|
<li>PHP</li>
|
||||||
|
<li>OBJECTIVE-C</li>
|
||||||
|
<li>REACT</li>
|
||||||
|
<li>REACT-NATIVE</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<section class="topic">
|
||||||
|
<h2 class="topic-title">
|
||||||
|
<i class="bi bi-book-half topic-icon"></i>
|
||||||
|
Education
|
||||||
|
</h2>
|
||||||
|
<header class="experience">
|
||||||
|
<div class="hflex">
|
||||||
|
<h4 class="place">Rensselaer Polytehnic Institute, <i>Troy, NY</i></h4>
|
||||||
|
<aside class="date">Expected Graduation 05/2025</aside>
|
||||||
|
</div>
|
||||||
|
<h3 class="title">BS Computer Science, BS Information Technology & Web Science</h3>
|
||||||
|
</header>
|
||||||
|
<section>
|
||||||
|
<header class="experience hflex">
|
||||||
|
<h4 class="title">Sophomore Year</h4>
|
||||||
|
<aside class="date">08/2022 - Present</aside>
|
||||||
|
</header>
|
||||||
|
<ul class="classes-list">
|
||||||
|
<li>Introduction to Information Technology & Web Science</li>
|
||||||
|
<li>Foundations of Human Computer Interactions</li>
|
||||||
|
<li>Rensselaer Center for Open Source</li>
|
||||||
|
<li>Multivariate Calculus and Matrix Algebra</li>
|
||||||
|
<li>Introductions to Algorithms</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
<section>
|
||||||
|
<header class="experience hflex">
|
||||||
|
<h4 class="title">Freshman Year (4.0 GPA, Dean's List Fall & Spring)</h4>
|
||||||
|
<aside class="date">08/2021 - 05/2022</aside>
|
||||||
|
</header>
|
||||||
|
<ul class="classes-list">
|
||||||
|
<li>Foundations of Computer Science</li>
|
||||||
|
<li>Rensselaer Center for Open Source</li>
|
||||||
|
<li>Calculus II</li>
|
||||||
|
<li>Introduction to Logic</li>
|
||||||
|
<li>Language and Power</li>
|
||||||
|
<li>Calculus I</li>
|
||||||
|
<li>Physics I</li>
|
||||||
|
<li>Data Structures</li>
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
</article>
|
||||||
|
<footer class="navbar">
|
||||||
|
<address class="resume-footer">
|
||||||
|
<a href="https://github.com/MajorDroolz" class="footer-icon" target="_blank">
|
||||||
|
<i class="bi bi-github footer-img"></i>
|
||||||
|
</a>
|
||||||
|
<a href="https://www.linkedin.com/in/maximhutz" class="footer-icon" target="_blank">
|
||||||
|
<i class="bi bi-linkedin footer-img"></i>
|
||||||
|
</a>
|
||||||
|
</address>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
Reference in New Issue
Block a user