...

3 files changed, 20 insertions, 8 deletions

diff --git a/FrontEnd/src/app/utilities/useReverseScrollPositionRemember.ts b/FrontEnd/src/app/utilities/useReverseScrollPositionRemember.ts
index 8a2bd7a0..67c7c458 100644
--- a/FrontEnd/src/app/utilities/useReverseScrollPositionRemember.ts
+++ b/FrontEnd/src/app/utilities/useReverseScrollPositionRemember.ts
@@ -7,19 +7,31 @@ export default function useReverseScrollPositionRemember(): void {
     if (on) return;
     on = true;
 
-    let scrollPosition =
-      document.documentElement.scrollHeight -
-      document.documentElement.scrollTop;
-
+    function getScrollPosition(): number {
+      if (document.documentElement.scrollHeight <= window.innerHeight) {
+        return 0;
+      } else {
+        return (
+          document.documentElement.scrollHeight -
+          document.documentElement.scrollTop -
+          window.innerHeight
+        );
+      }
+    }
+
+    let scrollPosition = getScrollPosition();
     const scrollListener = (): void => {
-      scrollPosition = document.documentElement.scrollHeight - window.scrollY;
+      scrollPosition = getScrollPosition();
     };
 
     window.addEventListener("scroll", scrollListener);
 
     const resizeObserver = new ResizeObserver(() => {
+      if (document.documentElement.scrollHeight <= window.innerHeight) return;
       document.documentElement.scrollTop =
-        document.documentElement.scrollHeight - scrollPosition;
+        document.documentElement.scrollHeight -
+        window.innerHeight -
+        scrollPosition;
     });
 
     resizeObserver.observe(document.documentElement);
diff --git a/FrontEnd/src/app/views/timeline-common/TimelinePostView.tsx b/FrontEnd/src/app/views/timeline-common/TimelinePostView.tsx
index 4f9c6e97..fd59203a 100644
--- a/FrontEnd/src/app/views/timeline-common/TimelinePostView.tsx
+++ b/FrontEnd/src/app/views/timeline-common/TimelinePostView.tsx
@@ -34,7 +34,7 @@ const TimelinePostView: React.FC<TimelinePostViewProps> = (props) => {
   const cardRef = React.useRef<HTMLDivElement>(null!);
   React.useEffect(() => {
     const cardIntersectionObserver = new IntersectionObserver(([e]) => {
-      if (e.isIntersecting) {
+      if (e.intersectionRatio > 0) {
         cardRef.current.style.animationName = "timeline-post-enter";
       }
     });
diff --git a/FrontEnd/src/app/views/timeline-common/timeline-common.sass b/FrontEnd/src/app/views/timeline-common/timeline-common.sass
index e570b4b4..3734ba25 100644
--- a/FrontEnd/src/app/views/timeline-common/timeline-common.sass
+++ b/FrontEnd/src/app/views/timeline-common/timeline-common.sass
@@ -149,7 +149,7 @@ $timeline-line-color-current: #36c2e6
   position: relative
   padding: 0.3em 0.5em 1em 4em
   transition: background 0.5s, padding-left 0.5s
-  animation: 0.4s forwards
+  animation: 0.6s forwards
   opacity: 0
 
   @include media-breakpoint-down(sm)