ADD: Added resume tab.

This commit is contained in:
MajorDroolz
2022-10-05 21:36:04 -04:00
parent fc23c17c9e
commit 6f0f2cb6c4
4 changed files with 536 additions and 3 deletions

View File

@@ -1,2 +1,3 @@
# maximhutz.github.io
My portfolio website: a summary of what I've done.
# The Personal Website of Maxim Voldman Hutz
This website serves as an exhibit of who I am, what I've done, what I'm doing,
and what I plan to do.

View File

@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<title>Hank Quinlan, Horrible Cop</title>
<title>My Resume</title>
</head>
<body>
<nav>

377
resume/index.css Normal file
View 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
View 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>