42 lines
1.5 KiB
JavaScript
42 lines
1.5 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
|
const navbarContainer = document.createElement('div');
|
|
navbarContainer.id = 'navbar-container';
|
|
document.body.insertBefore(navbarContainer, document.body.firstChild);
|
|
|
|
fetch('../src/navbar.html')
|
|
.then(response => response.text())
|
|
.then(data => {
|
|
navbarContainer.innerHTML = data;
|
|
|
|
const themeBtn = document.querySelector('.theme-btn');
|
|
const themeBall = document.querySelector('.theme-ball');
|
|
const btnMenu = document.querySelector('.btn-menu');
|
|
const sidebar = document.querySelector('.sidebar');
|
|
|
|
if (btnMenu && sidebar) {
|
|
btnMenu.addEventListener('click', () => {
|
|
sidebar.classList.toggle('expand');
|
|
});
|
|
}
|
|
|
|
if (themeBtn && themeBall) {
|
|
const localData = localStorage.getItem('theme');
|
|
if (localData === 'dark') {
|
|
document.body.classList.add('dark-mode');
|
|
themeBall.classList.add('dark');
|
|
}
|
|
|
|
themeBtn.addEventListener('click', () => {
|
|
document.body.classList.toggle('dark-mode');
|
|
themeBall.classList.toggle('dark');
|
|
if (document.body.classList.contains('dark-mode')) {
|
|
localStorage.setItem('theme', 'dark');
|
|
} else {
|
|
localStorage.setItem('theme', 'light');
|
|
}
|
|
});
|
|
}
|
|
})
|
|
.catch(error => console.error('Error loading the navbar:', error));
|
|
});
|
|
|