From 0739d72334910edbd44b7f0d32febc141ae53b38 Mon Sep 17 00:00:00 2001 From: Kibi Kelburton Date: Sat, 25 Jul 2026 22:49:27 +0200 Subject: [PATCH] remove the fucking animations for new comments --- public/s/css/f0ckm.css | 65 ++--------------------------------------- public/s/js/comments.js | 25 ++++------------ 2 files changed, 8 insertions(+), 82 deletions(-) diff --git a/public/s/css/f0ckm.css b/public/s/css/f0ckm.css index 61f4451..60c9d2a 100644 --- a/public/s/css/f0ckm.css +++ b/public/s/css/f0ckm.css @@ -9636,77 +9636,16 @@ body.layout-legacy .comment-content img.emoji { max-width: 200px; } -@keyframes flashGreen { - 0% { - background-color: rgba(var(--accent-rgb), 0.3); - } - - 100% { - background-color: var(--item-bg); - } -} - -@keyframes newItemFlash { - 0% { - border-left-color: var(--accent); - background: rgba(var(--accent-rgb), 0.15); - } - - 60% { - border-left-color: var(--accent); - background: rgba(var(--accent-rgb), 0.05); - } - - 100% { - border-left-color: transparent; - background: transparent; - } -} - .new-item-fade { - animation: newItemFlash 2.5s ease forwards; - border-left: 3px solid transparent; + box-shadow: inset 3px 0px 0px var(--accent); } .sidebar-activity .new-item-fade { - border-left: none; - animation: none; + box-shadow: none; } -/* Comment posted by the current user — fades in + accent border that auto-disappears */ -@keyframes commentEnter { - 0% { - opacity: 0; - transform: translateY(6px); - border-left-color: var(--accent); - background: rgba(var(--accent-rgb), 0.15); - } - 20% { - opacity: 1; - transform: translateY(0); - border-left-color: var(--accent); - background: rgba(var(--accent-rgb), 0.15); - } - 60% { - background: rgba(var(--accent-rgb), 0.05); - } - - 70% { - border-left-color: var(--accent); - background: transparent; - } - - 100% { - border-left-color: transparent; - } -} - -.comment-entering { - animation: commentEnter 7.5s ease forwards; - border-left: 3px solid transparent; -} .comment-highlighted { box-shadow: inset 3px 0px 0px var(--accent) !important; diff --git a/public/s/js/comments.js b/public/s/js/comments.js index 547180e..5dfeb0f 100644 --- a/public/s/js/comments.js +++ b/public/s/js/comments.js @@ -858,26 +858,14 @@ class CommentSystem { * border-right) is fully restored after the effect completes. * * @param {Element} el - The .comment element to animate. - * @param {boolean} entering - True to also add 'comment-entering' (own post); - * false for 'new-item-fade' only (live others). + * @param {boolean} entering - Unused (kept for compatibility). */ static _animateNewComment(el, entering = false) { if (!el) return; - - const classes = entering - ? ['comment-entering', 'new-item-fade'] - : ['new-item-fade']; - - // Reset in case the element already has a stale animation - classes.forEach(c => el.classList.remove(c)); - void el.offsetWidth; // force reflow so re-adding the class restarts the animation - - classes.forEach(c => el.classList.add(c)); - - const cleanup = () => { - classes.forEach(c => el.classList.remove(c)); - }; - el.addEventListener('animationend', cleanup, { once: true }); + el.classList.add('new-item-fade'); + setTimeout(() => { + el.classList.remove('new-item-fade'); + }, 2500); } @@ -893,7 +881,6 @@ class CommentSystem { if (el) { // Remove highlight from any previously highlighted or newly-posted comment document.querySelectorAll('.comment-highlighted').forEach(c => c.classList.remove('comment-highlighted')); - document.querySelectorAll('.comment-entering').forEach(c => c.classList.remove('comment-entering')); document.querySelectorAll('.new-item-fade').forEach(c => c.classList.remove('new-item-fade')); // Always smooth-scroll so there's no jarring jump @@ -1039,7 +1026,7 @@ class CommentSystem { preview.dataset.id = targetId; // Remove temporary animation/highlight classes - preview.classList.remove('new-item-fade', 'comment-highlighted', 'comment-entering'); + preview.classList.remove('new-item-fade', 'comment-highlighted'); // Remove input forms or action buttons const actions = preview.querySelector('.comment-actions');