fix: settings option rows — stack title above controls instead of side by side

SettingsOptionRow was a horizontal Row cramming icon + title + wide
controls (theme circles, appearance pills) into one line. The text
got squeezed to near-zero width, breaking character by character.
Changed to vertical layout: title/description on top, controls below.
This commit is contained in:
Bruno Deanoz 2026-06-21 17:46:18 +02:00
parent e4c6e7f763
commit fe5e93cdfa

View file

@ -107,12 +107,12 @@ fun SettingsOptionRow(
content: @Composable () -> Unit = {} content: @Composable () -> Unit = {}
) { ) {
val cs = MaterialTheme.colorScheme val cs = MaterialTheme.colorScheme
Row( Column(
modifier = modifier modifier = modifier
.fillMaxWidth() .fillMaxWidth()
.padding(vertical = 10.dp), .padding(vertical = 10.dp),
verticalAlignment = Alignment.CenterVertically
) { ) {
Row(verticalAlignment = Alignment.CenterVertically) {
Box( Box(
modifier = Modifier modifier = Modifier
.size(38.dp) .size(38.dp)
@ -127,16 +127,15 @@ fun SettingsOptionRow(
modifier = Modifier.size(18.dp) modifier = Modifier.size(18.dp)
) )
} }
Spacer(Modifier.width(14.dp)) Spacer(Modifier.width(14.dp))
Column {
Column(Modifier.weight(1f)) {
Text( Text(
text = title, text = title,
color = cs.onBackground, color = cs.onBackground,
fontSize = 15.sp, fontSize = 15.sp,
fontWeight = FontWeight.SemiBold fontWeight = FontWeight.SemiBold
) )
if (description.isNotEmpty()) {
Text( Text(
text = description, text = description,
color = cs.onSurfaceVariant, color = cs.onSurfaceVariant,
@ -144,9 +143,9 @@ fun SettingsOptionRow(
lineHeight = 16.sp lineHeight = 16.sp
) )
} }
}
Spacer(Modifier.width(10.dp)) }
Spacer(Modifier.height(12.dp))
content() content()
} }
} }