From 9ac0be7e37a769811933f6c196c590c6f56ac970 Mon Sep 17 00:00:00 2001 From: Brandon McAnsh Date: Fri, 2 Oct 2026 10:49:58 -0400 Subject: [PATCH] fix(tokens): round the explainer slider's fill at the far end The track uses a square inside corner so the fill ends flush under the thumb. At full position that corner is the track's right edge, so the green fill showed square corners. Clip the track to its pill shape. --- .../tokens/internal/explainer/MarketCapExplainerSlider.kt | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/apps/flipcash/features/tokens/src/main/kotlin/com/flipcash/app/tokens/internal/explainer/MarketCapExplainerSlider.kt b/apps/flipcash/features/tokens/src/main/kotlin/com/flipcash/app/tokens/internal/explainer/MarketCapExplainerSlider.kt index 6385fcdc2..849ffa5f1 100644 --- a/apps/flipcash/features/tokens/src/main/kotlin/com/flipcash/app/tokens/internal/explainer/MarketCapExplainerSlider.kt +++ b/apps/flipcash/features/tokens/src/main/kotlin/com/flipcash/app/tokens/internal/explainer/MarketCapExplainerSlider.kt @@ -11,6 +11,7 @@ import androidx.compose.foundation.interaction.collectIsPressedAsState import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.CircleShape +import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.shadow import androidx.compose.ui.graphics.graphicsLayer import androidx.compose.material3.ExperimentalMaterial3Api @@ -136,7 +137,9 @@ internal fun MarketCapExplainerSlider( Box(Modifier.fillMaxWidth().height(44.dp), contentAlignment = Alignment.Center) { SliderDefaults.Track( sliderState = state, - modifier = Modifier.height(10.dp), + // A square inside corner keeps the fill flush under the thumb, but at the far + // end it would leave the green squared off; clipping to the pill rounds it. + modifier = Modifier.height(10.dp).clip(CircleShape), colors = colors, drawStopIndicator = null, thumbTrackGapSize = 0.dp,