fix(chan): remove onara card highlight when closing onara modal

This commit is contained in:
2026-09-26 15:45:18 +02:00
parent 62f0fbde63
commit 875bc9fef2
2 changed files with 28 additions and 6 deletions
+26 -4
View File
@@ -325,9 +325,7 @@
background: rgba(26, 26, 31, 0.88);
border-color: rgba(255, 255, 255, 0.08);
}
.chan-post-card:target,
.chan-post-card.active-thread-post,
.chan-post-card.onara-active {
.chan-post-card:target {
border-color: #4ade80 !important;
background: rgba(74, 222, 128, 0.08) !important;
box-shadow: 0 0 0 2px rgba(74, 222, 128, 0.5), 0 0 20px rgba(74, 222, 128, 0.25) !important;
@@ -356,7 +354,7 @@
position: relative;
z-index: 6;
}
.chan-thumb-link.onara-active .chan-thumb-img {
body.onara-modal-open:not(.onara-modal-closing) .chan-thumb-link.onara-active .chan-thumb-img {
box-shadow: 0 0 0 2px #4ade80, 0 0 15px rgba(74, 222, 128, 0.6) !important;
}
@@ -373,6 +371,17 @@ body.onara-modal-open:not(.onara-modal-closing) .chan-post-card.active-thread-po
z-index: 52 !important;
transition: box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease !important;
}
body.onara-modal-closing .chan-post-card.onara-active,
body.onara-modal-closing .chan-post-card.active-thread-post {
opacity: 1 !important;
border-color: rgba(255, 255, 255, 0.08) !important;
box-shadow: none !important;
transition: box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease !important;
}
body.onara-modal-closing .chan-thumb-link.onara-active .chan-thumb-img {
box-shadow: none !important;
transition: box-shadow 0.25s ease !important;
}
.chan-post-rehosted-pill {
display: inline-flex;
@@ -1200,6 +1209,19 @@ body.onara-modal-open:not(.onara-modal-closing) .chan-post-card.active-thread-po
}
}
};
// Clear active card highlight whenever onara modal closes
const clearOnaraActiveCards = () => {
if (!document.body.classList.contains('onara-modal-open')) {
document.querySelectorAll('.chan-post-card.active-thread-post, .chan-post-card.onara-active, .chan-thumb-link.onara-active').forEach(el => {
el.classList.remove('active-thread-post', 'onara-active');
});
}
};
const bodyObserver = new MutationObserver(() => {
clearOnaraActiveCards();
});
bodyObserver.observe(document.body, { attributes: true, attributeFilter: ['class'] });
jumpToInitialActive();
setTimeout(jumpToInitialActive, 100);
})();