Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
VideoMetadata with Rating
return (
<div className='video-metadata'>
<h3>Video title</h3>
<div className='video-stats'>
<span>{viewCount} views</span>
<div className='video-actions' >
<Rating likeCount={1000} dislikeCount={100} />
<Button basic icon labelPosition='left'>
<Icon name='share'/>
Share
</Button>
<Button basic icon>
<Icon name='add circle' />
</Button>
<Button basic icon>
<Icon name='ellipsis horizontal' />
</Button>
</div>
</div>
<Divider/>
</div>
);
.video-metadata {
/*
...
Insert the -video-stats class below
*/
.video-stats {
display: flex;
justify-content: space-between;
width: 100%;
align-items: center;
.video-actions {
display: flex;
align-items: center;
& > *:not(:last-child) {
margin-right: 8px;
}
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.