So in this JavaScript below I run addEventListener click on a button, if clicked it will add to the .sidebar active class.
const sidebarbtn = document.querySelector('#sidebar-btn');
const sidebar = document.querySelector('.sidebar');
sidebarbtn.addEventListener('click', function () {
sidebar.classList.toggle('active');
localStorage.setItem('sidebarActive', sidebar.classList.contains('active'));
});
document.addEventListener('DOMContentLoaded', function () {
const isSidebarActive = localStorage.getItem('sidebarActive') === 'true';
if (isSidebarActive) {
sidebar.classList.add('active');
}
});
Everything is working. If I open the sidebar and redirect using navbar to another page it will stay opened. The thing I am asking is more esthetical rather than functional.
When I navigate with opened sidebar, it will firstly load closed because it is default then it will open. The same thing happens with dark/light mode using the localStorage. Is there any solution to this?