added post date

snwolak · Jun 13, 2018 · c091d75 · c091d75
1 parent f2e586b
commit c091d75
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 10 deletions.
diff --git a/src/Blog/BlogModal.js b/src/Blog/BlogModal.js
@@ -5,6 +5,7 @@ import store from "../store";
 import FollowBtn from "../Components/Post/FollowBtn";
 import { getAccounts } from "../actions/getAccounts";
 import PostsLoader from "./PostsLoader";
+
 const ModalStyle = {
   overlay: {
     backgroundColor: "rgba(80,80,80, 0.3)"

diff --git a/src/Blog/Post.js b/src/Blog/Post.js
@@ -19,6 +19,9 @@ import Icon from "react-icons-kit";
 import { ic_message } from "react-icons-kit/md/ic_message";
 import { ic_favorite } from "react-icons-kit/md/ic_favorite";
 import store from "../store";
+import {
+  FormattedRelative,
+} from 'react-intl';
 const md = new Remarkable({
   html: true,
   linkify: true
@@ -85,6 +88,7 @@ class Post extends Component {
                 ).toFixed(2)}{" "}
             </span>
             <span>
+
               {
                 <Icon
                   icon={ic_message}
@@ -103,8 +107,11 @@ class Post extends Component {
                 style={heartIconStyle}
                 onClick={this.handleVoteBtn}
               />
+
             </span>
           </FooterActions>
+
+            <FormattedRelative value={Date.parse(this.props.post.created)}/>
         </CardFooter>
         {this.state.shouldOpenComments ? (
           <Comments

diff --git a/src/Components/Post/Post.styles.js b/src/Components/Post/Post.styles.js
@@ -60,7 +60,11 @@ export const CardTitle = styled.div`
     font-weight: 500;
   }
 `;
-
+export const UsernameContainer = styled.span`
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+`;
 export const CardAvatar = styled.div`
   background: url(${props => props.url});
   width: 40px;

diff --git a/src/Components/Post/index.js b/src/Components/Post/index.js
@@ -9,6 +9,7 @@ import {
   CardHeader,
   CardAvatar,
   CardTitle,
+  UsernameContainer,
   BtnContainer,
   CardFooter,
   TagContainer,
@@ -19,6 +20,7 @@ import FollowBtn from "./FollowBtn";
 import Lightbox from "react-image-lightbox";
 import HoverIntet from "react-hoverintent";
 import LazyLoad from "react-lazyload";
+import { FormattedRelative } from "react-intl";
 import followSteem from "../.././Functions/followSteem";
 import Comments from "./Comments";
 import PostCardText from "./PostCardText";
@@ -150,15 +152,23 @@ class Post extends Component {
               }/avatar`}
             />
             <CardTitle>
-              <HoverIntet
-                onMouseOver={this.handleProfileHover}
-                onMouseOut={this.handleProfileUsernameHover}
-                sensitivity={10}
-                interval={600}
-                timeout={250}
-              >
-                <b onClick={this.handleBlogModal}>{this.props.post.author}</b>
-              </HoverIntet>
+              <UsernameContainer>
+                <HoverIntet
+                  onMouseOver={this.handleProfileHover}
+                  onMouseOut={this.handleProfileUsernameHover}
+                  sensitivity={10}
+                  interval={600}
+                  timeout={250}
+                >
+                  <b onClick={this.handleBlogModal}>
+                    {this.props.post.author}{" "}
+                  </b>
+                </HoverIntet>
+                <FormattedRelative
+                  value={Date.parse(this.props.post.created)}
+                />
+              </UsernameContainer>
+
               <p>{this.props.post.title}</p>
               {this.state.isHover ? (
                 <ProfileHover