Mathieu MoranandCopilot
3c3c8bba71
Suppress CSS transitions during initial state restore from localStorage. Re-enable after two rAF frames so the toggle button still animates smoothly. Co-authored-by: Copilot <[email protected]>
41 lines
1.5 KiB
JavaScript
41 lines
1.5 KiB
JavaScript
(function () {
|
|
'use strict';
|
|
|
|
const COLLAPSED_KEY = 'sidebar-collapsed';
|
|
const sidebar = document.getElementById('app-sidebar');
|
|
const contentWrapper = document.getElementById('content-wrapper');
|
|
const toggleBtn = document.getElementById('sidebarToggle');
|
|
|
|
if (!sidebar) return;
|
|
|
|
function applyCollapsed(collapsed) {
|
|
sidebar.classList.toggle('collapsed', collapsed);
|
|
contentWrapper.classList.toggle('sidebar-collapsed', collapsed);
|
|
const icon = toggleBtn && toggleBtn.querySelector('i');
|
|
if (icon) {
|
|
icon.className = collapsed ? 'fas fa-chevron-right' : 'fas fa-chevron-left';
|
|
}
|
|
}
|
|
|
|
// Restore saved state instantly — suppress transitions so there's no
|
|
// collapse animation flash on every page navigation.
|
|
sidebar.style.transition = 'none';
|
|
contentWrapper.style.transition = 'none';
|
|
applyCollapsed(localStorage.getItem(COLLAPSED_KEY) === '1');
|
|
// Re-enable transitions after one frame so the toggle button still animates.
|
|
requestAnimationFrame(function () {
|
|
requestAnimationFrame(function () {
|
|
sidebar.style.transition = '';
|
|
contentWrapper.style.transition = '';
|
|
});
|
|
});
|
|
|
|
if (toggleBtn) {
|
|
toggleBtn.addEventListener('click', function () {
|
|
const nowCollapsed = !sidebar.classList.contains('collapsed');
|
|
applyCollapsed(nowCollapsed);
|
|
localStorage.setItem(COLLAPSED_KEY, nowCollapsed ? '1' : '0');
|
|
});
|
|
}
|
|
})();
|