fix misc bugs that i introduced by programming at 2am

the bugfixes are coming in at 3am so they should be fine

css/style.css

@@ -12,20 +12,31 @@ body {
   font-family: "Nunito", sans-serif;
 }
 
+body.dark-mode {
+  background: black;
+  color: white;
+}
 body.dark-mode .bg {
   opacity: 0 !important;
 }
 body.dark-mode .main h1 {
-  color: #ddd;
+  color: #fff;
 }
 body.dark-mode .main em {
-  color: #ddd;
+  color: #fff;
 }
-body.dark-mode .main a {
+body.dark-mode .main h3 {
-  color: #ddd;
+  color: #aaa;
 }
-body.dark-mode .main a:before, body.dark-mode .main a:after {
+body.dark-mode .main h3 a {
-  background: rgba(221, 221, 221, 0.2);
+  color: #fff;
+}
+body.dark-mode .main h3 a:before, body.dark-mode .main h3 a:after {
+  background: rgba(255, 255, 255, 0.2);
+}
+body.dark-mode .main a.contact-method p {
+  color: #fff;
+  font-size: 1rem;
 }
 
 .main {

css/style.scss

@@ -13,26 +13,38 @@ body {
 }
 
 body.dark-mode {
+	background: black;
+	color: white;
+
 	.bg {
 		opacity: 0 !important;
 	}
 
 	.main {
 		h1 {
-			color: #ddd;
+			color: #fff;
 		}
 
 		em {
-			color: #ddd;
+			color: #fff;
 		}
 
-		a {
+		h3 {
-			color: #ddd;
+			color: #aaa;
+		}
+
+		h3 a {
+			color: #fff;
 
 			&:before, &:after {
-				background: rgba(#ddd, 0.2);
+				background: rgba(#fff, 0.2);
 			}
 		}
+
+		a.contact-method p {
+			color: #fff;
+			font-size: 1rem;
+		}
 	}
 }
 

js/script.js

@@ -4,6 +4,11 @@ canvas.width = window.innerWidth;
 canvas.height = window.innerHeight;
 
 const ctx = canvas.getContext('2d');
+const FILL_STYLES = {
+	light: 'rgba(0,0,0,0.05)',
+	dark: 'rgba(255,255,255,0.15)'
+}
+ctx.fillStyle = FILL_STYLES.light;
 
 addEventListener('resize', () => {
 	canvas.width = window.innerWidth;
@@ -30,11 +35,6 @@ function Point() {
 	
 	this.draw = function() {
 		if(this.progress >= 0) {
-			// opacity of of dot changes with progress
-			const isDarkMode = document.body.classList.contains('dark-mode');
-			const color = isDarkMode ? 255 : 0;
-			const multiplier = isDarkMode ? 0.05 : 0.005;
-			ctx.fillStyle = `rgba(${color}, ${color}, ${color}, ${Math.sqrt(this.progress*multiplier)})`;
 			ctx.beginPath();
 			// radius calculation: maps progress from [0, 1] to [0, pi],
 			// then takes sine of that to get an increase, then decrease
@@ -68,12 +68,10 @@ for(let i = 0; i < n; i++) {
 }
 
 function loop() {
-	if(window.scrollY <= window.innerHeight) {
+	ctx.clearRect(0, 0, canvas.width, canvas.height);
-		ctx.clearRect(0, 0, canvas.width, canvas.height);
 
-		for(let i = 0; i < n; i++) {
+	for(let i = 0; i < n; i++) {
-			dots[i].render();
+		dots[i].render();
-		}
 	}
 		
 	requestAnimationFrame(loop);
@@ -90,7 +88,7 @@ const birthday = {
 }
 const today = new Date();
 let age = today.getFullYear() - birthday.year;
-if(today.getMonth() <= birthday.month && today.getDate() < birthday.date) {
+if(today.getMonth() < birthday.month || (today.getMonth() == birthday.month && today.getDate() < birthday.date)) {
 	--age;
 }
 const tens = ['', ' ten plus', ' twenty', ' thirty', ' forty', ' fifty', ' sixty', ' seventy', 'n eighty', ' ninety'];
@@ -123,10 +121,12 @@ addEventListener('keypress', e => {
 		setTimeout(() => {
 			if(mode === 1) {
 				document.body.classList.remove('dark-mode');
+				ctx.fillStyle = FILL_STYLES.light;
 				mode = 0;
 			}
 			else {
 				document.body.classList.add('dark-mode');
+				ctx.fillStyle = FILL_STYLES.dark;
 				mode = 1;
 			}
 			eei = 0;