tben/personal-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refined color overlays

Browse Source
This commit is contained in:
BenjaminToby 2021-05-25 21:57:19 +01:00
parent 43eaa49ddb
commit 6b8ff48559
2 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
main.css
View File

@ -358,6 +358,7 @@ section.hero-section {
top: 0; top: 0;
left: 0; left: 0;
transition: all .3s ease-out; transition: all .3s ease-out;
z-index: 100;
} }

9
scripts/main.js
View File

@ -47,19 +47,20 @@ document.querySelectorAll(".hero-content-link").forEach(item => {
}); });
document.getElementById("ui-ux-design").addEventListener("mouseover", () => { document.getElementById("ui-ux-design").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#A5E6BA";
setTimeout(() => {document.getElementById("color-overlay").style.backgroundColor = "#A5E6BA";}, 400);
}); });
document.getElementById("web-design").addEventListener("mouseover", () => { document.getElementById("web-design").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#5B2A86"; setTimeout(() => {document.getElementById("color-overlay").style.backgroundColor = "#5B2A86";}, 400);
}); });
document.getElementById("frontend-dev").addEventListener("mouseover", () => { document.getElementById("frontend-dev").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#7785AC"; setTimeout(() => {document.getElementById("color-overlay").style.backgroundColor = "#7785AC";}, 400);
}); });
document.getElementById("graphic-design").addEventListener("mouseover", () => { document.getElementById("graphic-design").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#9AC6C5"; setTimeout(() => {document.getElementById("color-overlay").style.backgroundColor = "#9AC6C5";}, 400);
}); });