Left-aligned the text in posts

This commit is contained in:
Aaron Sun 2019-11-29 21:11:10 -08:00
parent 4b440d28de
commit e3593e2f29
3 changed files with 14 additions and 5 deletions

View File

@ -88,7 +88,7 @@ exports.getFollowedPosts = (req, res) => {
.then(function(allPosts) { .then(function(allPosts) {
let posts = []; let posts = [];
allPosts.forEach(function(doc) { allPosts.forEach(function(doc) {
if(doc.data().userHandle === req.user.handle || doc.data().userHandle === "Admin") { if(doc.data().userHandle === req.user.handle) {
posts.push(doc.data()); posts.push(doc.data());
} }
else if(followers_likedTopics.has(doc.data().userHandle)) { else if(followers_likedTopics.has(doc.data().userHandle)) {

View File

@ -7,6 +7,7 @@ import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime'; import relativeTime from 'dayjs/plugin/relativeTime';
// Material UI and React Router // Material UI and React Router
import { makeStyles, styled } from '@material-ui/core/styles';
import Grid from '@material-ui/core/Grid'; import Grid from '@material-ui/core/Grid';
import Card from '@material-ui/core/Card'; import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent'; import CardContent from '@material-ui/core/CardContent';
@ -18,6 +19,10 @@ import logo from '../images/twistter-logo.png';
import noImage from '../images/no-img.png'; import noImage from '../images/no-img.png';
import Writing_Microblogs from '../Writing_Microblogs'; import Writing_Microblogs from '../Writing_Microblogs';
const MyCardContent = styled(CardContent)({
textAlign: "left"
});
class Home extends Component { class Home extends Component {
state = {}; state = {};
@ -40,7 +45,7 @@ class Home extends Component {
let postMarkup = this.state.posts ? ( let postMarkup = this.state.posts ? (
this.state.posts.map(post => this.state.posts.map(post =>
<Card> <Card>
<CardContent> <MyCardContent>
<Typography> <Typography>
{ {
this.state.imageUrl ? (<img src={this.state.imageUrl} height="50" width="50" />) : this.state.imageUrl ? (<img src={this.state.imageUrl} height="50" width="50" />) :
@ -56,7 +61,7 @@ class Home extends Component {
<Typography variant="body2"><b>Topics:</b> {post.microBlogTopics}</Typography> <Typography variant="body2"><b>Topics:</b> {post.microBlogTopics}</Typography>
<br /> <br />
<Typography variant="body2" color={"textSecondary"}> Likes {post.likeCount} &nbsp; Shares {post.commentCount} </Typography> <Typography variant="body2" color={"textSecondary"}> Likes {post.likeCount} &nbsp; Shares {post.commentCount} </Typography>
</CardContent> </MyCardContent>
</Card> </Card>
) )
) : (<p>loading posts...</p>); ) : (<p>loading posts...</p>);

View File

@ -29,6 +29,10 @@ const MyChip = styled(Chip)({
color: 'primary' color: 'primary'
}); });
const MyCardContent = styled(CardContent)({
textAlign: "left"
});
class user extends Component { class user extends Component {
state = { state = {
profile: null, profile: null,
@ -122,7 +126,7 @@ class user extends Component {
let postMarkup = this.state.posts ? ( let postMarkup = this.state.posts ? (
this.state.posts.map(post => this.state.posts.map(post =>
<Card> <Card>
<CardContent> <MyCardContent>
<Typography> <Typography>
{ {
this.state.imageUrl ? (<img src={this.state.imageUrl} height="50" width="50" />) : this.state.imageUrl ? (<img src={this.state.imageUrl} height="50" width="50" />) :
@ -138,7 +142,7 @@ class user extends Component {
<Typography variant="body2"><b>Topics:</b> {post.microBlogTopics}</Typography> <Typography variant="body2"><b>Topics:</b> {post.microBlogTopics}</Typography>
<br /> <br />
<Typography variant="body2" color={"textSecondary"}> Likes {post.likeCount} &nbsp; Shares {post.commentCount} </Typography> <Typography variant="body2" color={"textSecondary"}> Likes {post.likeCount} &nbsp; Shares {post.commentCount} </Typography>
</CardContent> </MyCardContent>
</Card> </Card>
) )
) : (<p>loading posts...</p>); ) : (<p>loading posts...</p>);