diff --git a/assets/js/main.js b/assets/js/main.js index a41b66b..5307091 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -4,6 +4,8 @@ document.addEventListener('DOMContentLoaded', () => { console.log('Palina theme loaded!'); + let lastUrl = window.location.pathname; + // Staggered fade-in animation for post grid const animateGridItems = (container = document) => { const gridItems = container.querySelectorAll('.post-grid-item:not(.animated)'); @@ -20,8 +22,10 @@ document.addEventListener('DOMContentLoaded', () => { // Re-run animation and other setup when HTMX settles new content // Use document instead of document.body to persist across boosted navigation document.addEventListener('htmx:afterSettle', (event) => { - // Global page fade-in animation - only on full boosted navigations - if (event.detail.boosted) { + const currentUrl = window.location.pathname; + + // Global page fade-in animation - only on full boosted navigations if the URL changed + if (event.detail.boosted && currentUrl !== lastUrl) { const mainContent = document.getElementById('main-content'); if (mainContent) { mainContent.classList.remove('animate-fadeInUp'); @@ -29,6 +33,7 @@ document.addEventListener('DOMContentLoaded', () => { mainContent.classList.add('animate-fadeInUp'); } animateGridItems(); + lastUrl = currentUrl; } // If the settled element is the posts-container or contains grid items