ConstraintLayout {
    val (imageRef: ConstrainedLayoutReference,
        text1Ref: ConstrainedLayoutReference,
        text2Ref: ConstrainedLayoutReference,
        text3Ref: ConstrainedLayoutReference) = createRefs()
    Image(
        asset = imageResource(id = R.drawable.hq720),
        modifier = Modifier.constrainAs(
            imageRef
        ) {
            top.linkTo(anchor = parent.top, margin = 0.dp)
            start.linkTo(anchor = parent.start, margin = 0.dp)
        } then Modifier.preferredWidth(100.dp)
    )
    Text(
        text = "1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30",
        maxLines = 2,
        overflow = TextOverflow.Ellipsis,
        style = MaterialTheme.typography.subtitle1.copy(fontSize = 12.sp),
        color = Color.White,
        modifier = Modifier.constrainAs(
            text1Ref
        ) {
            start.linkTo(anchor = imageRef.end, margin = 0.dp)
            end.linkTo(anchor = parent.end, margin = 0.dp)
            top.linkTo(anchor = parent.top, margin = 0.dp)
        }
    )
    Text(
        text = "Simply Nailogica!",
        style = MaterialTheme.typography.caption.copy(fontSize = 7.sp),
        color = Color.White,
        modifier = Modifier.constrainAs(
            text2Ref
        ) {
            start.linkTo(anchor = imageRef.end, margin = 0.dp)
            end.linkTo(anchor = parent.end, margin = 0.dp)
            top.linkTo(anchor = text1Ref.bottom, margin = 0.dp)
        }
    )
    Text(
        text = "2 views 31/08/2020 * Stream",
        style = MaterialTheme.typography.caption.copy(fontSize = 6.sp),
        color = Color.White,
        modifier = Modifier.constrainAs(
            text3Ref
        ) {
            start.linkTo(imageRef.end)
            end.linkTo(parent.end)
            bottom.linkTo(imageRef.bottom)
        }
    )
}