valknar/palina-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: prevent animation flickering and refine post card hover state
All checks were successful
Deploy Theme / deploy (push) Successful in 14s
Details

Browse Source
This commit is contained in:
Sebastian Krüger
2026-02-22 09:27:29 +01:00
parent 9d1b6dee52
commit 393b78a0e8
3 changed files with 18 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
assets/js/main.js
View File

@@ -20,12 +20,15 @@ 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');
// Global page fade-in animation - only on full boosted navigations
if (event.detail.boosted) {
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');
}
animateGridItems();
}
// If the settled element is the posts-container or contains grid items
@@ -33,10 +36,5 @@ document.addEventListener('DOMContentLoaded', () => {
if (target.id === 'posts-container' || target.querySelector('.post-grid-item')) {
animateGridItems(target);
}
// Handle global boost re-animation
if (event.detail.boosted) {
animateGridItems();
}
});
});