andrew/asimonson1125.github.io
1
0
Fork 0
mirror of https://github.com/asimonson1125/asimonson1125.github.io.git synced 2026-02-25 05:09:49 -06:00
Code Issues Packages Projects Releases Wiki Activity

Stash skills hexgrid

Browse Source 
Might use hexgrid for projects instead
This commit is contained in:
Andrew Simonson
2022-10-08 13:13:26 -04:00
parent 253bbb26fe
commit 2e60042ece
5 changed files with 160 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
src/scripts/responsive.js
View File

@@ -1,51 +1,76 @@
window.onload = function () { onLoaded() };
window.onload = function () {
onLoaded();
};
function onLoaded() {
document.body.scrollTop = 0; // For Safari
document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
let navs = document.querySelectorAll('.navElement');
let navs = document.querySelectorAll(".navElement");
navs.forEach(function (element) {
element.onclick = function () {
window.scrollTo(0, 0);
toggleMenu();
}
};
});
window.onresize = function () { resizer() };
window.onresize = function () {
resizer();
};
resizer();
if (window.innerWidth < 1200) {
const e = document.querySelector(".navControl");
e.style.maxHeight = '0px';
e.style.maxHeight = "0px";
}
}
function resizer() {
const e = document.querySelector(".navControl");
if (window.innerWidth > 1200) { // desktop view
if (window.innerWidth > 1200) {
// desktop view
scrollFunction();
window.onscroll = function () { scrollFunction() };
window.onscroll = function () {
scrollFunction();
};
e.style.maxHeight = `${e.scrollHeight + 10}px`;
}
else { // mobile view
window.onscroll = '';
document.querySelector('.header').style.backgroundColor = '#1a1a1a';
document.querySelectorAll('.header .name h1').forEach(function(x){x.style.fontSize = "1.5rem";});
} else {
// mobile view
window.onscroll = "";
document.querySelector(".header").style.backgroundColor = "#1a1a1a";
document.querySelectorAll(".header .name h1").forEach(function (x) {
x.style.fontSize = "1.5rem";
});
// document.querySelector('.header > h1').style.color = "#ecebeb";
document.querySelector(".header").style.borderBottomWidth = '3px';
e.style.maxHeight = '0px';
document.querySelectorAll('.navElement *').forEach(x => { x.style.paddingTop = '.3rem'; x.style.paddingBottom = '.3rem'; x.style.fontSize = '1rem' });
document.querySelector(".header").style.borderBottomWidth = "3px";
e.style.maxHeight = "0px";
document.querySelectorAll(".navElement *").forEach((x) => {
x.style.paddingTop = ".3rem";
x.style.paddingBottom = ".3rem";
x.style.fontSize = "1rem";
});
}
}
function scrollFunction() {
if (document.body.scrollTop > 10 || document.documentElement.scrollTop > 10) {
document.querySelector('.header').style.backgroundColor = '#1a1a1a';
document.querySelectorAll('.header .name h1').forEach(function(x){x.style.fontSize = "1.5rem";});
document.querySelectorAll('.navElement *').forEach(x => { x.style.paddingTop = '.3rem'; x.style.paddingBottom = '.3rem'; x.style.fontSize = '1rem' });
document.querySelector(".header").style.backgroundColor = "#1a1a1a";
document.querySelectorAll(".header .name h1").forEach(function (x) {
x.style.fontSize = "1.5rem";
});
document.querySelectorAll(".navElement *").forEach((x) => {
x.style.paddingTop = ".3rem";
x.style.paddingBottom = ".3rem";
x.style.fontSize = "1rem";
});
} else {
document.querySelector('.header').style.backgroundColor = 'rgba(0,0,0,0)';
document.querySelectorAll('.header .name h1').forEach(function(x){x.style.fontSize = "2rem";});
document.querySelector(".header").style.backgroundColor = "rgba(0,0,0,0)";
document.querySelectorAll(".header .name h1").forEach(function (x) {
x.style.fontSize = "2rem";
});
// document.querySelector('.header > h1').style.color = "#ecebeb";
document.querySelectorAll('.navElement *').forEach(x => { x.style.paddingTop = '.5rem'; x.style.paddingBottom = '.5rem'; x.style.fontSize = '1.2rem' });
document.querySelectorAll(".navElement *").forEach((x) => {
x.style.paddingTop = ".5rem";
x.style.paddingBottom = ".5rem";
x.style.fontSize = "1.2rem";
});
}
}
@@ -53,12 +78,12 @@ export function toggleMenu() {
if (window.innerWidth < 1200) {
const e = document.querySelector(".navControl");
const bar = document.querySelector(".header");
if (e.style.maxHeight === '0px') {
if (e.style.maxHeight === "0px") {
e.style.maxHeight = `${e.scrollHeight + 10}px`;
bar.style.borderBottomWidth = '0px';
bar.style.borderBottomWidth = "0px";
} else {
e.style.maxHeight = '0px';
bar.style.borderBottomWidth = '3px';
e.style.maxHeight = "0px";
bar.style.borderBottomWidth = "3px";
}
}
}
}

29
src/scripts/skill.js
View File

@@ -1,3 +1,26 @@
export function skill(type){
document.getElementById('skillDisp').textContent = type;
}
let currentType = "";
const dict = {
'python': {'name': 'Python', 'info': 'Python and shit'},
'js': {'name': 'Javascript', 'info': 'JS and shit'},
'html': {'name': 'HTML/CSS', 'info': 'also SCSS'},
'sql': {'name': 'HTML/CSS', 'info': 'also SCSS'},
'cpp': {'name': 'HTML/CSS', 'info': 'also SCSS'},
'other': {'name': 'HTML/CSS', 'info': 'also SCSS'},
'tools': {'name': 'HTML/CSS', 'info': 'also SCSS'}
}
export function skill(type) {
if (currentType === type) {
return;
}
currentType = type;
let disp = document.getElementById("skillDisp");
disp.classList = [];
let ugh = disp.offsetWidth; // without this delay the animation doesn't begin. idfk.
disp.querySelector('h2').textContent = dict[type]['name'];
disp.querySelector('p').textContent = dict[type]['info'];
disp.classList.add(type);
disp.classList.add('swipeIn');
return ugh; // gets rid of unused variable warning
}