Fixed scrolling to comments (#449)

src/components/Article/Comment/Comment.module.scss

@@ -179,6 +179,10 @@
   @include font-size(1.2rem);
 }
 
+.commentAuthor {
+  margin-right: 2rem;
+}
+
 .articleAuthor {
   @include font-size(1.2rem);
 

src/components/Article/CommentDate/CommentDate.module.scss

@@ -3,14 +3,11 @@
 
   color: var(--secondary-color);
   display: flex;
-  align-items: flex-start;
-  justify-content: flex-start;
+  justify-content: center;
   flex-direction: column;
-  gap: .5rem;
   flex: 1;
   flex-wrap: wrap;
   font-size: 1.2rem;
-  margin-bottom: .5rem;
 
   .date {
     font-weight: 500;

src/components/Article/FullArticle.tsx

@@ -60,7 +60,7 @@ export type ArticlePageSearchParams = {
 const scrollTo = (el: HTMLElement) => {
   const { top } = el.getBoundingClientRect()
   window.scrollTo({
-    top: top - DEFAULT_HEADER_OFFSET,
+    top: top + window.scrollY - DEFAULT_HEADER_OFFSET,
     left: 0,
     behavior: 'smooth',
   })
@@ -152,19 +152,6 @@ export const FullArticle = (props: Props) => {
     current: HTMLDivElement
   } = { current: null }
 
-  createEffect(() => {
-    if (props.scrollToComments) {
-      scrollTo(commentsRef.current)
-    }
-  })
-
-  createEffect(() => {
-    if (searchParams()?.scrollTo === 'comments' && commentsRef.current) {
-      requestAnimationFrame(() => scrollTo(commentsRef.current))
-      changeSearchParams({ scrollTo: null })
-    }
-  })
-
   createEffect(() => {
     if (searchParams().commentId && isReactionsLoaded()) {
       const commentElement = document.querySelector<HTMLElement>(
@@ -320,6 +307,19 @@ export const FullArticle = (props: Props) => {
     window?.addEventListener('resize', updateIframeSizes)
 
     onCleanup(() => window.removeEventListener('resize', updateIframeSizes))
+
+    createEffect(() => {
+      if (props.scrollToComments) {
+        scrollTo(commentsRef.current)
+      }
+    })
+
+    createEffect(() => {
+      if (searchParams()?.scrollTo === 'comments' && commentsRef.current) {
+        requestAnimationFrame(() => scrollTo(commentsRef.current))
+        changeSearchParams({ scrollTo: null })
+      }
+    })
   })
 
   const cover = props.article.cover ?? 'production/image/logo_image.png'