ClaytonWWilson/CS307-Team24
1
0
Fork 0
mirror of https://github.com/ClaytonWWilson/CS307-Team24.git synced 2025-12-16 02:08:47 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added styles and spaced cards

Browse Source
This commit is contained in:
Clayton Wilson 2019-11-03 15:29:39 -05:00
parent 2bd1c08c2c
commit 38df4ef087
2 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
twistter-frontend/src/pages/Home.js
View File

@ -9,6 +9,7 @@ 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';
import Typography from "@material-ui/core/Typography"; import Typography from "@material-ui/core/Typography";
import withStyles from '@material-ui/styles/withStyles';
// component // component
import '../App.css'; import '../App.css';
@ -16,6 +17,12 @@ 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 styles = {
card: {
marginBottom: 5
}
}
class Home extends Component { class Home extends Component {
state = {}; state = {};
@ -38,10 +45,10 @@ class Home extends Component {
render() { render() {
let authenticated = this.props.user.authenticated; let authenticated = this.props.user.authenticated;
let {classes} = this.props;
let postMarkup = this.state.posts ? ( let postMarkup = this.state.posts ? (
this.state.posts.map(post => this.state.posts.map(post =>
<Card> <Card className={classes.card}>
<CardContent> <CardContent>
<Typography> <Typography>
{ {
@ -106,7 +113,8 @@ const mapStateToProps = (state) => ({
}) })
Home.propTypes = { Home.propTypes = {
user: PropTypes.object.isRequired user: PropTypes.object.isRequired,
clases: PropTypes.object.isRequired
} }
export default connect(mapStateToProps)(Home); export default connect(mapStateToProps)(withStyles(styles)(Home));

16
twistter-frontend/src/pages/user.js
View File

@ -13,6 +13,7 @@ import CardMedia from '@material-ui/core/CardMedia';
import CardContent from '@material-ui/core/CardContent'; import CardContent from '@material-ui/core/CardContent';
import Button from '@material-ui/core/Button'; import Button from '@material-ui/core/Button';
import Grid from "@material-ui/core/Grid"; import Grid from "@material-ui/core/Grid";
import withStyles from '@material-ui/styles/withStyles';
import Chip from "@material-ui/core/Chip"; import Chip from "@material-ui/core/Chip";
import Typography from "@material-ui/core/Typography"; import Typography from "@material-ui/core/Typography";
@ -28,6 +29,12 @@ const MyChip = styled(Chip)({
color: "primary" color: "primary"
}); });
const styles = {
card: {
marginBottom: 5
}
}
class user extends Component { class user extends Component {
state = { state = {
profile: null, profile: null,
@ -104,7 +111,7 @@ class user extends Component {
render() { render() {
let authenticated = this.props.user.authenticated; let authenticated = this.props.user.authenticated;
let classes = this.props; let {classes} = this.props;
let profileMarkup = this.state.profile ? ( let profileMarkup = this.state.profile ? (
<p> <p>
<Typography variant='h5'>{this.state.profile}</Typography> <Typography variant='h5'>{this.state.profile}</Typography>
@ -128,7 +135,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 className={classes.card}>
<CardContent> <CardContent>
<Typography> <Typography>
{ {
@ -190,7 +197,8 @@ const mapStateToProps = (state) => ({
}) })
user.propTypes = { user.propTypes = {
user: PropTypes.object.isRequired user: PropTypes.object.isRequired,
clases: PropTypes.object.isRequired
} }
export default connect(mapStateToProps)(user); export default connect(mapStateToProps)(withStyles(styles)(user));