How to do it...

Let's say that you're working on a detail screen for some type of entity, such as a blog post. You've decided to use a Card component to render some of the entity details since the entity is the subject under consideration. Here's the code that will render a Card component with information about a particular subject:

import React from 'react';import { withStyles } from '@material-ui/core/styles';import Card from '@material-ui/core/Card';import CardContent from '@material-ui/core/CardContent';import Typography from '@material-ui/core/Typography';const styles = theme => ({  card: {    maxWidth: 400  },  content: {    marginTop: theme.spacing(1)  }});const MainContent = withStyles(styles)(({ classes }) => ( <Card className={classes.card}> ...

Get React Material-UI Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.