return ( <CardclassName={classes.root}> <CardContent> <TypographyclassName={classes.title}color="textSecondary"gutterBottom> Word of the Day </Typography> </CardContent> </Card> ); }
// no more makeStyle const styles = theme => ({ root: { minWidth: 275, margin: theme.spacing(1) // Use theme } title: { fontSize: 14, margin: props => (props.titleMargin) // This is how you use props in style } });
render() { const {classes} = this.props; // for class name referring return ( <CardclassName={classes.root}> <CardContent> <TypographyclassName={classes.title}color="textSecondary"gutterBottom> Word of the Day </Typography> </CardContent> </Card> ); } }
exportdefault withStyle(styles)(MyCard); // Wrap use withStyle