146 lines
6.0 KiB
HTML
146 lines
6.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="icon" type="image/x-icon" href="/res/favicon.ico">
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,500,1,200">
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap">
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@400;900&display=swap">
|
|
|
|
<link rel="stylesheet" href="/styles.css">
|
|
<link rel="stylesheet" href="index.css">
|
|
<script src="index.js"></script>
|
|
<title>Max's Place</title>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<nav class="navbar">
|
|
<a href="#" class="button" data-i="home">Max's Place</a>
|
|
<div class="flex-space"></div>
|
|
<a href="#about-me" class="red icon nav12 button" data-i="accessibility_new"><p>About</p></a>
|
|
<a href="#projects" class="yellow icon nav12 button" data-i="design_services"><p>Projects</p></a>
|
|
<a href="/resume" class="green icon nav12 button" data-i="draft"><p>Resume</p></a>
|
|
<a href="#contact-me" class="blue icon nav12 button" data-i="push_pin"><p>Contact</p></a>
|
|
<button class="icon button nav3" data-i="menu" onclick="openMenu()"></button>
|
|
</nav>
|
|
<div id="title-page">
|
|
<img src="/res/avatar.svg" alt="Avatar" id="avatar">
|
|
<div id="title-bottom">
|
|
<div id="title-name">Max Hutz</div>
|
|
<div class="fade-text fade1" data-t="Max Hutz"></div>
|
|
<div class="fade-text fade2" data-t="Max Hutz"></div>
|
|
<div class="fade-text fade3" data-t="Max Hutz"></div>
|
|
<div class="fade-text fade4" data-t="Max Hutz"></div>
|
|
<div class="fade-text fade5" data-t="Max Hutz"></div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<section id="about-me">
|
|
<div id="about-me__back"></div>
|
|
<h2 id="about-me__title" class="head">About<br>Me</h2>
|
|
<div id="about-me__text-outer">
|
|
<div id="about-me__text">
|
|
<div class="back-text">
|
|
<div class="fade-text fade1" data-t="About Me"></div>
|
|
<div class="fade-text fade2" data-t="About Me"></div>
|
|
<div class="fade-text fade3" data-t="About Me"></div>
|
|
</div>
|
|
<p class="body">
|
|
Passionate computer science student skilled in building <strong>
|
|
responsive, full-stack applications</strong>. Motivated to learn from
|
|
colleagues and <strong>teach future developers</strong>. Seeks role to
|
|
fashion software solutions, focused on <strong>teamwork and
|
|
creativity</strong>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="projects">
|
|
<div id="projects-me-back"></div>
|
|
<h2>Projects</h2>
|
|
<p>
|
|
A selection of applications worked on as a computer scientist, from
|
|
flexible web solutions to REST-ful mobile apps.
|
|
</p>
|
|
<section>
|
|
<h3>Malung</h3>
|
|
<img src="/res/avatar.svg" width="300" height="300">
|
|
<p>
|
|
A cloud-based COVID-19 classifier incorporating AI deep learning. Using
|
|
MariaDB and Microsoft Azure, users can store...
|
|
</p>
|
|
<a href="/projects/malung">Learn more →</a>
|
|
</section>
|
|
<section>
|
|
<h3>Fresh-Manual</h3>
|
|
<img src="/res/avatar.svg" width="300" height="300">
|
|
<p>
|
|
A mobile companion to Fresh Manuals website to find, save and organize
|
|
product manuals. UI built with React, React-Native, and SwiftUI...
|
|
</p>
|
|
<a href="/projects/freshmanual">Learn more →</a>
|
|
</section>
|
|
<a href="/projects">View all Projects</a>
|
|
</section>
|
|
|
|
<section id="my-experience">
|
|
<div id="my-experience-back"></div>
|
|
<h2>My Experience</h2>
|
|
<p>
|
|
I've had varied experiences: from <strong>mentoring fellow undergrads
|
|
</strong> to performing in fast-paced settings where <strong>communication
|
|
and innovation</strong> are key.
|
|
</p>
|
|
<div>
|
|
<img src="/res/avatar.svg" width="300" height="300">
|
|
<a href="/projects/freshmanual">View Resume →</a>
|
|
</div>
|
|
</section>
|
|
|
|
<footer id="contact-me">
|
|
<h2>Contact Me!</h2>
|
|
<nav>
|
|
<a href="mailto:maximhutz@gmail.com">maximhutz@gmail.com</a>
|
|
<a href="tel:+19142165972">914.216.5972</a>
|
|
<a href="#">New York City or Tri-State Area Preferred</a>
|
|
</nav>
|
|
<form action="#" method="post">
|
|
<div>
|
|
<label for="fullname">Full Name</label>
|
|
<input type="text" name="fullname" id="fullname">
|
|
</div>
|
|
<div>
|
|
<label for="email">Email</label>
|
|
<input type="text" name="email" id="email">
|
|
</div>
|
|
<div>
|
|
<label for="message">Your Message</label>
|
|
<textarea name="message" id="message" cols="30" rows="10"></textarea>
|
|
</div>
|
|
<button type="submit">Submit</button>
|
|
</form>
|
|
</footer>
|
|
|
|
<!----------------------------------------------------------------------------->
|
|
|
|
<dialog id="menu-modal">
|
|
<div id="menu-inner">
|
|
<a href="#" class="button" data-i="home" onclick="closeMenu()">Max's Place</a>
|
|
<div class="flex-space"></div>
|
|
<a href="/about" class="red icon button" data-i="accessibility_new" onclick="closeMenu()">About</a>
|
|
<a href="/projects" class="yellow icon button" data-i="design_services" onclick="closeMenu()">Projects</a>
|
|
<a href="/resume" class="green icon button" data-i="draft" onclick="closeMenu()">Resume</a>
|
|
<a href="/contact" class="blue icon button" data-i="push_pin" onclick="closeMenu()">Contact</a>
|
|
<div class="flex-space"></div>
|
|
</div>
|
|
</dialog>
|
|
</body>
|
|
</html> |