Compare commits
8 Commits
homepage
...
project-li
| Author | SHA1 | Date | |
|---|---|---|---|
|
77991356f4 | ||
|
|
875a80488c | ||
|
|
86434d5248 | ||
|
|
128c97900c | ||
|
|
fe013e056b | ||
|
|
03c19781e9 | ||
|
|
e264abd558 | ||
|
|
c1c1c664a3 |
5
.gitignore
vendored
Normal file
5
.gitignore
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
_site
|
||||
.bundle
|
||||
.jekyll-cache
|
||||
vendor
|
||||
.vscode
|
||||
16
404.html
Normal file
16
404.html
Normal file
@@ -0,0 +1,16 @@
|
||||
---
|
||||
title: 404
|
||||
description: Oops! The page you wanted does not exist.
|
||||
layout: default
|
||||
---
|
||||
|
||||
<link rel="stylesheet" href="/styles/404.css">
|
||||
|
||||
<section id="notfound" class="back">
|
||||
<div id="text-outer">
|
||||
<i>Looks like your lost!</i>
|
||||
<h1 id="text-404" class="shadow">404</h1>
|
||||
</div>
|
||||
<hr class="lighter">
|
||||
<button type="button" class="nav-link white button" onclick="history.back(-1)">Go Back.</button>
|
||||
</section>
|
||||
2
Gemfile
Normal file
2
Gemfile
Normal file
@@ -0,0 +1,2 @@
|
||||
source "https://rubygems.org"
|
||||
gem "jekyll", "~> 4.3"
|
||||
70
Gemfile.lock
Normal file
70
Gemfile.lock
Normal file
@@ -0,0 +1,70 @@
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
addressable (2.8.1)
|
||||
public_suffix (>= 2.0.2, < 6.0)
|
||||
colorator (1.1.0)
|
||||
concurrent-ruby (1.1.10)
|
||||
em-websocket (0.5.3)
|
||||
eventmachine (>= 0.12.9)
|
||||
http_parser.rb (~> 0)
|
||||
eventmachine (1.2.7)
|
||||
ffi (1.15.5)
|
||||
forwardable-extended (2.6.0)
|
||||
google-protobuf (3.21.12)
|
||||
http_parser.rb (0.8.0)
|
||||
i18n (1.12.0)
|
||||
concurrent-ruby (~> 1.0)
|
||||
jekyll (4.3.1)
|
||||
addressable (~> 2.4)
|
||||
colorator (~> 1.0)
|
||||
em-websocket (~> 0.5)
|
||||
i18n (~> 1.0)
|
||||
jekyll-sass-converter (>= 2.0, < 4.0)
|
||||
jekyll-watch (~> 2.0)
|
||||
kramdown (~> 2.3, >= 2.3.1)
|
||||
kramdown-parser-gfm (~> 1.0)
|
||||
liquid (~> 4.0)
|
||||
mercenary (>= 0.3.6, < 0.5)
|
||||
pathutil (~> 0.9)
|
||||
rouge (>= 3.0, < 5.0)
|
||||
safe_yaml (~> 1.0)
|
||||
terminal-table (>= 1.8, < 4.0)
|
||||
webrick (~> 1.7)
|
||||
jekyll-sass-converter (3.0.0)
|
||||
sass-embedded (~> 1.54)
|
||||
jekyll-watch (2.2.1)
|
||||
listen (~> 3.0)
|
||||
kramdown (2.4.0)
|
||||
rexml
|
||||
kramdown-parser-gfm (1.1.0)
|
||||
kramdown (~> 2.0)
|
||||
liquid (4.0.3)
|
||||
listen (3.7.1)
|
||||
rb-fsevent (~> 0.10, >= 0.10.3)
|
||||
rb-inotify (~> 0.9, >= 0.9.10)
|
||||
mercenary (0.4.0)
|
||||
pathutil (0.16.2)
|
||||
forwardable-extended (~> 2.6)
|
||||
public_suffix (5.0.1)
|
||||
rb-fsevent (0.11.2)
|
||||
rb-inotify (0.10.1)
|
||||
ffi (~> 1.0)
|
||||
rexml (3.2.5)
|
||||
rouge (3.30.0)
|
||||
safe_yaml (1.0.5)
|
||||
sass-embedded (1.57.1-arm64-darwin)
|
||||
google-protobuf (~> 3.21)
|
||||
terminal-table (3.0.2)
|
||||
unicode-display_width (>= 1.1.1, < 3)
|
||||
unicode-display_width (2.4.1)
|
||||
webrick (1.7.0)
|
||||
|
||||
PLATFORMS
|
||||
arm64-darwin-21
|
||||
|
||||
DEPENDENCIES
|
||||
jekyll (~> 4.3)
|
||||
|
||||
BUNDLED WITH
|
||||
2.4.2
|
||||
16
_data/home.yml
Normal file
16
_data/home.yml
Normal file
@@ -0,0 +1,16 @@
|
||||
welcome:
|
||||
Hey! 👋 I'm Max Hutz.
|
||||
|
||||
status:
|
||||
Software developer in New York.
|
||||
|
||||
about:
|
||||
I'm a passionate computer science student skilled in building responsive,
|
||||
full-stack applications. I love learning from colleagues and teaching future
|
||||
developers. I thrive where teamwork and creativity are key.
|
||||
|
||||
email:
|
||||
maximhutz@gmail.com
|
||||
|
||||
featured:
|
||||
[ malung, freshmanual, pollbuddy, rpi-crisis ]
|
||||
151
_data/work.yml
Normal file
151
_data/work.yml
Normal file
@@ -0,0 +1,151 @@
|
||||
malung:
|
||||
title:
|
||||
Example
|
||||
|
||||
subtitle:
|
||||
Just A Test
|
||||
|
||||
stack:
|
||||
[ PHP, JS, CSS, HTML, Docker, MariaDB, Azure ]
|
||||
|
||||
description:
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book. It has survived not only five centuries, but also
|
||||
the leap into electronic typesetting, remaining essentially unchanged.
|
||||
|
||||
outcomes:
|
||||
- Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
|
||||
- Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book.
|
||||
|
||||
- It has survived not only five centuries, but also the leap into electronic
|
||||
typesetting, remaining essentially unchanged.
|
||||
|
||||
image:
|
||||
/res/avatar.svg
|
||||
|
||||
link:
|
||||
/
|
||||
|
||||
color:
|
||||
yellow
|
||||
|
||||
#*----------------------------------------------------------------------------*#
|
||||
|
||||
freshmanual:
|
||||
title:
|
||||
Example
|
||||
|
||||
subtitle:
|
||||
Just A Test
|
||||
|
||||
stack:
|
||||
[ PHP, JS, CSS, HTML, Docker, MariaDB, Azure ]
|
||||
|
||||
description:
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book. It has survived not only five centuries, but also
|
||||
the leap into electronic typesetting, remaining essentially unchanged.
|
||||
|
||||
outcomes:
|
||||
- Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
|
||||
- Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book.
|
||||
|
||||
- It has survived not only five centuries, but also the leap into electronic
|
||||
typesetting, remaining essentially unchanged.
|
||||
|
||||
image:
|
||||
/res/avatar.svg
|
||||
|
||||
link:
|
||||
/
|
||||
|
||||
color:
|
||||
blue
|
||||
|
||||
#*----------------------------------------------------------------------------*#
|
||||
|
||||
pollbuddy:
|
||||
title:
|
||||
Example
|
||||
|
||||
subtitle:
|
||||
Just A Test
|
||||
|
||||
stack:
|
||||
[ PHP, JS, CSS, HTML, Docker, MariaDB, Azure ]
|
||||
|
||||
description:
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book. It has survived not only five centuries, but also
|
||||
the leap into electronic typesetting, remaining essentially unchanged.
|
||||
|
||||
outcomes:
|
||||
- Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
|
||||
- Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book.
|
||||
|
||||
- It has survived not only five centuries, but also the leap into electronic
|
||||
typesetting, remaining essentially unchanged.
|
||||
|
||||
image:
|
||||
/res/avatar.svg
|
||||
|
||||
link:
|
||||
/
|
||||
|
||||
color:
|
||||
green
|
||||
|
||||
#*----------------------------------------------------------------------------*#
|
||||
|
||||
rpi-crisis:
|
||||
title:
|
||||
Example
|
||||
|
||||
subtitle:
|
||||
Just A Test
|
||||
|
||||
stack:
|
||||
[ PHP, JS, CSS, HTML, Docker, MariaDB, Azure ]
|
||||
|
||||
description:
|
||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book. It has survived not only five centuries, but also
|
||||
the leap into electronic typesetting, remaining essentially unchanged.
|
||||
|
||||
outcomes:
|
||||
- Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
||||
|
||||
- Lorem Ipsum has been the industry's standard dummy text ever since the
|
||||
1500s, when an unknown printer took a galley of type and scrambled it to
|
||||
make a type specimen book.
|
||||
|
||||
- It has survived not only five centuries, but also the leap into electronic
|
||||
typesetting, remaining essentially unchanged.
|
||||
|
||||
image:
|
||||
/res/avatar.svg
|
||||
|
||||
link:
|
||||
/
|
||||
|
||||
color:
|
||||
red
|
||||
|
||||
#*----------------------------------------------------------------------------*#
|
||||
13
_includes/footer.html
Normal file
13
_includes/footer.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<link rel="stylesheet" href="/styles/footer.css">
|
||||
|
||||
<footer class="dark back">
|
||||
<h2>© 2022</h2>
|
||||
<div class="flex"></div>
|
||||
<a href="https://github.com/MajorDroolz" class="png-icon" target="_blank">
|
||||
<img src="/res/icons/github.png" alt="GitHub" width="30" height="30">
|
||||
</a>
|
||||
<a href="https://www.linkedin.com/in/maximhutz/" class="png-icon" target="_blank">
|
||||
<img src="/res/icons/linkedin.png" alt="LinkedIn" width="30" height="30">
|
||||
</a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link white icon" data-i="mail" aria-label="Contact" target="_blank"></a>
|
||||
</footer>
|
||||
30
_includes/header.html
Normal file
30
_includes/header.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<link rel="stylesheet" href="/styles/header.css">
|
||||
|
||||
<header class="light back shadow">
|
||||
<a href="/" class="nav-link dark">MAX HUTZ</a>
|
||||
<div class="flex"></div>
|
||||
<a href="/experiences" class="nav-link dark icon nav3" data-i="work">Experience</a>
|
||||
<a href="/resume" class="nav-link dark icon nav3" data-i="clinical_notes">Resume</a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link dark icon nav3" data-i="mail">Contact</a>
|
||||
<a href="/experiences" class="nav-link dark icon nav2" data-i="work" aria-label="Experience"></a>
|
||||
<a href="/resume" class="nav-link dark icon nav2" data-i="clinical_notes" aria-label="Resume"></a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link dark icon nav2" data-i="mail" aria-label="Contact"></a>
|
||||
<button class="nav-link dark icon nav1" data-i="menu" aria-label="Menu" onclick="document.getElementById('menu')?.showModal()"></button>
|
||||
</header>
|
||||
|
||||
<dialog id="menu">
|
||||
<div class="light width-pad shadow">
|
||||
<div id="menu-inner">
|
||||
<div id="menu-top">
|
||||
<a href="/home" class="nav-link dark">MAX HUTZ</a>
|
||||
<div class="flex"></div>
|
||||
<form method="dialog">
|
||||
<button class="nav-link dark icon" data-i="close" aria-label="Close"></button>
|
||||
</form>
|
||||
</div>
|
||||
<a href="/experiences" class="nav-link dark icon" data-i="work">Experience</a>
|
||||
<a href="/resume" class="nav-link dark icon" data-i="clinical_notes">Resume</a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link dark icon" data-i="mail">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</dialog>
|
||||
1
_includes/style.html
Normal file
1
_includes/style.html
Normal file
@@ -0,0 +1 @@
|
||||
<link rel="stylesheet" href="/styles/{{ include.name }}.css">
|
||||
30
_layouts/default.html
Normal file
30
_layouts/default.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<!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">
|
||||
<meta name="description" content="{{ page.description }}">
|
||||
|
||||
<link rel="shortcut icon" type="image/png" href="/res/favicon.png">
|
||||
|
||||
<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/global.css">
|
||||
<link rel="stylesheet" href="/styles/default.css">
|
||||
|
||||
<title>{{ page.title }} ─ Max Hutz</title>
|
||||
</head>
|
||||
<body>
|
||||
{% include header.html %}
|
||||
|
||||
{{ content }}
|
||||
|
||||
{% include footer.html %}
|
||||
</body>
|
||||
</html>
|
||||
23
experiences.html
Normal file
23
experiences.html
Normal file
@@ -0,0 +1,23 @@
|
||||
---
|
||||
title: Experiences
|
||||
description: A list of past and current work and projects from Maxim Voldman Hutz.
|
||||
layout: default
|
||||
---
|
||||
|
||||
{% assign work = site.data.work %}
|
||||
|
||||
<section id="projects" class="dark back">
|
||||
<h2>My experiences.</h2>
|
||||
<div id="project-list">
|
||||
{% for item in work %}
|
||||
{% assign id = item[0] %}
|
||||
{% assign data = item[1] %}
|
||||
|
||||
<a class="{{ data.color }} project-item shadow" href="/experience/{{ id }}">
|
||||
<div class="space"></div>
|
||||
<div class="nav-link project-link r-icon" data-i="arrow_right">{{ data.title }}: {{ data.subtitle }}
|
||||
</div>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</section>
|
||||
120
home/index.html
120
home/index.html
@@ -1,120 +0,0 @@
|
||||
<!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">
|
||||
<meta name="description" content="This is the home page of Maxim Voldman Hutz's personal website.">
|
||||
|
||||
<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">
|
||||
<title>Max Hutz</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header-outer" class="light width-pad shadow">
|
||||
<header>
|
||||
<a href="#" class="nav-link dark">MAX HUTZ</a>
|
||||
<div class="flex"></div>
|
||||
<a href="/experience" class="nav-link dark icon nav3" data-i="work">Experience</a>
|
||||
<a href="/resume" class="nav-link dark icon nav3" data-i="clinical_notes">Resume</a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link dark icon nav3" data-i="mail">Contact</a>
|
||||
<a href="/experience" class="nav-link dark icon nav2" data-i="work" aria-label="Experience"></a>
|
||||
<a href="/resume" class="nav-link dark icon nav2" data-i="clinical_notes" aria-label="Resume"></a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link dark icon nav2" data-i="mail" aria-label="Contact"></a>
|
||||
<button class="nav-link dark icon nav1" data-i="menu" aria-label="Menu" onclick="document.getElementById('menu')?.showModal()"></button>
|
||||
</header>
|
||||
</div>
|
||||
|
||||
<div class="light width-pad">
|
||||
<section id="about">
|
||||
<div class="flex"></div>
|
||||
<div class="flex"></div>
|
||||
<div>
|
||||
<h1>Hey! 👋 <span class="pre">I'm Max Hutz.</span></h1>
|
||||
<i>Software engineer in New York.</i>
|
||||
</div>
|
||||
<p id="about-me">
|
||||
I’m a passionate computer science student skilled in building
|
||||
responsive, full-stack applications. I love learning from colleagues
|
||||
and teaching future developers. I thrive where teamwork and creativity
|
||||
are key.
|
||||
</p>
|
||||
<hr class="darker">
|
||||
<nav>
|
||||
<div id="inner-nav">
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link blue button flex">maximhutz@gmail.com</a>
|
||||
<a href="/resume" class="nav-link red button r-icon flex" data-i="arrow_right" target="_blank">View Resume</a>
|
||||
</div>
|
||||
<div class="space"></div>
|
||||
</nav>
|
||||
<div class="flex"></div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="dark width-pad">
|
||||
<section id="projects">
|
||||
<h2>Worked on:</h2>
|
||||
<div id="project-list">
|
||||
<a class="yellow project-item shadow" href="/experience/malung">
|
||||
<div class="space"></div>
|
||||
<div class="nav-link project-link r-icon" data-i="arrow_right">Malung: COVID-19 Classifier</div>
|
||||
</a>
|
||||
<a class="blue project-item shadow" href="/experience/freshmanual">
|
||||
<div class="space"></div>
|
||||
<div class="nav-link project-link r-icon" data-i="arrow_right">Freshmanual: Mobile App</div>
|
||||
</a>
|
||||
<a class="green project-item shadow" href="/experience/pollbuddy">
|
||||
<div class="space"></div>
|
||||
<div class="nav-link project-link r-icon" data-i="arrow_right">Poll Buddy</div>
|
||||
</a>
|
||||
<a class="red project-item shadow" href="/experience/rpi-crisis">
|
||||
<div class="space"></div>
|
||||
<div class="nav-link project-link r-icon" data-i="arrow_right">CRISIS</div>
|
||||
</a>
|
||||
</div>
|
||||
<hr class="lighter">
|
||||
<a href="/experience" id="experience-button" class="nav-link white button">View all experiences.</a>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div id="footer-pad" class="dark width-pad">
|
||||
<footer>
|
||||
<h2>© 2022</h2>
|
||||
<div class="flex"></div>
|
||||
<a href="https://github.com/MajorDroolz" class="png-icon" target="_blank">
|
||||
<img src="/res/icons/github.png" alt="GitHub" width="30" height="30">
|
||||
</a>
|
||||
<a href="https://www.linkedin.com/in/maximhutz/" class="png-icon" target="_blank">
|
||||
<img src="/res/icons/linkedin.png" alt="LinkedIn" width="30" height="30">
|
||||
</a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link white icon" data-i="mail" aria-label="Contact" target="_blank"></a>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<dialog id="menu">
|
||||
<div class="light width-pad shadow">
|
||||
<div id="menu-inner">
|
||||
<div id="menu-top">
|
||||
<a href="/home" class="nav-link dark">MAX HUTZ</a>
|
||||
<div class="flex"></div>
|
||||
<form method="dialog">
|
||||
<button class="nav-link dark icon" data-i="close" aria-label="Close"></button>
|
||||
</form>
|
||||
</div>
|
||||
<a href="/experience" class="nav-link dark icon" data-i="work">Experience</a>
|
||||
<a href="/resume" class="nav-link dark icon" data-i="clinical_notes">Resume</a>
|
||||
<a href="mailto:maximhutz@gmail.com" class="nav-link dark icon" data-i="mail">Contact</a>
|
||||
</div>
|
||||
</div>
|
||||
</dialog>
|
||||
</body>
|
||||
</html>
|
||||
51
index.html
51
index.html
@@ -1,7 +1,44 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Refresh" content="0; url=resume">
|
||||
<link rel="stylesheet" href="/styles.css">
|
||||
</head>
|
||||
</html>
|
||||
---
|
||||
title: Home
|
||||
description: This is the home page of Maxim Voldman Hutz's personal website.
|
||||
layout: default
|
||||
---
|
||||
|
||||
{% assign home = site.data.home %}
|
||||
{% assign work = site.data.work %}
|
||||
|
||||
<section id="about" class="light back">
|
||||
<div class="flex"></div>
|
||||
<div class="flex"></div>
|
||||
<div>
|
||||
<h1>{{ home.welcome }}</h1>
|
||||
<i>{{ home.status }}</i>
|
||||
</div>
|
||||
<p id="about-me">{{ home.about }}</p>
|
||||
<hr class="darker">
|
||||
<nav>
|
||||
<div id="inner-nav">
|
||||
<a href="mailto:{{ home.email }}" class="nav-link blue button flex">{{ home.email }}</a>
|
||||
<a href="/resume" class="nav-link red button r-icon flex" data-i="arrow_right" target="_blank">View Resume</a>
|
||||
</div>
|
||||
<div class="space"></div>
|
||||
</nav>
|
||||
<div class="flex"></div>
|
||||
</section>
|
||||
|
||||
<!-- ----------------------------------------------------------------------- -->
|
||||
|
||||
<section id="projects" class="dark back">
|
||||
<h2>Worked on:</h2>
|
||||
<div id="project-list">
|
||||
{% for project in home.featured %}
|
||||
<a class="{{ work[project].color }} project-item shadow" href="/experience/{{ project }}">
|
||||
<div class="space"></div>
|
||||
<div class="nav-link project-link r-icon" data-i="arrow_right">{{ work[project].title }}: {{ work[project].subtitle }}
|
||||
</div>
|
||||
</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<hr class="lighter">
|
||||
<a href="/experiences" id="experience-button" class="nav-link white button">View all experiences.</a>
|
||||
</section>
|
||||
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
@@ -16,8 +16,8 @@
|
||||
">
|
||||
|
||||
<!-- Resume styling. -->
|
||||
<link rel="preload stylesheet" as="style" href="/styles.css">
|
||||
<link rel="preload stylesheet" as="style" href="index.css">
|
||||
<link rel="preload stylesheet" as="style" href="/styles/global.css">
|
||||
<link rel="preload stylesheet" as="style" href="/styles/resume.css">
|
||||
|
||||
<!-- Site's Icon -->
|
||||
<link rel="icon" type="image/png" href="/res/favicon.ico">
|
||||
30
styles/404.css
Normal file
30
styles/404.css
Normal file
@@ -0,0 +1,30 @@
|
||||
#notfound {
|
||||
--color: var(--dark) linear-gradient(#0000, #0003);
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: white;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
#notfound > * {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
#text-outer > i {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
#text-outer {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
#text-404 {
|
||||
font-size: 160px;
|
||||
line-height: 1;
|
||||
}
|
||||
@@ -1,5 +1,21 @@
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
background-image: linear-gradient(#0003 0% 50%, #0000 50% 100%),
|
||||
linear-gradient(var(--dark) 0% 50%, var(--light) 50% 100%);
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
width: min(100vw, 1024px);
|
||||
box-sizing: border-box;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------------------------*/
|
||||
|
||||
* {
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@@ -7,20 +23,6 @@ button {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
width: 100vw;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
html {
|
||||
overflow-y: scroll;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
.pre {
|
||||
all: unset;
|
||||
white-space: pre;
|
||||
@@ -96,6 +98,8 @@ hr {
|
||||
color: var(--color);
|
||||
position: relative;
|
||||
padding: 10px 30px;
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button::before {
|
||||
@@ -123,26 +127,6 @@ hr {
|
||||
|
||||
/*----------------------------------------------------------------------------*/
|
||||
|
||||
#header-outer {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
header {
|
||||
margin: auto;
|
||||
max-width: 1024px;
|
||||
display: flex;
|
||||
gap: 40px;
|
||||
font-size: 25px;
|
||||
font-family: "Open Sans";
|
||||
font-weight: bolder;
|
||||
color: var(--dark);
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#about {
|
||||
position: relative;
|
||||
margin: auto;
|
||||
@@ -151,9 +135,8 @@ header {
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
max-width: 1024px;
|
||||
min-height: 90vh;
|
||||
min-height: 85vh;
|
||||
color: var(--dark);
|
||||
padding-top: 30px;
|
||||
box-sizing: border-box;
|
||||
gap: 30px;
|
||||
}
|
||||
@@ -178,7 +161,7 @@ nav {
|
||||
/*----------------------------------------------------------------------------*/
|
||||
|
||||
#projects {
|
||||
margin: 30px auto;
|
||||
padding: 30px auto;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -220,19 +203,6 @@ nav {
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
#footer-pad {
|
||||
background: var(--dark) linear-gradient(#0002, #0002);
|
||||
}
|
||||
|
||||
footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
max-width: 1024px;
|
||||
margin: auto;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------------------------*/
|
||||
|
||||
#menu {
|
||||
12
styles/footer.css
Normal file
12
styles/footer.css
Normal file
@@ -0,0 +1,12 @@
|
||||
footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
max-width: 1024px;
|
||||
margin: auto;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
footer::before {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
@@ -18,6 +18,8 @@
|
||||
|
||||
--grad: linear-gradient(45deg, #F008, #00F8);
|
||||
--shadow: 0px 10px 50px 0 #0008;
|
||||
|
||||
--width: 1024px;
|
||||
}
|
||||
|
||||
.light { --color: var(--light) }
|
||||
@@ -28,11 +30,38 @@
|
||||
.blue { --color: var(--blue) }
|
||||
.white { --color: white }
|
||||
|
||||
.flex-space, .flex { flex-grow: 1 }
|
||||
.flex-space, .flex, br { flex-grow: 1 }
|
||||
.space { flex: 1000 }
|
||||
|
||||
/*----------------------------------------------------------------------------*/
|
||||
|
||||
html {
|
||||
background: var(--dark);
|
||||
background-color: var(--dark);
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------------------------*/
|
||||
|
||||
.back {
|
||||
position: relative;
|
||||
padding: 10px 20px;
|
||||
width: min(100vw, 1024px);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.back::before {
|
||||
background: var(--color);
|
||||
width: 100vw;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
content: "";
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.dark-back::before {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------------------------*/
|
||||
13
styles/header.css
Normal file
13
styles/header.css
Normal file
@@ -0,0 +1,13 @@
|
||||
header {
|
||||
position: sticky !important;
|
||||
top: 0;
|
||||
z-index: 10000;
|
||||
|
||||
display: flex;
|
||||
gap: 40px;
|
||||
font-size: 25px;
|
||||
font-family: "Open Sans";
|
||||
font-weight: bolder;
|
||||
color: var(--dark);
|
||||
align-items: center;
|
||||
}
|
||||
Reference in New Issue
Block a user