Create a Grid section for the middle part of the page, posts, to be used as a template when working on the functionality in JSX later.
UI Approach
Code structure
The code for the component will live in a Posts.js file in the folder: /src/components/posts
All relevant styles will be added to the style.css in the same folder
Wireframe
^Should look like this minus the comments above the 'add a comment....' section
What's on your mind
Design a "What's on your mind?" section in the top, with the user's profile image to the left of the status update textbox. This section should stick to the page.
Individual post
Design an individual post with the following content:
User's initials on the top left
Username in the middle with the date under it
Three dots on the top right
The social post in the middle, underlined
Like and comment buttons under the line
Number of likes on the right side under the line
New comment section with username, "Add a comment..." text and send button
Requirements
UI Approach
Code structure
The code for the component will live in a
Posts.jsfile in the folder: /src/components/postsAll relevant styles will be added to the
style.cssin the same folderWireframe
What's on your mind
Individual post