Refactor CaseRow styling and text behavior

Improve the visual presentation of individual case entries by adjusting
styling and text handling. This includes setting a minimum height for
rows, applying consistent padding, and enabling text truncation with an
ellipsis for longer oneliner descriptions.
This commit is contained in:
2026-04-24 12:46:55 +02:00
parent 3b2b62865c
commit 5176ea26f4
@@ -2,14 +2,17 @@ package com.doctate.watch.presentation
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.lifecycle.compose.collectAsStateWithLifecycle import androidx.lifecycle.compose.collectAsStateWithLifecycle
import androidx.wear.compose.foundation.lazy.ScalingLazyColumn import androidx.wear.compose.foundation.lazy.ScalingLazyColumn
@@ -62,15 +65,24 @@ fun CaseListScreen(
@Composable @Composable
private fun CaseRow(case: CaseEntry, onTap: () -> Unit) { private fun CaseRow(case: CaseEntry, onTap: () -> Unit) {
Card(onClick = onTap, modifier = Modifier.fillMaxWidth()) { Card(
onClick = onTap,
modifier = Modifier.fillMaxWidth().heightIn(min = 48.dp),
contentPadding = PaddingValues(horizontal = 10.dp, vertical = 6.dp),
) {
Text( Text(
text = formatTime(case.createdAt), text = formatTime(case.createdAt),
style = MaterialTheme.typography.labelSmall, style = MaterialTheme.typography.bodyExtraSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
modifier = Modifier.align(Alignment.CenterHorizontally),
) )
Text( Text(
text = case.oneliner ?: "", text = case.oneliner ?: "",
style = MaterialTheme.typography.bodyMedium, style = MaterialTheme.typography.bodySmall,
modifier = Modifier.padding(top = 2.dp), maxLines = 2,
overflow = TextOverflow.Ellipsis,
textAlign = TextAlign.Center,
modifier = Modifier.fillMaxWidth().padding(top = 2.dp),
) )
} }
} }