diff --git a/wax-prosemirror-components/src/components/comments/CommentBox.js b/wax-prosemirror-components/src/components/comments/CommentBox.js
index 1a9d277b7eb0cdcfff9b2292f1fec6af6baab44d..32e0042cb9420d80be1fd128f5adb4b3db1dab72 100644
--- a/wax-prosemirror-components/src/components/comments/CommentBox.js
+++ b/wax-prosemirror-components/src/components/comments/CommentBox.js
@@ -1,5 +1,18 @@
 import React, { useEffect, useRef, useContext } from "react";
+import styled from "styled-components";
 
-export default ({ node, view }) => {
-  useEffect(() => {}, []);
-};
+// export default ({ node, view }) => {
+//   useEffect(() => {}, []);
+// };
+
+const CommentBoxStyled = styled.div`
+  height: 50px;
+  width: 50px;
+  display: flex;
+  flex-direction: column;
+  margin-top: 10px;
+  background: black;
+`;
+
+const CommentBox = () => <CommentBoxStyled />;
+export default CommentBox;
diff --git a/wax-prosemirror-components/src/components/comments/CommentComponent.js b/wax-prosemirror-components/src/components/comments/CommentComponent.js
index 84fb9e2ae2b9e739d65c9c85c231190c5980ba2b..fc821ab55fdb7598a30a6d1e9a1bbdbcacfff309 100644
--- a/wax-prosemirror-components/src/components/comments/CommentComponent.js
+++ b/wax-prosemirror-components/src/components/comments/CommentComponent.js
@@ -30,7 +30,11 @@ export default () => {
 
 const updateComments = view => {
   if (view) {
-    // TODO find comments
+    return DocumentHelpers.findChildrenByMark(
+      view.state.doc,
+      view.state.schema.marks.comment,
+      true
+    );
   }
   return [];
 };
diff --git a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js b/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
index bba95b426ea70e1cb97a7b2777ba0fbf9776ac9b..1a8b9931e8649b576eedb6bd843ba12f5dc97b4e 100644
--- a/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
+++ b/wax-prosemirror-layouts/src/layouts/EditoriaLayout.js
@@ -171,7 +171,7 @@ const NotesContainer = styled.div`
 
 const CommentsContainer = styled.div`
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
   width: 35%;
   height: 100%;
 `;
diff --git a/wax-prosemirror-utilities/src/document/DocumentHelpers.js b/wax-prosemirror-utilities/src/document/DocumentHelpers.js
index 36fedfeb16e1646aae1f6538a3c825f08c8cf333..62af5f2b1efae3206ec8fc0734c019c519c1fa3b 100644
--- a/wax-prosemirror-utilities/src/document/DocumentHelpers.js
+++ b/wax-prosemirror-utilities/src/document/DocumentHelpers.js
@@ -55,9 +55,14 @@ const findInlineNodes = (node, descend) => {
   return findChildren(node, child => child.isInline, descend);
 };
 
+const findChildrenByMark = (node, markType, descend) => {
+  return findChildren(node, child => markType.isInSet(child.marks), descend);
+};
+
 export default {
   findMark,
   findBlockNodes,
   findChildrenByType,
-  findInlineNodes
+  findInlineNodes,
+  findChildrenByMark
 };