feat: apply global fadeInUp animation to all page transitions
All checks were successful
Deploy Theme / deploy (push) Successful in 16s

This commit is contained in:
2026-02-21 20:12:26 +01:00
parent fce691fa9c
commit 1d5d9c0904
6 changed files with 13 additions and 5 deletions

View File

@@ -20,6 +20,14 @@ 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
const mainContent = document.getElementById('main-content');
if (mainContent) {
mainContent.classList.remove('animate-fadeInUp');
void mainContent.offsetWidth; // Force reflow to restart animation
mainContent.classList.add('animate-fadeInUp');
}
// If the settled element is the posts-container or contains grid items
const target = event.detail.target;
if (target.id === 'posts-container' || target.querySelector('.post-grid-item')) {