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:
parent
e4c6e7f763
commit
fe5e93cdfa
1 changed files with 34 additions and 35 deletions
|
|
@ -107,46 +107,45 @@ fun SettingsOptionRow(
|
|||
content: @Composable () -> Unit = {}
|
||||
) {
|
||||
val cs = MaterialTheme.colorScheme
|
||||
Row(
|
||||
Column(
|
||||
modifier = modifier
|
||||
.fillMaxWidth()
|
||||
.padding(vertical = 10.dp),
|
||||
verticalAlignment = Alignment.CenterVertically
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.size(38.dp)
|
||||
.clip(KaizenShapes.circle)
|
||||
.background(cs.onBackground.copy(alpha = 0.06f)),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Icon(
|
||||
imageVector = icon,
|
||||
contentDescription = null,
|
||||
tint = cs.onBackground.copy(alpha = 0.75f),
|
||||
modifier = Modifier.size(18.dp)
|
||||
)
|
||||
Row(verticalAlignment = Alignment.CenterVertically) {
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.size(38.dp)
|
||||
.clip(KaizenShapes.circle)
|
||||
.background(cs.onBackground.copy(alpha = 0.06f)),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Icon(
|
||||
imageVector = icon,
|
||||
contentDescription = null,
|
||||
tint = cs.onBackground.copy(alpha = 0.75f),
|
||||
modifier = Modifier.size(18.dp)
|
||||
)
|
||||
}
|
||||
Spacer(Modifier.width(14.dp))
|
||||
Column {
|
||||
Text(
|
||||
text = title,
|
||||
color = cs.onBackground,
|
||||
fontSize = 15.sp,
|
||||
fontWeight = FontWeight.SemiBold
|
||||
)
|
||||
if (description.isNotEmpty()) {
|
||||
Text(
|
||||
text = description,
|
||||
color = cs.onSurfaceVariant,
|
||||
fontSize = 12.sp,
|
||||
lineHeight = 16.sp
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Spacer(Modifier.width(14.dp))
|
||||
|
||||
Column(Modifier.weight(1f)) {
|
||||
Text(
|
||||
text = title,
|
||||
color = cs.onBackground,
|
||||
fontSize = 15.sp,
|
||||
fontWeight = FontWeight.SemiBold
|
||||
)
|
||||
Text(
|
||||
text = description,
|
||||
color = cs.onSurfaceVariant,
|
||||
fontSize = 12.sp,
|
||||
lineHeight = 16.sp
|
||||
)
|
||||
}
|
||||
|
||||
Spacer(Modifier.width(10.dp))
|
||||
|
||||
Spacer(Modifier.height(12.dp))
|
||||
content()
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue