diff --git a/src/frontends/android/app/src/main/java/org/strongswan/android/ui/compose/routing/RuSitesCard.kt b/src/frontends/android/app/src/main/java/org/strongswan/android/ui/compose/routing/RuSitesCard.kt index d9d30ef73..4fd3a3f78 100644 --- a/src/frontends/android/app/src/main/java/org/strongswan/android/ui/compose/routing/RuSitesCard.kt +++ b/src/frontends/android/app/src/main/java/org/strongswan/android/ui/compose/routing/RuSitesCard.kt @@ -204,22 +204,33 @@ private fun ModeCard( { RadioButton(selected = selected, onClick = null, modifier = Modifier.size(20.dp)) Spacer(Modifier.width(ShxSpacing.sm)) - Text(text = title, style = MaterialTheme.typography.titleSmall, fontWeight = FontWeight.SemiBold) - if (beta) + /* FlowRow: on narrow cards the BETA badge drops below the title + * as a whole instead of wrapping letter by letter */ + androidx.compose.foundation.layout.FlowRow( + horizontalArrangement = Arrangement.spacedBy(6.dp), + verticalArrangement = Arrangement.spacedBy(2.dp), + itemVerticalAlignment = Alignment.CenterVertically, + modifier = Modifier.weight(1f), + ) { - Spacer(Modifier.width(6.dp)) - Surface( - shape = MaterialTheme.shapes.extraSmall, - color = MaterialTheme.colorScheme.tertiaryContainer, - contentColor = MaterialTheme.colorScheme.onTertiaryContainer, - ) + Text(text = title, style = MaterialTheme.typography.titleSmall, fontWeight = FontWeight.SemiBold) + if (beta) { - Text( - text = stringResource(R.string.routing_mode_beta), - style = MaterialTheme.typography.labelSmall, - fontWeight = FontWeight.SemiBold, - modifier = Modifier.padding(horizontal = 6.dp, vertical = 2.dp), + Surface( + shape = MaterialTheme.shapes.extraSmall, + color = MaterialTheme.colorScheme.tertiaryContainer, + contentColor = MaterialTheme.colorScheme.onTertiaryContainer, ) + { + Text( + text = stringResource(R.string.routing_mode_beta), + style = MaterialTheme.typography.labelSmall, + fontWeight = FontWeight.SemiBold, + maxLines = 1, + softWrap = false, + modifier = Modifier.padding(horizontal = 6.dp, vertical = 2.dp), + ) + } } } }