Merge pull request 'master' (#19) from master into 98

Reviewed-on: #19

docker-compose.yml

@@ -99,6 +99,8 @@ services:
     container_name: f0ckm-nginx
     profiles:
       - f0ckm-nginx
+    environment:
+      - ENABLE_IPV6=true
     ports:
       - "80:80"
       - "443:443"

public/s/css/f0ckm.css

@@ -9918,77 +9918,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;
+  box-shadow: inset 3px 0px 0px var(--accent);
-  border-left: 3px solid transparent;
 }
 
 .sidebar-activity .new-item-fade {
-  border-left: none;
+  box-shadow: none;
-  animation: 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;

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);
+     * @param {boolean} entering - Unused (kept for compatibility).
-     *                             false for 'new-item-fade' only (live others).
      */
     static _animateNewComment(el, entering = false) {
         if (!el) return;
-
+        el.classList.add('new-item-fade');
-        const classes = entering
+        setTimeout(() => {
-            ? ['comment-entering', 'new-item-fade']
+            el.classList.remove('new-item-fade');
-            : ['new-item-fade'];
+        }, 2500);
-
-        // 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 });
     }
 
 
@@ -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');