I am currently using Material-UI card component in my React web application. The card is quite plain and only has a title. I would like to enhance it by adding a thumbnail on the left side of the card, followed by the title, similar to how song lists are displayed in some apps. I have tried implementing this but haven't been successful. Is there a way to add an image as a thumbnail to the card's leftmost side? I want the thumbnail height to match the card's height and for it to start from the left edge without any margin. Can someone provide assistance?
Below is the code for the current card:
render(){
return (
<div>
<MuiThemeProvider>
<Card style= {{marginBottom: 2}}
onTouchTap={() => {this.props.handleClick(this.props.id)}}
zDepth={this.state.shadow}>
<CardHeader
style={{fontFamily: 'Roboto, sans-serif', fontWeight:600}}
title={this.props.title}
//subtitle={value.description}
actAsExpander={false}
showExpandableButton={false}
/>
</Card>
</MuiThemeProvider>
</div>
);
}