From 1289267e5c2650765236631f089282f499b7b70c Mon Sep 17 00:00:00 2001
From: Renard
Date: Fri, 13 Sep 2019 12:30:11 -0300
Subject: Imagenes en Board.js

---
 src/App.css  |  2 +-
 src/Board.js | 40 ++++++++++++++++++++++++++++++----------
 src/Post.js  |  2 +-
 3 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/src/App.css b/src/App.css
index a53157f..cd12c8b 100644
--- a/src/App.css
+++ b/src/App.css
@@ -11,7 +11,7 @@
 
 .imageSegment {
   padding: 0 !important;
-  min-width: 250px !important;
+  /* min-width: 250px !important; */
 }
 
 .vipFont {
diff --git a/src/Board.js b/src/Board.js
index bec11a3..19dda7a 100644
--- a/src/Board.js
+++ b/src/Board.js
@@ -1,5 +1,5 @@
 import React, { Component } from "react";
-import { Loader, Message, Segment, Header } from "semantic-ui-react";
+import { Loader, Message, Segment, Header, Image, SegmentGroup } from "semantic-ui-react";
 import { Link } from "@reach/router";
 import Moment from "react-moment";
 import "moment/locale/es";
@@ -75,16 +75,36 @@ class Board extends Component {
                                 {thread.name} ― <Moment fromNow unix locale="es" date={thread.timestamp} />
                             </Header.Subheader>
                         </Header>
-                        <Segment attached>
-                            <div dangerouslySetInnerHTML={{ __html: thread.message }} />
-                        </Segment>
+                        <Segment.Group horizontal attached>
+                            {thread.file !== "" ?
+                                <Segment compact className="imageSegment">
+                                    <Image size="small" fluid src={`https://bienvenidoainternet.org/${this.props.dir}/thumb/${thread.thumb}`} />
+                                </Segment>
+
+                                : null}
+                            <Segment attached>
+                                <div dangerouslySetInnerHTML={{ __html: thread.message }} />
+                            </Segment>
+                        </Segment.Group>
+
                         {thread.replies.map((reply, index, replies) =>
-                            <Header attached key={index} as="h5">
-                                #{thread.total_replies - replies.length + index + 1} {reply.name}
-                                <Header.Subheader>
-                                    <div className={`postMessage ${this.props.dir === "zonavip" ? "vipFont" : null}`} dangerouslySetInnerHTML={{ __html: reply.message }} />
-                                </Header.Subheader>
-                            </Header>
+                            <Segment.Group horizontal attached>
+                                {reply.file !== "" ?
+                                    <Segment compact className="imageSegment">
+                                        <Image size="small" fluid src={`https://bienvenidoainternet.org/${this.props.dir}/thumb/${reply.thumb}`} />
+                                    </Segment>
+                                    : null}
+                                <Segment attached>
+
+                                    <Header key={index} as="h5">
+                                        #{thread.total_replies - replies.length + index + 1} {reply.name}
+                                        <Header.Subheader>
+                                            <div className={`postMessage ${this.props.dir === "zonavip" ? "vipFont" : null}`} dangerouslySetInnerHTML={{ __html: reply.message }} />
+                                        </Header.Subheader>
+                                    </Header>
+                                </Segment>
+                            </Segment.Group>
+
                         )}
 
                     </Segment.Group>
diff --git a/src/Post.js b/src/Post.js
index 4923b81..054bc58 100644
--- a/src/Post.js
+++ b/src/Post.js
@@ -22,7 +22,7 @@ const Post = ({ index, post, locked, dir }) => {
             <Segment.Group horizontal>
                 {post.file !== "" ?
                     <Segment compact className="imageSegment">
-                        <Label attached='bottom'>{post.file} {post.image_width}x{post.image_height} {filesize(post.file_size, { bits: true })}</Label>
+                        <Label size="small" attached='bottom'>{post.file} {post.image_width}x{post.image_height} {filesize(post.file_size, { bits: true })}</Label>
                         <Image fluid src={`https://bienvenidoainternet.org/${dir}/thumb/${post.thumb}`} />
 
                     </Segment> : null}
-- 
cgit v1.2.1-18-gbd029