From 046cfe62b8ea9838bff5daf9af29e3264d620b5f Mon Sep 17 00:00:00 2001
From: Nils Pukropp <nils@narl.io>
Date: Sun, 4 Oct 2026 16:45:25 +0200
Subject: [PATCH] fix(android): paint the accent button's gradient inside its
 container

The gradient sat on the outer modifier, which Material pads out to the
48dp minimum touch target, so the primary button drew 8dp taller than
the 40dp tonal button beside it on the library hero.
---
 .../io/narl/protonstream/ui/theme/Accent.kt   | 34 ++++++++++++++-----
 1 file changed, 26 insertions(+), 8 deletions(-)

diff --git a/android/app/src/main/java/io/narl/protonstream/ui/theme/Accent.kt b/android/app/src/main/java/io/narl/protonstream/ui/theme/Accent.kt
index 2328b14..e4b3d60 100644
--- a/android/app/src/main/java/io/narl/protonstream/ui/theme/Accent.kt
+++ b/android/app/src/main/java/io/narl/protonstream/ui/theme/Accent.kt
@@ -2,9 +2,14 @@ package io.narl.protonstream.ui.theme
 
 import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
+import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
@@ -20,6 +25,7 @@ import androidx.compose.material3.SliderState
 import androidx.compose.material3.TextButton
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.geometry.CornerRadius
 import androidx.compose.ui.geometry.Size
@@ -67,18 +73,30 @@ internal fun AccentButton(
     enabled: Boolean = true,
     content: @Composable RowScope.() -> Unit,
 ) {
-    val shape = MaterialTheme.shapes.small
+    // The ramp is painted inside the container, not on `modifier`: the button
+    // pads itself out to the 48dp minimum touch target, and a background on
+    // the outer modifier fills that whole target — 8dp taller than the 40dp
+    // container every other button draws, so it stood out beside them.
     Button(
         onClick = onClick,
-        // Only while it is live: a disabled button keeps Material's flat
-        // disabled container, because a greyed control that still wears the
-        // one strong colour in the window reads as pressable.
-        modifier = if (enabled) modifier.background(accentBrush(), shape) else modifier,
+        modifier = modifier,
         enabled = enabled,
-        shape = shape,
+        shape = MaterialTheme.shapes.small,
         colors = ButtonDefaults.buttonColors(containerColor = Color.Transparent),
-        content = content,
-    )
+        contentPadding = PaddingValues(0.dp),
+    ) {
+        Row(
+            // Only while it is live: a disabled button keeps Material's flat
+            // disabled container, because a greyed control that still wears
+            // the one strong colour in the window reads as pressable.
+            modifier = (if (enabled) Modifier.background(accentBrush()) else Modifier)
+                .defaultMinSize(ButtonDefaults.MinWidth, ButtonDefaults.MinHeight)
+                .padding(ButtonDefaults.ContentPadding),
+            horizontalArrangement = Arrangement.Center,
+            verticalAlignment = Alignment.CenterVertically,
+            content = content,
+        )
+    }
 }
 
 @Composable