diff options
| author |  Renard
| 2019-09-29 21:14:09 -0300 |
|---|---|---|
| committer | Renard
| 2019-09-29 21:14:09 -0300 |
| commit | fb7f4b112f623716f9b2c4a36939f0e3b65f1403 (patch) | |
| tree | 4ce963bd590ca3af512535658a2248e2ec50ff39 /src/ThreadList.js | |
| parent | 6c6e9fd5dbf0c7f1cde8c3178cf57191bea65ea1 (diff) | |
| download | bai-client-fb7f4b112f623716f9b2c4a36939f0e3b65f1403.tar.gz bai-client-fb7f4b112f623716f9b2c4a36939f0e3b65f1403.tar.xz bai-client-fb7f4b112f623716f9b2c4a36939f0e3b65f1403.zip | |
Nightmode threadList
Diffstat (limited to 'src/ThreadList.js')
| -rw-r--r-- | src/ThreadList.js | 74 |
1 files changed, 40 insertions, 34 deletions
diff --git a/src/ThreadList.js b/src/ThreadList.js index fe597c3..56f9ab2 100644 --- a/src/ThreadList.js +++ b/src/ThreadList.js @@ -1,5 +1,5 @@ import React, { Component } from "react"; -import { Loader, Icon, Item } from "semantic-ui-react"; +import { Loader, Icon, Item, Segment } from "semantic-ui-react"; import { Link } from "@reach/router"; import Moment from "react-moment"; import "moment/locale/es"; @@ -24,7 +24,7 @@ class ThreadList extends Component { } render() { - const { dir, boardList } = this.props; + const { dir, boardList, nightMode } = this.props; const { threadList, isLoading } = this.state; const currentBoard = boardList.find(board => { @@ -44,38 +44,44 @@ class ThreadList extends Component { ); return ( - <Item.Group divided> - {threadList.map((thread, index) => { - return ( - <Item key={index}> - {currentBoard.allow_images === 1 && ( - <Item.Image - size="tiny" - src={`https://bienvenidoainternet.org/${dir}/thumb/${thread.thumb}`} - /> - )} - <Item.Content verticalAlign="middle"> - <Item.Header as={Link} to={`/${dir}/read/${thread.id}`}> - {thread.subject} - </Item.Header> - <Item.Meta> - <span className="date"> - <Moment fromNow unix date={thread.timestamp} /> - </span> - </Item.Meta> - <Item.Description> - {thread.message.replace(stripHtml, "").substring(0, 200) + - " ..."} - </Item.Description> - <Item.Extra> - <Icon name="reply" /> - {thread.total_replies} Respuestas - </Item.Extra> - </Item.Content> - </Item> - ); - })} - </Item.Group> + <Segment inverted={nightMode}> + <Item.Group divided> + {threadList.map((thread, index) => { + return ( + <Item key={index}> + {currentBoard.allow_images === 1 && ( + <Item.Image + size="tiny" + src={`https://bienvenidoainternet.org/${dir}/thumb/${thread.thumb}`} + /> + )} + <Item.Content verticalAlign="middle"> + <Item.Header + as={Link} + to={`/${dir}/read/${thread.id}`} + className={nightMode && "inverted"} + > + {thread.subject} + </Item.Header> + <Item.Meta className={nightMode && "inverted"}> + <span className="date"> + <Moment fromNow unix date={thread.timestamp} /> + </span> + </Item.Meta> + <Item.Description className={nightMode && "inverted"}> + {thread.message.replace(stripHtml, "").substring(0, 200) + + " ..."} + </Item.Description> + <Item.Extra className={nightMode && "inverted"}> + <Icon name="reply" /> + {thread.total_replies} Respuestas + </Item.Extra> + </Item.Content> + </Item> + ); + })} + </Item.Group> + </Segment> ); } } |