generated from Templates_CodeFirst/templateHtmlCss
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
1.9 KiB
69 lines
1.9 KiB
const disk = document.getElementById('profile');
|
|
|
|
let hovering = false;
|
|
let startTime = 0;
|
|
let speedInterval = null;
|
|
|
|
|
|
|
|
|
|
// Get the theme switch checkbox
|
|
|
|
const themeSwitch = document.getElementById('theme-switch');
|
|
|
|
// Function to set the theme
|
|
const setTheme = (isDark) => {
|
|
if (isDark) {
|
|
document.body.classList.add('dark-mode');
|
|
document.body.classList.remove('light-mode');
|
|
} else {
|
|
document.body.classList.add('light-mode');
|
|
document.body.classList.remove('dark-mode');
|
|
}
|
|
};
|
|
|
|
// Retrieve the saved theme from localStorage
|
|
const savedTheme = localStorage.getItem('theme');
|
|
if (savedTheme) {
|
|
const isDark = savedTheme === 'dark';
|
|
themeSwitch.checked = !isDark; // Set the switch position
|
|
setTheme(isDark);
|
|
} else {
|
|
setTheme(true); // Default to dark mode
|
|
}
|
|
|
|
// Listen for changes on the switch
|
|
themeSwitch.addEventListener('change', (e) => {
|
|
const isDark = !e.target.checked; // Light mode when checked
|
|
setTheme(isDark);
|
|
localStorage.setItem('theme', isDark ? 'dark' : 'light'); // Save preference
|
|
});
|
|
|
|
|
|
|
|
/* Project gallery animation (click on project to go to project page)*/
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
const projects = document.querySelectorAll(".article-wrapper");
|
|
|
|
projects.forEach((project) => {
|
|
project.addEventListener("click", function (event) {
|
|
event.preventDefault();
|
|
|
|
// Get the project name dynamically
|
|
const projectName = this.querySelector(".project-title").innerText.trim().toLowerCase().replace(/\s+/g, "_");
|
|
|
|
// Add animation class
|
|
this.classList.add("clicked");
|
|
|
|
// Wait for animation to finish, then redirect with project name in URL
|
|
setTimeout(() => {
|
|
document.body.classList.add("fade-out");
|
|
setTimeout(() => {
|
|
window.location.href = `project.html?name=${projectName}`;
|
|
}, 300);
|
|
}, 600);
|
|
});
|
|
});
|
|
});
|
|
|