From 2e4fb34dbe6b1cba09b6ff47a3ee177270b2c624 Mon Sep 17 00:00:00 2001
From: Sylvia van Os <sylvia@hackerchick.me>
Date: Mon, 24 Aug 2026 16:20:19 +0200
Subject: [PATCH] Add scroll bar and fix some padding bugs

---
 .../catima/wear/ui/CardListScreen.kt          | 65 +++++++++++--------
 1 file changed, 39 insertions(+), 26 deletions(-)

diff --git a/wear/src/main/java/me/hackerchick/catima/wear/ui/CardListScreen.kt b/wear/src/main/java/me/hackerchick/catima/wear/ui/CardListScreen.kt
index 3ea02793d..ae7f7cfba 100644
--- a/wear/src/main/java/me/hackerchick/catima/wear/ui/CardListScreen.kt
+++ b/wear/src/main/java/me/hackerchick/catima/wear/ui/CardListScreen.kt
@@ -17,10 +17,12 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.wear.compose.foundation.lazy.TransformingLazyColumn
 import androidx.wear.compose.foundation.lazy.items
+import androidx.wear.compose.foundation.lazy.rememberTransformingLazyColumnState
 import androidx.wear.compose.material3.CircularProgressIndicator
 import androidx.wear.compose.material3.Text
 import androidx.wear.compose.material3.Button
 import androidx.wear.compose.material3.ButtonDefaults
+import androidx.wear.compose.material3.ScreenScaffold
 import androidx.wear.compose.material3.SurfaceTransformation
 import androidx.wear.compose.material3.lazy.rememberTransformationSpec
 import androidx.wear.compose.material3.lazy.transformedHeight
@@ -67,32 +69,43 @@ fun CardListScreen(
                 )
             }
             else -> {
-                val transformationSpec = rememberTransformationSpec()
-                TransformingLazyColumn(
-                    modifier = Modifier.fillMaxSize(),
-                    contentPadding = PaddingValues(horizontal = 8.dp, vertical = 32.dp),
-                    verticalArrangement = Arrangement.spacedBy(4.dp),
-                ) {
-                    items(cards, key = { it.id }) { card ->
-                        Button(
-                            modifier = Modifier.fillMaxWidth().transformedHeight(this, transformationSpec),
-                            transformation = SurfaceTransformation(transformationSpec),
-                            label = {
-                                Text(
-                                    text = card.store,
-                                    maxLines = 1,
-                                )
-                            },
-                            onClick = { onCardClick(card) },
-                            colors = if (card.headerColor != null) {
-                                ButtonDefaults.buttonColors(
-                                    containerColor = Color(card.headerColor),
-                                    contentColor = if (ForegroundColorHelper.needsDarkForeground(card.headerColor)) Color.Black else Color.White
-                                )
-                            } else {
-                                ButtonDefaults.buttonColors()
-                            },
-                        )
+                val columnState = rememberTransformingLazyColumnState()
+                ScreenScaffold(
+                    scrollState = columnState,
+                ) { contentPadding ->
+                    val transformationSpec = rememberTransformationSpec()
+                    TransformingLazyColumn(
+                        state = columnState,
+                        contentPadding = contentPadding,
+                        verticalArrangement = Arrangement.spacedBy(4.dp),
+                    ) {
+                        items(cards, key = { it.id }) { card ->
+                            Button(
+                                modifier = Modifier
+                                    .fillMaxWidth()
+                                    .transformedHeight(this, transformationSpec)
+                                    .minimumVerticalContentPadding(ButtonDefaults.minimumVerticalListContentPadding),
+                                transformation = SurfaceTransformation(transformationSpec),
+                                label = {
+                                    Text(
+                                        text = card.store,
+                                        maxLines = 1,
+                                    )
+                                },
+                                onClick = { onCardClick(card) },
+                                colors = if (card.headerColor != null) {
+                                    ButtonDefaults.buttonColors(
+                                        containerColor = Color(card.headerColor),
+                                        contentColor = if (ForegroundColorHelper.needsDarkForeground(
+                                                card.headerColor
+                                            )
+                                        ) Color.Black else Color.White
+                                    )
+                                } else {
+                                    ButtonDefaults.buttonColors()
+                                },
+                            )
+                        }
                     }
                 }
                 val footerLabel = syncStatus.labelRes