commit 38945cc2b402ea80d0d7de23bb6d1383203ad4ff Author: nolan Date: Thu May 15 21:42:42 2025 -0400 Initial commit diff --git a/html/css/style.css b/html/css/style.css new file mode 100644 index 0000000..ed8b4cc --- /dev/null +++ b/html/css/style.css @@ -0,0 +1,333 @@ +:root{ + --black: #141414; + --dark-grey: #1f1f1f; + --light-grey: #333333; + --white: #e6e6e6; + --highlight: #8d3dc2; + --transition-speed: 0.4s; +} +body{ + background-color: var(--black); + color: var(--white); + transition: color var(--transition-speed), background-color var(--transition-speed); + font-family: "Balthazar", serif; +} +a{ + color: var(--highlight); +} +h1, h2, h3, h4, h5, h6{ + text-align: center; + margin-bottom: 5px; + color: var(--highlight); + font-family: "Germania One", system-ui; +} +h1{ + font-size: 36px; +} +h2{ + font-size: 28px; +} +h3{ + font-size: 22px; +} +h4{ + font-size: 19px; +} +h5{ + font-size: 16px; +} +h6{ + font-size: 13px; +} +header{ + position: fixed; + top: 0px; + left: 0px; + right: 0px; + background-color: var(--dark-grey); + display: flex; + flex-direction: row; + height: 8%; + align-items: center; + transition: background-color var(--transition-speed); +} +hr{ + border-color: var(--highlight); + width: 90%; +} +p{ + margin: 5px; + padding: 5px; + font-size: 18px; +} +.box{ + background-color: var(--dark-grey); + border-radius: 15px; + margin: auto; + transition: background-color var(--transition-speed); +} +.hflex{ + display: flex; + flex-direction: row; + align-items: center; +} +.vflex{ + display: flex; + flex-direction: column; + align-items: center; +} +.button{ + background-color: var(--light-grey); + color: var(--white); + height: 35px; + padding: 10px; + margin: 5px; + text-decoration: none; + border-radius: 10px; + display: flex; + flex-direction: row; + align-items: center; + font-size: 20px; + transition: var(--transition-speed); +} +.button:hover{ + background-color: var(--black); + color: var(--highlight); + transition: var(--transition-speed); +} +.header-button{ + background-color: var(--light-grey); + color: var(--white); + height: 50%; + margin: auto; + margin-left: 10px; + text-decoration: none; + border-radius: 10px; + display: flex; + flex-direction: row; + align-items: center; + font-size: 20px; + transition: var(--transition-speed); +} +.header-button:hover{ + background-color: var(--black); + color: var(--highlight); + transition: var(--transition-speed); +} +.inline-logo{ + height: 30px; + margin-right: 10px; + border-radius: 10px; +} +.logo{ + height: 80%; + margin: 5px; + position: absolute; + transition: var(--transition-speed); +} +.logo:hover{ + height: 90%; + margin: 2px; + transition: var(--transition-speed); +} +.header-logo{ + height: 100%; + border-radius: 10px; +} +.center-flex{ + margin: auto; + display: flex; + flex-direction: row; + align-items: center; +} +.small{ + font-size: 11px; + font-weight: normal; +} +.site-icon{ + margin: auto; +} +.icon-image{ + border-radius: 5px; +} +.left{ + display: block; + width: 70%; + margin: auto; + margin-left: 7px; + text-align: left; +} +.right{ + display: block; + width: 70%; + margin: auto; + margin-right: 7px; + text-align: right; +} +.about-image-v{ + width: 100px; + padding: 10px; + border-radius: 20px; +} +.about-image-h{ + width: auto; + height: 150px; + padding: 10px; + border-radius: 20px; +} +.lfloat{ + position: static; + float: left; +} +.rfloat{ + position: static; + float: right; +} + +#brightness{ + flex-basis: 0%; + height: 100%; + background-color: transparent; + border-width: 0px; +} +#brightness-icon{ + height: 100%; + border-radius: 10px; +} + +@media screen and (max-width: 700px){ + .button{ + width: 60%; + } + .header-button{ + padding: 5px 10px 5px 60px; + } + .thin{ + width: 90%; + } + .medium{ + + } + .wide{ + + } + .spacer{ + height: 80px; + } + .site-icon{ + height: 40px; + } + .icon-image{ + height: 34px; + margin: 3px; + } +} +@media screen and (max-width: 1100px) and (min-width: 700px){ + .button{ + width: 52%; + } + .header-button{ + padding: 5px 10px 5px 70px; + } + .thin{ + width: 60%; + } + .medium{ + + } + .wide{ + + } + .spacer{ + height: 90px; + } + .site-icon{ + height: 44px; + } + .icon-image{ + height: 38px; + margin: 3px; + } +} +@media screen and (max-width: 1600px) and (min-width: 1100px){ + .button{ + width: 50%; + } + .header-button{ + padding: 5px 10px 5px 80px; + } + .thin{ + width: 35%; + } + .medium{ + + } + .wide{ + + } + .spacer{ + height: 90px; + } + .site-icon{ + height: 50px; + } + .icon-image{ + height: 40px; + margin: 5px; + } +} +@media screen and (max-width: 2000px) and (min-width: 1600px){ + .button{ + width: 45%; + } + .header-button{ + padding: 5px 10px 5px 80px; + } + .thin{ + width: 25%; + } + .medium{ + + } + .wide{ + + } + .spacer{ + height: 100px; + } + .site-icon{ + height: 50px; + margin: auto; + } + .icon-image{ + height: 40px; + margin: 5px; + } +} +@media screen and (min-width: 2000px){ + .button{ + width: 45%; + } + .header-button{ + padding: 5px 10px 5px 100px; + } + .thin{ + width: 20%; + } + .medium{ + + } + .wide{ + + } + .spacer{ + height: 120px; + } + .site-icon{ + height: 60px; + } + .icon-image{ + height: 44px; + margin: 8px; + } +} diff --git a/html/etc/FancyResume.pdf b/html/etc/FancyResume.pdf new file mode 100644 index 0000000..259e383 Binary files /dev/null and b/html/etc/FancyResume.pdf differ diff --git a/html/images/Gitea_Logo.svg b/html/images/Gitea_Logo.svg new file mode 100644 index 0000000..7ed0012 --- /dev/null +++ b/html/images/Gitea_Logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/html/images/LI-In-Bug.png b/html/images/LI-In-Bug.png new file mode 100644 index 0000000..8bc2d53 Binary files /dev/null and b/html/images/LI-In-Bug.png differ diff --git a/html/images/YdrBeQ.png b/html/images/YdrBeQ.png new file mode 100644 index 0000000..d3de2d2 Binary files /dev/null and b/html/images/YdrBeQ.png differ diff --git a/html/images/Ymi3pl.png b/html/images/Ymi3pl.png new file mode 100644 index 0000000..1d46e55 Binary files /dev/null and b/html/images/Ymi3pl.png differ diff --git a/html/images/audiobookshelf.svg b/html/images/audiobookshelf.svg new file mode 100644 index 0000000..91b2570 --- /dev/null +++ b/html/images/audiobookshelf.svg @@ -0,0 +1,41 @@ + + +bgAsset 6 + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/html/images/codewars.svg b/html/images/codewars.svg new file mode 100644 index 0000000..fcb61b4 --- /dev/null +++ b/html/images/codewars.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/html/images/croak.png b/html/images/croak.png new file mode 100644 index 0000000..3f2e5d5 Binary files /dev/null and b/html/images/croak.png differ diff --git a/html/images/darkMode.png b/html/images/darkMode.png new file mode 100644 index 0000000..6b7dcbb Binary files /dev/null and b/html/images/darkMode.png differ diff --git a/html/images/extra-nerd.jpg b/html/images/extra-nerd.jpg new file mode 100644 index 0000000..3c9e2e9 Binary files /dev/null and b/html/images/extra-nerd.jpg differ diff --git a/html/images/fooocus.ico b/html/images/fooocus.ico new file mode 100644 index 0000000..409703a Binary files /dev/null and b/html/images/fooocus.ico differ diff --git a/html/images/github-mark-white.svg b/html/images/github-mark-white.svg new file mode 100644 index 0000000..d5e6491 --- /dev/null +++ b/html/images/github-mark-white.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/html/images/immich.svg b/html/images/immich.svg new file mode 100644 index 0000000..39f36a4 --- /dev/null +++ b/html/images/immich.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/html/images/itchio-logo-textless-white.svg b/html/images/itchio-logo-textless-white.svg new file mode 100644 index 0000000..0426462 --- /dev/null +++ b/html/images/itchio-logo-textless-white.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/html/images/jellyfin.svg b/html/images/jellyfin.svg new file mode 100644 index 0000000..d4d7f01 --- /dev/null +++ b/html/images/jellyfin.svg @@ -0,0 +1,24 @@ + + + + + + + + + + icon-transparent + + + + + diff --git a/html/images/lightMode.png b/html/images/lightMode.png new file mode 100644 index 0000000..ab72af2 Binary files /dev/null and b/html/images/lightMode.png differ diff --git a/html/images/minecraft.ico b/html/images/minecraft.ico new file mode 100644 index 0000000..5e7f357 Binary files /dev/null and b/html/images/minecraft.ico differ diff --git a/html/images/nerd.jpg b/html/images/nerd.jpg new file mode 100644 index 0000000..7c5c045 Binary files /dev/null and b/html/images/nerd.jpg differ diff --git a/html/images/nextcloud-logo.svg b/html/images/nextcloud-logo.svg new file mode 100644 index 0000000..06e8269 --- /dev/null +++ b/html/images/nextcloud-logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/html/images/nolanLogo.png b/html/images/nolanLogo.png new file mode 100644 index 0000000..7ddddce Binary files /dev/null and b/html/images/nolanLogo.png differ diff --git a/html/images/speedin.png b/html/images/speedin.png new file mode 100644 index 0000000..a3e47ee Binary files /dev/null and b/html/images/speedin.png differ diff --git a/html/images/steam.png b/html/images/steam.png new file mode 100644 index 0000000..0cca096 Binary files /dev/null and b/html/images/steam.png differ diff --git a/html/images/water.png b/html/images/water.png new file mode 100644 index 0000000..d261610 Binary files /dev/null and b/html/images/water.png differ diff --git a/html/index.html b/html/index.html new file mode 100644 index 0000000..0efb065 --- /dev/null +++ b/html/index.html @@ -0,0 +1,50 @@ + + + + + + Hub + + + + + + + + + +
+ + Link Hub + +
+
+
+

Hub

+
+

Sites (Coming Soon)

+ Portfolio + Resume + Server Monitor + Minecraft + About +
+

Services

+ Audiobookshelf + Gitea + Immich + Jellyfin + Nextcloud +
+
+
+
+ Github link + Gitea link + Codewars link + Itch.io link + Steam link + Linkedin link +
+ + \ No newline at end of file diff --git a/html/js/colors.js b/html/js/colors.js new file mode 100644 index 0000000..78b7e0b --- /dev/null +++ b/html/js/colors.js @@ -0,0 +1,39 @@ +var root = document.querySelector(':root'); +if (localStorage.colorMode){ + if (localStorage.colorMode == '1'){ + root.style.setProperty("--transition-speed", "0s"); + root.style.setProperty("--black", "#efefef"); + root.style.setProperty("--dark-grey", "#cbcbcb"); + root.style.setProperty("--light-grey", "#a9a9a9"); + root.style.setProperty("--white", "#141414"); + } +}else{ + localStorage.colorMode = '0'; +} + +window.addEventListener("load", function(){ + var toggle = document.getElementById("brightness-icon"); + if (this.localStorage.colorMode == '1'){ + toggle.src = "/images/lightMode.png"; + root.style.setProperty("--transition-speed", "0.4s"); + } +}); + +function toggleBrightness(){ + var toggle = document.getElementById("brightness-icon"); + if (getComputedStyle(root).getPropertyValue('--black') == "#141414"){ + root.style.setProperty("--black", "#efefef"); + root.style.setProperty("--dark-grey", "#cbcbcb"); + root.style.setProperty("--light-grey", "#a9a9a9"); + root.style.setProperty("--white", "#141414"); + toggle.src = "/images/lightMode.png" + localStorage.colorMode = '1'; + }else{ + root.style.setProperty("--black", "#141414"); + root.style.setProperty("--dark-grey", "#1f1f1f"); + root.style.setProperty("--light-grey", "#333333"); + root.style.setProperty("--white", "#e6e6e6"); + toggle.src = "/images/darkMode.png" + localStorage.colorMode = '0'; + } +} \ No newline at end of file diff --git a/html/pages/about.html b/html/pages/about.html new file mode 100644 index 0000000..2acd29d --- /dev/null +++ b/html/pages/about.html @@ -0,0 +1,86 @@ + + + + + + About + + + + + + + + + +
+ + Link Hub + +
+
+
+

About

+
+
+
+

Overview

+
+ Photo of Nolan Casey +

+ Hi! My name is Nolan Casey. This website is developed and hosted by me, all on my own hardware! I made it to serve a couple of purposes.

+ First, I wanted a hub for all of my self-hosted services. Rather than remembering port numbers and IPs, I figured it would be easier + to set up a reverse proxy with a website with links to everything.

+ Second, I wanted a place for recruiters to see what I can actually do. That is the major reason for this about page and the portfolio page. +

+
+
+
+

About Me

+
+ Photo of Nolan Casey +

+ I am a computer science major and will be graduating from Michigan Tech in December of 2025. I live in Ithaca, Michigan, also known as + the big corn field in the middle of Michigan. I am a pretty big nerd, considering my hobbies are programming, video games, D&D, and + managing linux servers and services, but I also enjoy hiking and camping.

+ I have worked in IT for about 3 years, from both high school and college, and I have had 3 software development internships at Nexteer + Automotive. I also have an undergraduate research position working on augmented reality keyboards. For more specifics, see my + resume.

+

+
+
+

Services

+
+

+ Many of the services I have running are not self-explanatory by their names, and I also want to give credit to those who made them, + so here I will cover the different services I host.

+ Audiobookshelf is one of the few self-explanatory + services here. It is a bookshelf for audiobooks. It has a ton of features and a mobile app, so if you have audiobooks that you want to + host, I highly recommend this.

+ Gitea is a self-hosted github alternative. It focuses on + being lightweight and simple to use. It is what I use for my personal repositories. If you want to browse my repositories, click on the 'Explore' + option in the Gitea menu. This will show all of my public repositories.

+ Immich is a self-hosted alternative to Google + Photos, and does a really good job at it. Both the UI and featureset are almost identical to Google's solution, but this one is controlled + by you.

+ Jellyfin is a self-hosted streaming service. It + supports things like movies, shows, music, and more. It is really useful for backing up your DvD and CD collection, and lets you access them + anywhere.

+ Nextcloud is almost a google services replacement. I use + it for hosting large files to send to people, but it comes built-in with things like folder sync, calendar, photos, and a lot more. There is + also a plugin manager to add even more features than it has by default. +

+
+
+
+
+
+ Github link + Gitea link + Codewars link + Itch.io link + Steam link + Linkedin link +
+ + \ No newline at end of file diff --git a/html/pages/minecraft.html b/html/pages/minecraft.html new file mode 100644 index 0000000..f709912 --- /dev/null +++ b/html/pages/minecraft.html @@ -0,0 +1,37 @@ + + + + + + Minecraft Monitor + + + + + + + + + +
+ + Link Hub + +
+
+
+

Minecraft

+
+

Coming Soon TM

+
+
+
+ Github link + Gitea link + Codewars link + Itch.io link + Steam link + Linkedin link +
+ + \ No newline at end of file diff --git a/html/pages/monitor.html b/html/pages/monitor.html new file mode 100644 index 0000000..68ba6a5 --- /dev/null +++ b/html/pages/monitor.html @@ -0,0 +1,37 @@ + + + + + + Server Monitor + + + + + + + + + +
+ + Link Hub + +
+
+
+

Server Monitor

+
+

Coming Soon TM

+
+
+
+ Github link + Gitea link + Codewars link + Itch.io link + Steam link + Linkedin link +
+ + \ No newline at end of file diff --git a/html/pages/portfolio.html b/html/pages/portfolio.html new file mode 100644 index 0000000..cacaa21 --- /dev/null +++ b/html/pages/portfolio.html @@ -0,0 +1,135 @@ + + + + + + Nolan Casey Portfolio + + + + + + + + + +
+ + Link Hub + +
+
+
+

Portfolio

+
+

+ Welcome to my portfolio! Here I will have links to my public projects and their source code (if available). +

+
+
+

Water Shader

+
Category: Classwork
+
+ + +

+ This project was made for CS5641 Immersive Virtual Environments. It consisted of me researching how + different water shaders were made and experimenting with making some myself. I also worked on a buoyancy + algorithm, but only one was finished. None of the shaders turned out quite how I wanted, but I learned + a ton about how these kinds of shaders work.

+ In the end, the things I have functional are a sum of sines approach using e^sin as the wave, and a sum + of sines approach using gerstner waves as the wave. The e^sin shader also has a compatible buoyancy algorithm. +

+
Links
+

+ Source Code +

+
+
+
+

Croak Counter

+
Category: Classwork
+
+ Croak Counter home page +

+ Croak Counter was a group project for CS4760 User Interface Design and Implementation class. I worked mainly on interacting with + Google spreadsheets and storing survey data with local storage. I also worked on creating the survey pages. Most of the styling + was handled by my teammates.

+ As for functionality, Croak Counter serves as a way for citizen scientists to provide information on frog populations to + frog scientists in the Keewenaw. The site provides information on different frog calls, their mating seasons, and instructions + on how to conduct a survey. Users confident in their ability to identify frogs based on their calls can use the advanced form, + while the novice form just allows for a general "how many frogs do you hear" selector. +

+
Links
+

+ Github Deploy +

+
+
+
+

Speedin' Santa

+
Category: Game Jam
+
+ Speedin' Santa cover art +

+ Speedin' Santa is a game I made in one month for a game jam. The theme was special delivery, and since it was a + December game jam, I decided to go with a Christmas theme. The gameplay consists of steering Rudolph through rings + that give a speed boost, while avoiding rings that slow you down. In order to score points, you have to make stops + at marked houses and help Santa down the chimney.

+ The game was made using Godot 4.3 and is available to play in your web browser. +

+
Links
+

+ Itch.io | + Source Code +

+
+
+
+

Shorty Shooters

+
Category: Husky Game Development
+
+ Shorty Shooters gameplay +

+ Shorty Shooters is a game that we made in Husky Game Development. It was created using Godot 4.3. We spent one semester working on it, + before most of the developers had to leave the enterprise for various reasons.

+ The game is a mix of a 2D shooter and a 2D fighting game. Each player controls a little guy. The movement options are fairly limited. + The little guys can run side to side slowly, jump, and wall jump. The real movement options come into play once you grab a gun. Due to + these guys being little, they can be launched around by the recoil of the guns. + There are a lot of details I could go into about this game, but I will leave it for you to discover the features and quirks. I will say + that it is more fun than expected to get in a lobby with some friends and launch yourselves around for an hour.

+ I handled all of the multiplayer code for the game, as well as tweaking features and fixing issues gamewide. +

+
Links
+

+ Itch.io | + Source Code +

+
+
+
+

Raise Your Wand

+
Category: Game Jam
+
+ Raise Your Wand gameplay +

+ Raise Your Wand is the first game I ever submitted to a game jam. +

+
Links
+

+ Itch.io | + Source Code +

+
+
+
+
+ Github link + Gitea link + Codewars link + Itch.io link + Steam link + Linkedin link +
+ + \ No newline at end of file