Hi I have such piece of code: it draws movie card. The problem, which I have, is that only one of two Text components are printed. I tried many versions of modifications, but always there is only one text. Could you explain me why? 🙁

item {
    key(movie.id) {
        Box(contentAlignment = Alignment.CenterStart) {
            StandardCardLayout(
                modifier = Modifier
                    .aspectRatio(1.25f)
                    .padding(8.dp)
                    .then(
                        if (index == 0)
                            Modifier.focusOnInitialVisibility(isFirstItemVisible)
                        else Modifier
                    ),
                imageCard = {
                    CardLayoutDefaults.ImageCard(
                        shape = CardDefaults.shape(shape = JetStreamCardShape),
                        border = CardDefaults.border(
                            focusedBorder = Border(
                                border = BorderStroke(
                                    width = JetStreamBorderWidth,
                                    color = MaterialTheme.colorScheme.onSurface
                                ),
                                shape = JetStreamCardShape
                            ),
                            pressedBorder = Border(
                                border = BorderStroke(
                                    width = JetStreamBorderWidth,
                                    color = MaterialTheme.colorScheme.border
                                ),
                                shape = JetStreamCardShape
                            ),
                        ),
                        scale = CardDefaults.scale(focusedScale = 1f),
                        onClick = { onMovieSelected(movie) },
                        interactionSource = it
                    ) {
                        AsyncImage(
                            model = ImageRequest.Builder(LocalContext.current)
                                .data(movie.posterUri)
                                .crossfade(true)
                                .build(),
                            contentDescription = StringConstants
                                .Composable
                                .ContentDescription
                                .moviePoster(movie.name),
                            contentScale = ContentScale.Crop,
                            modifier = Modifier.fillMaxWidth().aspectRatio(1.77f)
                        )
                        Text(
                            text = movie.name.take(20),
                            style = MaterialTheme.typography.bodySmall.copy(
                                fontWeight = FontWeight.SemiBold,
                                lineHeight = 2.em
                            ),
                            textAlign = TextAlign.Center,
                            modifier = modifier
//                                                .alpha(1f)
                                .fillMaxWidth()
                                .wrapContentHeight(align = Alignment.Top, unbounded = true)
//                                                .padding(top = 26.dp)
                                .background(color = Color.Black)
                                .align(Alignment.TopCenter)
                            ,
                            maxLines = 2,
                            overflow = TextOverflow.Ellipsis,
                            color = Color.White,
                            lineHeight = 15.sp,
                            fontSize = 10.sp,
                        )
                        Text(
                            text = "(${movie.stars}) " + movie.releaseDate,
                            style = MaterialTheme.typography.bodySmall.copy(
                                fontWeight = FontWeight.SemiBold
                            ),
                            textAlign = TextAlign.Center,
                            modifier = modifier
//                                                .alpha(1f)
                                .fillMaxWidth()
                                .wrapContentHeight(align = Alignment.Top, unbounded = true)
//                                                .padding(top = 26.dp)
                                .background(color = Color.Black)
                                .align(Alignment.BottomCenter)
                            ,
                            maxLines = 2,
                            overflow = TextOverflow.Ellipsis,
                            color = Color.White,
                            lineHeight = 15.sp,
                            fontSize = 10.sp
                        )
                    }
                },
                title = {},
            )
        }
    }
}

I tried to use:

Modifier.wrapContentHeight
Modifier.height
Modifier.aspectRatio
lineHeight
etc...

Preview on single ‘item’

As you can see on the image, it prints only one text.
I know, that I could print it with “n” escape sequence, and use one Text component, but I need different styles for each text.