comments mock

src/containers/examples/ImageExample/index.tsx

@@ -1,9 +1,37 @@
 import React, { FC } from 'react';
+import { Card } from "~/components/containers/Card";
+import * as styles from './styles.scss';
+import { Group } from "~/components/containers/Group";
+import { Padder } from "~/components/containers/Padder";
+import range from 'ramda/es/range';
+import { Comment } from "~/components/node/Comment";
 
 interface IProps {}
 
 const ImageExample: FC<IProps> = () => (
-    <div>image example</div>
+    <Card>
+      <Group>
+        <div className={styles.image_container} />
+
+        <Padder horizontal>
+          <Group horizontal>
+            <Group className={styles.comments}>
+              {
+                range(1,6).map(el => (
+                  <Comment
+                    key={el}
+                  />
+                ))
+              }
+            </Group>
+
+            <div className={styles.panel}>
+
+            </div>
+          </Group>
+        </Padder>
+      </Group>
+    </Card>
 );
 
 export { ImageExample };

src/containers/examples/ImageExample/styles.scss

@@ -0,0 +1,13 @@
+.image_container {
+  width: 100%;
+  height: 600px;
+  background: #131313;
+}
+
+.comments {
+  flex: 3 1;
+}
+
+.panel {
+  flex: 1 3;
+}