Tripcode, IDs y sage

2 files changed, 24 insertions, 2 deletions

diff --git a/src/App.css b/src/App.css
index 9341c49..a53157f 100644
--- a/src/App.css
+++ b/src/App.css
@@ -16,4 +16,22 @@
 
 .vipFont {
   font-family: Mona, Monapo, IPAMonaPGothic, 'MS PGothic', YOzFontAA97;
+}
+
+.tripcode {
+  font-weight: normal !important;
+  font-style: italic !important;
+}
+
+.username {
+  color: #B5BD68;
+}
+
+.username.sage {
+  color: #81A2BE;
+}
+
+/* a quien estás citando? */
+.q {
+  color: #080;
 }
\ No newline at end of file
diff --git a/src/Post.js b/src/Post.js
index a09cccf..4923b81 100644
--- a/src/Post.js
+++ b/src/Post.js
@@ -5,13 +5,18 @@ import "moment/locale/es";
 
 const Post = ({ index, post, locked, dir }) => {
     const filesize = require('filesize');
+
+    let user_id = post.timestamp_formatted.split(" ID:")[1];
+
     return (
         <Segment.Group>
             <Header as="h5" attached>
-                #{index + 1} {post.name}
+                #{index + 1} <span className={post.email === "sage" ? "username sage" : "username"}>{post.name}</span><span className="tripcode">{post.tripcode}</span>
+
                 <Header.Subheader className="inlineSubHeader">
                     <Moment fromNow unix locale="es" date={post.timestamp} />
                 </Header.Subheader>
+                <Label size="mini">{user_id}</Label>
             </Header>
 
             <Segment.Group horizontal>
@@ -22,7 +27,6 @@ const Post = ({ index, post, locked, dir }) => {
 
                     </Segment> : null}
                 <Segment>
-
                     <div className={`postMessage ${dir === "zonavip" ? "vipFont" : null}`} dangerouslySetInnerHTML={{ __html: post.message }} />
                     {locked ? null :
                         (<Label attached='bottom right'>