diff options
| -rw-r--r-- | package-lock.json | 17 | ||||
| -rw-r--r-- | package.json | 1 | ||||
| -rw-r--r-- | src/BBSThread.js | 19 |
3 files changed, 29 insertions, 8 deletions
diff --git a/package-lock.json b/package-lock.json index ff4d939..2a45bc3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6574,9 +6574,9 @@ } }, "filesize": { - "version": "3.6.1", - "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz", - "integrity": "sha512-7KjR1vv6qnicaPMi1iiTcI85CyYwRO/PSFCu6SvqL8jN2Wjt/NIYQTFtFs7fSDCYOstUkEWIQGFUg5YZQfjlcg==" + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/filesize/-/filesize-4.2.0.tgz", + "integrity": "sha512-bdS2UP98MZzLyTZzhuSH5ctAWyDt81n5xMti9BSdmgPXjjENLDz5Bmbk2R7ATVw/HRysZzWA2JIPgcSAOimWpw==" }, "fill-range": { "version": "4.0.0", @@ -12671,6 +12671,12 @@ "integrity": "sha512-4As8uPrjfwb7VXC+WnLCbXK7y+Ueb2B3zgNCePYfhxS1PYeaO1YTeplffTEcbfLhvFNGLAz90VvJs9yomG7bow==", "dev": true }, + "filesize": { + "version": "3.6.1", + "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz", + "integrity": "sha512-7KjR1vv6qnicaPMi1iiTcI85CyYwRO/PSFCu6SvqL8jN2Wjt/NIYQTFtFs7fSDCYOstUkEWIQGFUg5YZQfjlcg==", + "dev": true + }, "json5": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz", @@ -14229,6 +14235,11 @@ "node-releases": "^1.1.25" } }, + "filesize": { + "version": "3.6.1", + "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz", + "integrity": "sha512-7KjR1vv6qnicaPMi1iiTcI85CyYwRO/PSFCu6SvqL8jN2Wjt/NIYQTFtFs7fSDCYOstUkEWIQGFUg5YZQfjlcg==" + }, "inquirer": { "version": "6.5.0", "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-6.5.0.tgz", diff --git a/package.json b/package.json index 7aa75c6..7c58a56 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "private": true, "dependencies": { "@reach/router": "^1.2.1", + "filesize": "^4.2.0", "fomantic-ui": "^2.7.8", "fomantic-ui-css": "^2.7.8", "moment": "^2.24.0", diff --git a/src/BBSThread.js b/src/BBSThread.js index 9d11537..321598e 100644 --- a/src/BBSThread.js +++ b/src/BBSThread.js @@ -1,8 +1,9 @@ import React, { Component } from "react"; -import { Header, Icon, Loader, Message, Segment, Image, Button } from "semantic-ui-react"; +import { Header, Icon, Loader, Message, Segment, Image, Label } from "semantic-ui-react"; import Moment from "react-moment"; import "moment/locale/es"; + class BBSThread extends Component { constructor(props) { super(props); @@ -35,6 +36,7 @@ class BBSThread extends Component { } render() { const { isLoading, error } = this.state; + const filesize = require('filesize'); if (isLoading) { return ( @@ -77,12 +79,19 @@ class BBSThread extends Component { </Header> <Segment.Group horizontal> - {post.file != "" ? <Segment compact> <Image src={`https://bienvenidoainternet.org/${this.props.dir}/thumb/${post.thumb}`} /></Segment> : null} - <Segment> + {post.file != "" ? + <Segment padded compact> + <Label attached='bottom'>{post.file} {post.image_width}x{post.image_height} {filesize(post.file_size, { bits: true })}</Label> + <Image src={`https://bienvenidoainternet.org/${this.props.dir}/thumb/${post.thumb}`} /> + + </Segment> : null} + <Segment padded> <div className="postMessage" dangerouslySetInnerHTML={{ __html: post.message }} /> - <Icon name="reply" />Responder + <Label attached='bottom right'> + <Icon name="reply" />Responder + <Icon name="exclamation circle" />Reportar + </Label> - <Icon name="exclamation circle" />Reportar </Segment> </Segment.Group> </Segment.Group> |