diff options
-rw-r--r-- | src/ThreadList.js | 43 |
1 files changed, 21 insertions, 22 deletions
diff --git a/src/ThreadList.js b/src/ThreadList.js index c5eb990..fe597c3 100644 --- a/src/ThreadList.js +++ b/src/ThreadList.js @@ -1,5 +1,5 @@ import React, { Component } from "react"; -import { Header, Loader, List, Card, Image, Icon } from "semantic-ui-react"; +import { Loader, Icon, Item } from "semantic-ui-react"; import { Link } from "@reach/router"; import Moment from "react-moment"; import "moment/locale/es"; @@ -44,39 +44,38 @@ class ThreadList extends Component { ); return ( - <Card.Group centered itemsPerRow={4} stackable> + <Item.Group divided> {threadList.map((thread, index) => { return ( - <Card key={index} raised> - {currentBoard.allow_images === 1 ? ( - <Image + <Item key={index}> + {currentBoard.allow_images === 1 && ( + <Item.Image + size="tiny" src={`https://bienvenidoainternet.org/${dir}/thumb/${thread.thumb}`} - ui={false} - style={{ maxHeight: "250px" }} /> - ) : null} - <Card.Content> - <Card.Header as={Link} to={`/${dir}/read/${thread.id}`}> + )} + <Item.Content verticalAlign="middle"> + <Item.Header as={Link} to={`/${dir}/read/${thread.id}`}> {thread.subject} - </Card.Header> - <Card.Meta> + </Item.Header> + <Item.Meta> <span className="date"> <Moment fromNow unix date={thread.timestamp} /> </span> - </Card.Meta> - <Card.Description> + </Item.Meta> + <Item.Description> {thread.message.replace(stripHtml, "").substring(0, 200) + " ..."} - </Card.Description> - </Card.Content> - <Card.Content extra> - <Icon name="reply" /> - {thread.total_replies} Respuestas - </Card.Content> - </Card> + </Item.Description> + <Item.Extra> + <Icon name="reply" /> + {thread.total_replies} Respuestas + </Item.Extra> + </Item.Content> + </Item> ); })} - </Card.Group> + </Item.Group> ); } } |