From 27e0fa07010a3860d6425622311c7b28e3df4bf1 Mon Sep 17 00:00:00 2001
From: Pavel Mineev <pavel@mineev.me>
Date: Thu, 7 Jan 2021 21:39:15 +0300
Subject: [PATCH] change styles for list-comments

---
 ...-comments.css => list-comments.module.css} |  2 +-
 .../list-comments/list-comments.tsx           | 37 +++++++++----------
 2 files changed, 19 insertions(+), 20 deletions(-)
 rename frontend/app/components/list-comments/{list-comments.css => list-comments.module.css} (77%)

diff --git a/frontend/app/components/list-comments/list-comments.css b/frontend/app/components/list-comments/list-comments.module.css
similarity index 77%
rename from frontend/app/components/list-comments/list-comments.css
rename to frontend/app/components/list-comments/list-comments.module.css
index ce27387e..f5122fac 100644
--- a/frontend/app/components/list-comments/list-comments.css
+++ b/frontend/app/components/list-comments/list-comments.module.css
@@ -1,3 +1,3 @@
-.list-comments {
+.root {
   font-family: 'PT Sans', Helvetica, Arial, sans-serif;
 }
diff --git a/frontend/app/components/list-comments/list-comments.tsx b/frontend/app/components/list-comments/list-comments.tsx
index 2c101c9d..c40de0fc 100644
--- a/frontend/app/components/list-comments/list-comments.tsx
+++ b/frontend/app/components/list-comments/list-comments.tsx
@@ -2,9 +2,10 @@ import { h, FunctionComponent } from 'preact';
 import { useIntl } from 'react-intl';
 
 import type { Comment as CommentType } from 'common/types';
-import { NODE_ID } from 'common/constants';
 import Comment from 'components/comment';
 
+import styles from './list-comments.module.css';
+
 export type ListCommentsProps = {
   comments: CommentType[];
 };
@@ -13,24 +14,22 @@ const ListComments: FunctionComponent<ListCommentsProps> = ({ comments = [] }) =
   const intl = useIntl();
 
   return (
-    <div id={NODE_ID}>
-      <div className="list-comments">
-        {comments.map(comment => (
-          <Comment
-            intl={intl}
-            key={comment.id}
-            CommentForm={null}
-            data={comment}
-            level={0}
-            view="preview"
-            mix="list-comments__item"
-            user={null}
-            theme="light"
-            isCommentsDisabled={false}
-            post_info={null}
-          />
-        ))}
-      </div>
+    <div className={styles.root}>
+      {comments.map(comment => (
+        <Comment
+          intl={intl}
+          key={comment.id}
+          CommentForm={null}
+          data={comment}
+          level={0}
+          view="preview"
+          mix="list-comments__item"
+          user={null}
+          theme="light"
+          isCommentsDisabled={false}
+          post_info={null}
+        />
+      ))}
     </div>
   );
 };