fortytwo/me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix misc bugs that i introduced by programming at 2am

Browse source 
the bugfixes are coming in at 3am so they should be fine
This commit is contained in:
Naman Sood 2022-10-24 03:02:17 -04:00
parent 6b742ec480
commit b8015af57d
3 changed files with 46 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

23
css/style.css
View file

@ -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 {
color: #ddd;
body.dark-mode .main h3 {
color: #aaa;
}
body.dark-mode .main a:before, body.dark-mode .main a:after {
background: rgba(221, 221, 221, 0.2);
body.dark-mode .main h3 a {
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 {

22
css/style.scss
View file

@ -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 {
color: #ddd;
h3 {
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;
}
}
}

24
js/script.js
View file

@ -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);
for(let i = 0; i < n; i++) {
dots[i].render();
}
ctx.clearRect(0, 0, canvas.width, canvas.height);
for(let i = 0; i < n; i++) {
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;