refactor: improve layout for speed preferences

data/resources/src/commonMain/composeResources/values/strings.xml

@@ -27,7 +27,7 @@
     <string name="playback_speed_value">%1$d %</string>
     <string name="playback_settings_action">Réglages de lecture</string>
     <string name="break_between_phrases_title">Pause entre les phrases</string>
-    <string name="break_between_phrases_value">%1$d s</string>
+    <string name="break_between_phrases_value">%1$ds</string>
     <plurals name="break_between_phrases_value_description">
         <item quantity="one">%1$d seconde</item>
         <item quantity="other">%1$d secondes</item>

feature/records/src/commonMain/kotlin/bzh/ajaury/chombev/player/ui/components/LabeledSlider.kt

@@ -61,18 +61,23 @@ fun LabeledSlider(
     ) {
         Row(
             modifier = Modifier.fillMaxWidth(),
-            horizontalArrangement = Arrangement.SpaceBetween,
+            horizontalArrangement = Arrangement.spacedBy(16.dp),
             verticalAlignment = Alignment.CenterVertically,
         ) {
+            // The title takes the remaining width and wraps if needed, so the value always keeps
+            // its full width on a single line.
             Text(
                 text = title,
                 style = MaterialTheme.typography.titleMedium,
                 color = MaterialTheme.colorScheme.onSurface.copy(alpha = contentAlpha),
+                modifier = Modifier.weight(1f),
             )
             Text(
                 text = valueLabel,
                 style = MaterialTheme.typography.titleMedium,
                 color = MaterialTheme.colorScheme.primary.copy(alpha = contentAlpha),
+                maxLines = 1,
+                softWrap = false,
             )
         }
         Slider(
@@ -110,6 +115,20 @@ private fun LabeledSliderPreview() {
     }
 }
 
+@Preview(widthDp = 200)
+@Composable
+private fun LabeledSliderLongTitlePreview() {
+    MaterialTheme {
+        LabeledSlider(
+            title = "Break between phrases",
+            valueLabel = "3 s",
+            value = 3f,
+            valueRange = 0f..5f,
+            steps = 4,
+        )
+    }
+}
+
 @Preview
 @Composable
 private fun LabeledSliderDisabledPreview() {