create account

KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post by sirfreeman

View this thread on: hive.blogpeakd.comecency.com
· @sirfreeman ·
$31.70
KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post
## Repository
https://github.com/knacksteem/knacksteem.org 

## Pull Request 
https://github.com/knacksteem/knacksteem.org/pull/54

![image](https://user-images.githubusercontent.com/34397562/49100785-97162200-f26c-11e8-837d-1ce171bba24c.png)


![image](https://user-images.githubusercontent.com/34397562/49100849-c2990c80-f26c-11e8-96c0-99d47436f119.png)


![](https://cdn.steemitimages.com/DQmZ1N5NNarrWbXk8qNJcFsrZqA4n9T9gfW7de4SrCSrv6U/image.png)

This PR adds the user avatar, the time the the post was made, and the tags entered by the user on posting to the block chain and refactor of component to add the similar post feature to the ArticleDetail component.
 
The overall responsive layout of the Editor post area has being fixed along with the ArticleDetailI component which was referenced in the issues below.

https://github.com/knacksteem/knacksteem.org/issues/53

Made use of the PrettyDate function to return time in a nice format on the ArticleListItem.

```
export const prettyDate = (time) => {
  const date = new Date(time),
    diff = (((new Date()).getTime() - date.getTime()) / 1000) + date.getTimezoneOffset() * 60,
    day_diff = Math.floor(diff / 86400);

  if (day_diff === 0) {
    //posted just today
    if (diff < 60) {
      return 'just now';
    } else if (diff < 120) {
      return '1 minute ago';
    } else if (diff < 3600) {
      return Math.floor(diff / 60) + ' minutes ago';
    } else if (diff < 7200) {
      return '1 hour ago';
    } else {
      return Math.floor(diff / 3600) + ' hours ago';
    }
  } else if (day_diff === 1) {
    return 'yesterday';
  } else if (day_diff < 7) {
    return day_diff + ' days ago';
  } else {
    return Math.ceil(day_diff / 7) + ' weeks ago';
  }
};
```


## Issue
https://github.com/knacksteem/knacksteem.org/issues/53

## Task Request
https://steemit.com/knacksteem/@knowledges/development-task-request-help-build-knacksteem-front-end-800-steem-bounty 

## What's next?
I believe notifications and layouts for moderator will be my next target.

## Commits 
https://github.com/knacksteem/knacksteem.org/pull/54/commits/76ee84f20e600521e1c70e215cbb5bf55f11634b

https://github.com/knacksteem/knacksteem.org/pull/54/commits/62497d551669e4103ac04dc061a35be69088eab4

https://github.com/knacksteem/knacksteem.org/pull/54/commits/966c6cf1a3a09ec49f8336969de9386e337ce2be

https://github.com/knacksteem/knacksteem.org/pull/54/commits/9cb2aaae39b752305c440fb08c3045efe8d2b411

## Github Account
https://github.com/ogbiyoyosky
πŸ‘  , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , and 211 others
properties (23)
authorsirfreeman
permlinkknacksteem-update-overall-layout-of-home-editor-preview-and-view-for-a-particular-post
categoryutopian-io
json_metadata{"tags":["utopian-io","development","knacksteem","reactjs"],"image":["https://user-images.githubusercontent.com/34397562/49100785-97162200-f26c-11e8-837d-1ce171bba24c.png","https://user-images.githubusercontent.com/34397562/49100849-c2990c80-f26c-11e8-96c0-99d47436f119.png","https://cdn.steemitimages.com/DQmZ1N5NNarrWbXk8qNJcFsrZqA4n9T9gfW7de4SrCSrv6U/image.png"],"links":["https://github.com/knacksteem/knacksteem.org","https://github.com/knacksteem/knacksteem.org/pull/54","https://github.com/knacksteem/knacksteem.org/issues/53","https://steemit.com/knacksteem/@knowledges/development-task-request-help-build-knacksteem-front-end-800-steem-bounty","https://github.com/knacksteem/knacksteem.org/pull/54/commits/76ee84f20e600521e1c70e215cbb5bf55f11634b","https://github.com/knacksteem/knacksteem.org/pull/54/commits/62497d551669e4103ac04dc061a35be69088eab4","https://github.com/knacksteem/knacksteem.org/pull/54/commits/966c6cf1a3a09ec49f8336969de9386e337ce2be","https://github.com/knacksteem/knacksteem.org/pull/54/commits/9cb2aaae39b752305c440fb08c3045efe8d2b411","https://github.com/ogbiyoyosky"],"app":"steemit/0.1","format":"markdown"}
created2018-11-29 05:24:18
last_update2018-11-29 05:24:18
depth0
children6
last_payout2018-12-06 05:24:18
cashout_time1969-12-31 23:59:59
total_payout_value24.069 HBD
curator_payout_value7.630 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length2,502
author_reputation13,136,718,943,137
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,079,145
net_rshares52,265,884,668,157
author_curate_reward""
vote details (275)
@emrebeyler ·
$9.61
That seems a lot of work! :)

- It seems the pull request was including [unresolved](https://github.com/knacksteem/knacksteem.org/blob/develop/src/containers/Home/index.css#L19) conflicts. 

- There are duplicate commit messages in your branch's git history. It's a good practice to squash multiple commits into one for that kind of cases.

- Looks like PrettyDate stops making things prettier after *weeks*. That would be good to have to make that work with months and years, too. (Btw, I know you just used the functionality already exists, however, pasting the original function to the your contribution post, I had to review that piece of code, too :))

***


Your contribution has been evaluated according to [Utopian policies and guidelines](https://join.utopian.io/guidelines), as well as a predefined set of questions pertaining to the category.

To view those questions and the relevant answers related to your post, [click here](https://review.utopian.io/result/3/2212234).

---- 
Need help? Write a ticket on https://support.utopian.io/. 
Chat with us on [Discord](https://discord.gg/uTyJkNm). 
[[utopian-moderator]](https://join.utopian.io/)
πŸ‘  , , , , , , , , ,
properties (23)
authoremrebeyler
permlinkre-sirfreeman-knacksteem-update-overall-layout-of-home-editor-preview-and-view-for-a-particular-post-20181129t205416133z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"links":["https://github.com/knacksteem/knacksteem.org/blob/develop/src/containers/Home/index.css#L19","https://join.utopian.io/guidelines","https://review.utopian.io/result/3/2212234","https://support.utopian.io/","https://discord.gg/uTyJkNm","https://join.utopian.io/"],"app":"steemit/0.1"}
created2018-11-29 20:54:15
last_update2018-11-29 20:54:15
depth1
children1
last_payout2018-12-06 20:54:15
cashout_time1969-12-31 23:59:59
total_payout_value7.267 HBD
curator_payout_value2.346 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length1,153
author_reputation448,535,049,068,622
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,115,206
net_rshares15,871,293,805,916
author_curate_reward""
vote details (10)
@utopian-io ·
Thank you for your review, @emrebeyler! Keep up the good work!
properties (22)
authorutopian-io
permlinkre-re-sirfreeman-knacksteem-update-overall-layout-of-home-editor-preview-and-view-for-a-particular-post-20181129t205416133z-20181202t000634z
categoryutopian-io
json_metadata"{"app": "beem/0.20.9"}"
created2018-12-02 00:06:36
last_update2018-12-02 00:06:36
depth2
children0
last_payout2018-12-09 00:06:36
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length62
author_reputation152,955,367,999,756
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,219,303
net_rshares0
@steem-ua ·
#### Hi @sirfreeman!

Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your post is eligible for our upvote, thanks to our collaboration with @utopian-io!
**Feel free to join our [@steem-ua Discord server](https://discord.gg/KpBNYGz)**
properties (22)
authorsteem-ua
permlinkre-knacksteem-update-overall-layout-of-home-editor-preview-and-view-for-a-particular-post-20181129t214230z
categoryutopian-io
json_metadata"{"app": "beem/0.20.9"}"
created2018-11-29 21:42:33
last_update2018-11-29 21:42:33
depth1
children0
last_payout2018-12-06 21:42:33
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length289
author_reputation23,214,230,978,060
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,116,828
net_rshares0
@steemitboard ·
Congratulations @sirfreeman! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :

<table><tr><td>https://steemitimages.com/60x70/http://steemitboard.com/@sirfreeman/voted.png?201811292328</td><td>You received more than 2000 upvotes. Your next target is to reach 3000 upvotes.</td></tr>
</table>

<sub>_[Click here to view your Board of Honor](https://steemitboard.com/@sirfreeman)_</sub>
<sub>_If you no longer want to receive notifications, reply to this comment with the word_ `STOP`</sub>



> Support [SteemitBoard's project](https://steemit.com/@steemitboard)! **[Vote for its witness](https://v2.steemconnect.com/sign/account-witness-vote?witness=steemitboard&approve=1)** and **get one more award**!
properties (22)
authorsteemitboard
permlinksteemitboard-notify-sirfreeman-20181130t000808000z
categoryutopian-io
json_metadata{"image":["https://steemitboard.com/img/notify.png"]}
created2018-11-30 00:08:06
last_update2018-11-30 00:08:06
depth1
children0
last_payout2018-12-07 00:08:06
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length766
author_reputation38,975,615,169,260
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,122,098
net_rshares0
@surpassinggoogle ·
Task Request: Add Core Features & 'Communities' To Ulogs.org (Plus 880 Steem Bounty) & Further Insight Into The 'Grand Vision' For Ulogs.org. https://steemit.com/utopian-io/@surpassinggoogle/task-request-add-core-features-and-communities-to-ulogs-org-880-steem-bounty-and-more
properties (22)
authorsurpassinggoogle
permlinkre-sirfreeman-knacksteem-update-overall-layout-of-home-editor-preview-and-view-for-a-particular-post-20181204t162833234z
categoryutopian-io
json_metadata{"tags":["utopian-io"],"links":["https://steemit.com/utopian-io/@surpassinggoogle/task-request-add-core-features-and-communities-to-ulogs-org-880-steem-bounty-and-more"],"app":"steemit/0.1"}
created2018-12-04 16:28:33
last_update2018-12-04 16:28:33
depth1
children0
last_payout2018-12-11 16:28:33
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length276
author_reputation527,661,560,108,742
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,353,453
net_rshares0
@utopian-io ·
Hey, @sirfreeman!

**Thanks for contributing on Utopian**.
We’re already looking forward to your next contribution!

**Get higher incentives and support Utopian.io!**
 Simply set @utopian.pay as a 5% (or higher) payout beneficiary on your contribution post (via [SteemPlus](https://chrome.google.com/webstore/detail/steemplus/mjbkjgcplmaneajhcbegoffkedeankaj?hl=en) or [Steeditor](https://steeditor.app)).

**Want to chat? Join us on Discord https://discord.gg/h52nFrV.**

<a href='https://steemconnect.com/sign/account-witness-vote?witness=utopian-io&approve=1'>Vote for Utopian Witness!</a>
properties (22)
authorutopian-io
permlinkre-knacksteem-update-overall-layout-of-home-editor-preview-and-view-for-a-particular-post-20181130t104152z
categoryutopian-io
json_metadata"{"app": "beem/0.20.9"}"
created2018-11-30 10:41:54
last_update2018-11-30 10:41:54
depth1
children0
last_payout2018-12-07 10:41:54
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length592
author_reputation152,955,367,999,756
root_title"KnackSteem update Overall Layout of Home, Editor, Preview and view for a particular post"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id76,142,602
net_rshares0