feat(ui): Update Buy Me a Coffee button theme (#959)

* feat(ui): update Buy Me a Coffee button theme and add preview

* Simplify vector & make button with border

* clipping the ripple effect

app/src/main/java/eu/kanade/presentation/more/MoreScreen.kt

@@ -3,7 +3,9 @@ package eu.kanade.presentation.more
 import androidx.compose.animation.graphics.res.animatedVectorResource
 import androidx.compose.animation.graphics.res.rememberAnimatedVectorPainter
 import androidx.compose.animation.graphics.vector.AnimatedImageVector
+import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
@@ -21,19 +23,24 @@ import androidx.compose.material.icons.outlined.Settings
 import androidx.compose.material.icons.outlined.Storage
 import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.graphics.vector.rememberVectorPainter
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalUriHandler
 import androidx.compose.ui.res.vectorResource
+import androidx.compose.ui.tooling.preview.PreviewLightDark
 import androidx.compose.ui.unit.dp
 import eu.kanade.presentation.more.settings.widget.SwitchPreferenceWidget
 import eu.kanade.presentation.more.settings.widget.TextPreferenceWidget
+import eu.kanade.presentation.theme.TachiyomiPreviewTheme
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.ui.more.DownloadQueueState
 import eu.kanade.tachiyomi.util.system.openInBrowser
@@ -45,6 +52,7 @@ import tachiyomi.i18n.kmk.KMR
 import tachiyomi.i18n.sy.SYMR
 import tachiyomi.presentation.core.components.ScrollbarLazyColumn
 import tachiyomi.presentation.core.components.material.Scaffold
+import tachiyomi.presentation.core.components.material.padding
 import tachiyomi.presentation.core.i18n.pluralStringResource
 import tachiyomi.presentation.core.i18n.stringResource
 import uy.kohesive.injekt.Injekt
@@ -243,18 +251,39 @@ fun MoreScreen(
 fun Sponsor() {
     val context = LocalContext.current
     Column(
-        modifier = Modifier.fillMaxWidth()
+        modifier = Modifier
-            .padding(16.dp),
+            .fillMaxWidth()
+            .padding(bottom = MaterialTheme.padding.medium),
         horizontalAlignment = Alignment.CenterHorizontally,
     ) {
         val painter = rememberVectorPainter(ImageVector.vectorResource(R.drawable.ic_bmc_button))
-        Icon(
+        Box(
-            painter = painter,
-            contentDescription = "Buy me a coffee",
-            tint = Color.Unspecified,
             modifier = Modifier
-                .clickable { context.openInBrowser(Constants.URL_BUY_ME_A_COFFEE) },
+                .border(
-        )
+                    width = 2.dp,
+                    color = MaterialTheme.colorScheme.primary,
+                    shape = MaterialTheme.shapes.small,
+                ),
+        ) {
+            Icon(
+                painter = painter,
+                contentDescription = "Buy me a coffee",
+                tint = Color.Unspecified,
+                modifier = Modifier
+                    .clip(MaterialTheme.shapes.small)
+                    .clickable { context.openInBrowser(Constants.URL_BUY_ME_A_COFFEE) },
+            )
+        }
+    }
+}
+
+@PreviewLightDark
+@Composable
+private fun SponsorPreview() {
+    TachiyomiPreviewTheme {
+        Surface {
+            Sponsor()
+        }
     }
 }
 // KMK <--

app/src/main/res/drawable-night/ic_bmc_button.xml

@@ -0,0 +1,35 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="170dp"
+    android:height="48dp"
+    android:viewportWidth="545"
+    android:viewportHeight="153">
+    <path
+        android:pathData="M0,24.48C0,10.96 10.96,0 24.48,0H520.2c13.52,0 24.48,10.96 24.48,24.48v104.04c0,13.52 -10.96,24.48 -24.48,24.48H24.48C10.96,153 0,142.04 0,128.52Z"
+        android:fillColor="#00FFDD00"/>
+    <path
+        android:pathData="m66.05,75.1 l3.58,36.74c0.27,3.18 2.93,5.63 6.12,5.63 4.68,0.39 9.37,0.21 14.05,0 3.19,0 5.85,-2.46 6.12,-5.63L99.75,71.25C86.71,66.78 81.74,79.53 66.05,75.1Z"
+        android:fillColor="#DBC1AC"/>
+    <path
+        android:pathData="m115.76,50.99c-0.48,-2.43 -1.58,-4.74 -4.08,-5.62 -2.23,-0.43 -2.94,-0.78 -3.27,-3.32 -0.26,-1.54 -0.51,-3.08 -0.78,-4.62 -0.23,-1.33 -0.42,-2.81 -1.03,-4.03 -0.79,-1.63 -2.43,-2.58 -4.06,-3.21 -3.75,-1.45 -9.29,-2.17 -15.1,-2.49 -7.98,-0.44 -22.83,-0.51 -29.94,4.34 -1.21,1.23 -1.6,3.13 -0.72,4.67 3.21,5.55 25.56,6.55 39.36,4.4 2.89,-0.44 2.78,-5.99 -1.47,-5.33 -3.17,0.52 -17.89,1.85 -28.79,-0.49 -0.44,-0.09 -0.48,-0.72 0,-0.87h0.02c4.15,-0.94 14.64,-1.95 25.79,-0.86 4.52,0.39 9.25,1.25 10,3.1 0.7,2.57 1.19,5.2 1.75,7.81 0.12,0.53 -0.26,1.08 -0.81,1.16 -14.85,2.04 -29.89,1.5 -44.66,-0.88 -1.18,-0.19 -5.3,-0.54 -7.34,3.52 -0.63,1.32 -1.83,6.7 -1.63,8.38 0.35,3.08 2.5,5.58 5.59,6.13 11.7,2.13 27.61,3.55 46.27,1.54 1.35,-0.14 2.31,1.02 2.19,2.16 -8.97,85.17 3.53,-30.18 -4.96,48.31 -0.68,3.55 -2.95,5.71 -14.6,5.47C71.5,120.21 68.05,120.16 67.07,110.64 65.63,96.89 64.23,83.14 62.77,69.4c-0.45,-4.24 -5.84,-2.95 -5.53,0 0.12,1.17 3.85,36.9 4.8,46.09 0.6,5.49 4.79,8.44 9.98,9.27 3.84,0.62 15.41,1.18 21.01,0.14 5.74,-1.05 10.05,-4.89 10.67,-10.84 1.59,-15.41 3.08,-30.05 5.05,-49.29 0.1,-0.83 0.7,-1.57 1.6,-1.74 6.7,-1.59 6.48,-6.67 5.41,-12.04zM107.91,57.81c-21.81,3.25 -36.54,1.89 -51.05,-0.15 -2.5,-0.36 -2.84,-1.4 -2.14,-4.8 0.21,-1.06 0.62,-2.48 1.88,-2.63 2.48,-0.29 22.28,5.23 49.29,0.33 1.63,-0.29 3.43,-0.84 4.41,0.84 0.67,1.15 0.76,2.68 0.66,3.98 -0.11,1.54 -1.46,2.19 -3.05,2.43z"
+        android:fillColor="@color/mocha_onSurface"/>
+    <path
+        android:pathData="m170.04,84.24c-2.93,5.56 -12.76,7.7 -17.17,4.56l1.01,-10.46c1.17,-0.4 7.03,-2.29 12.06,-1.65 4.69,0.64 5.63,4.6 4.1,7.55zM155.41,61.95c3.87,-2.37 13.6,-3.75 12.61,3.92 -0.75,6.19 -13.43,6.21 -13.57,6.21zM175.21,77.48c-0.75,-1.63 -2.26,-3.84 -5.13,-4.78 1.33,-1.05 3.11,-4.55 3.5,-8.05 0.59,-4.82 -3.79,-13.3 -17.64,-8.33 0,-0.16 0.02,-0.33 0.05,-0.5 0.45,-2.71 -4.48,-3.76 -5.37,-0.17 -1.04,12.22 -2.09,24.44 -3.31,36.64 0.41,3.56 3.55,3.71 5.13,1.19 7.57,4.14 21.78,-0.67 23.49,-8.45 0.67,-3.02 0.13,-5.73 -0.72,-7.55z"
+        android:fillColor="@color/mocha_onSurface"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="m216.98,112.26c-2.79,-0.41 0.69,-10.1 5.08,-13.71 0.97,1.16 -1.46,14.24 -5.08,13.71zM234.77,82.21c-1.57,2.85 -4.82,5.25 -7,6.5 -0.34,-2.67 -0.63,-10.25 1.77,-17.25 0,-3.59 -3.74,-4.54 -5.56,-1.34 -3.04,8.39 -7.21,18.25 -14.05,17.92 -3.22,-0.91 -1.2,-11.87 0.62,-17.49 1.58,-3.73 -4.01,-5.09 -5.27,-2.05 -1.77,4.25 -3.02,10.16 -3.02,14.92 -1.83,4.9 -3.2,6 -4.75,5.76 -0.75,-0.32 -1.53,-1.55 -0.67,-7.38 0.64,-4.09 1.63,-8.11 2.5,-12.16 -0.14,-3.79 -3.85,-4.06 -5.3,-2 -0.72,0.99 -1,2.19 -1.47,4.44 -0.56,2.85 -2.88,13.68 -6.42,17.49 -0.8,0.85 -1.66,1.21 -2.59,1.05 -1.11,-0.22 -1.23,-2.65 -1.05,-5.12 0.34,-5.27 2.8,-15.51 2.83,-15.62 0,-3.59 -3.74,-4.63 -5.57,-1.38 -0.53,2.83 -2.02,8.91 -2.49,12.99 -0.43,2.93 -0.35,5.84 -0.09,8.77 0.35,2.37 1.23,4.08 2.61,5.13 1.08,0.84 6.14,2.62 10.31,-2.24 0.59,-0.7 1.17,-1.47 1.75,-2.29 0.46,1.03 1.89,3.61 4.84,4.01 1.62,0.2 4.28,0.01 7.1,-4.43 3.31,6.09 12.73,3.6 18.26,-3.45 -0.09,2.25 -0.01,2.25 -0.09,4.2 -10.46,7.26 -16.22,23.29 -6.96,26.13 4.54,1.41 8.47,-1.62 10.38,-6.76 2.57,-6.82 2.31,-13.47 2.18,-15.26 2.75,-1.15 5.01,-2.6 6.77,-4.35 1.75,-1.75 3.21,-3.6 4.36,-5.54 1.47,-2.02 -1.48,-6.19 -3.93,-3.2z"
+        android:fillColor="@color/mocha_onSurface"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="m300.88,72.25c1.62,-2.32 3.18,-1.4 3.43,0.69 0.31,2.62 -1.18,6.86 -5.63,7.74 -0.2,-1.24 0.49,-5.91 2.2,-8.43zM312.92,81.83c-0.61,2.4 -2.43,6.1 -6.04,8.69 -1.17,0.83 -8.7,5.74 -9.02,-4.92 1.82,0.13 3.44,-0.2 4.87,-0.98 5.95,-3.27 6.65,-10.24 6.73,-12.25 0.12,-6.12 -4.4,-8.29 -8.63,-6.78 -6.97,2.34 -7.95,13.76 -8.06,18.27 -0.52,1.33 -1.25,2.55 -1.93,3.8 -0.66,1.08 -1.39,1.99 -2.18,2.72 -0.8,0.73 -1.63,0.99 -2.5,0.76 -1.23,-0.29 -1.01,-2.99 -0.12,-10.75 0.2,-1.22 1.88,-12.59 -6.01,-14.37 -5.02,-0.48 -7.49,3.22 -9.79,7.21 -1.73,-7.07 -10.39,-11.36 -16.34,-1.2 0.13,-1.88 -1,-6.22 -4.22,-4.84 -0.41,0.16 -1.92,0.88 -1.68,2.79 1.92,7.77 0.82,15.83 -0.29,23.65 -0.24,2.63 5.54,3.52 5.95,0.28 0.23,-3.73 1.62,-12.96 4.62,-18.48 4.3,-7.85 9.46,-4.42 6.6,15.14 0,2.91 5.29,3.68 5.7,0.43 0.3,-2.12 1.93,-12.73 5.63,-17.6 2.61,-3.47 5.18,-1.78 4.18,4.92 -0.03,0.16 -0.83,4.66 -1.01,5.99 -1.51,10.56 4.28,14.76 10.62,11.25 2.3,-1.28 3.57,-2.98 3.77,-3.26 0.38,1.23 3.54,7.36 12.43,4.19 5.67,-2.05 8.02,-6.07 10.84,-13.42 0.52,-2.05 -3.64,-3.4 -4.12,-1.24z"
+        android:fillColor="@color/mocha_onSurface"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="m339.71,82.16c-2.51,7.41 -9.33,9.9 -7.67,-0.43 1.02,-6.02 4.78,-12.36 9.69,-8.22 -0.57,3.97 -1.43,6.96 -2.02,8.65zM355.78,80.49c-0.43,2.96 -3.39,10.53 -7.48,10.27 -1.6,-0.12 -2.16,-1.81 -2.18,-4.04 0.15,-5.25 1.78,-10.31 3.09,-15.36 1.03,-3.24 -4.21,-4.57 -4.94,-2.39 -2.47,-2.12 -6.17,-3.96 -10.26,-1.48 -7.29,4.46 -10.95,19.87 -5.2,25.32 2.8,2.7 7.99,2.24 12.3,-2.96 1.05,5.5 6.7,8.29 11.22,4.83 4.05,-3.16 6.71,-8.81 7.43,-12.81 0.9,-1.93 -3.09,-4.73 -3.98,-1.38z"
+        android:fillColor="@color/mocha_onSurface"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="m441.31,109.49c-2.98,0.17 -1.91,-10.58 -1.29,-15.38 6.42,0.71 6.52,15.2 1.29,15.38zM423.95,109.49c-0.54,0.03 -0.95,-0.26 -1.24,-0.86 -1.41,-4.69 -0.57,-9.74 -0.05,-14.52 6.59,0.73 6.35,15.21 1.29,15.38zM408.9,81.59c-1.19,-0.64 -5,-7.14 -1.25,-9.41 0.35,-0.19 0.66,-0.12 0.91,0.21 1.39,1.82 1.24,8.45 0.34,9.2zM400.08,90.33c-8.63,-1.68 -4.46,-17.09 1.63,-18.39 -1.31,5.45 0.33,11.75 4.74,14.43 -1.04,2.24 -4.32,4.36 -6.37,3.96zM463.08,71.13c1.86,1.12 1.2,8.42 -4.75,9.55 -0.35,-2.6 2,-11.32 4.75,-9.55zM482.4,71.13c1.87,1.13 1.19,8.42 -4.75,9.55 -0.35,-2.59 1.99,-11.33 4.75,-9.55zM491.89,81.83c-1.67,6.79 -8.78,11.59 -12.03,10.39 -0.76,-0.28 -2.86,-1.18 -3.02,-6.62 10.43,0.74 14.78,-15.37 8.99,-19.44 -2.26,-1.57 -4.83,-0.99 -6.02,-0.57 -7.17,2.41 -8,14.28 -8.07,18.58 -0.59,1.42 -1.56,2.6 -2.45,3.82 -3.37,3.95 -11.44,8.51 -11.77,-2.39 9.6,0.69 13.18,-12.15 10.93,-17.03 -1.63,-3.5 -5.11,-3.98 -7.96,-2.98 -6.55,2.2 -7.79,12.39 -8.01,16.89 -1.84,1.55 -6.41,5.38 -12.22,5.8l2.97,-31.72c0.74,-2.61 -3.59,-4.49 -5.42,-1.24 -1.31,9.03 -2.05,18.14 -2.78,27.23 -2.44,2.09 -6.79,5.34 -12.13,5.73l2.97,-31.72c0.74,-2.63 -3.6,-4.47 -5.42,-1.24 -1.3,8.98 -2.03,18.03 -2.76,27.07 -1.74,0.79 -2.85,0.89 -3.71,0.92 0.45,-1.99 1.71,-11.04 -2.2,-15.48 -1.13,-1.27 -3.18,-2.5 -6.62,-1.38 -9.66,-1.29 -15.15,7.94 -15.36,15.99 -3.14,6.35 -9.04,7.97 -11.78,7.51 -3.63,-0.62 -4.14,-5.47 -3.62,-10.56 0.78,-7.16 4.28,-10.81 4.77,-8.53 0.34,1.48 -0.28,3.36 -0.28,4.9 0.64,3.45 4.14,3.86 5.56,0.77 0.03,0.03 0.81,-6.02 0.81,-6.02 0.42,-1.82 -0.8,-3.12 -2.15,-3.3 -3.3,-4.75 -12.73,-2.07 -14.31,11.75 -0.16,1.32 -1.6,15.22 7.9,16.1 4.55,0.46 10.66,-2.63 14.15,-6.26 1.02,2.55 3.61,6.59 9.76,6.5 6.47,-0.08 9.8,-4.32 11.17,-6.74 1.86,0 3.7,-0.3 5.51,-0.91 -0.34,7.56 -1.57,15.28 0.53,22.67 2.51,7 9.82,7.24 12.99,1.25 2.99,-5.61 2.34,-15.34 -1.44,-19.47 0.03,-0.01 1.85,-0.52 5.15,-2.83 -0.66,10.57 -0.57,13.89 -0.35,16.33 1.13,12.26 10.48,12.53 14,5.97 2.94,-5.59 2.39,-15.28 -1.44,-19.47 2.02,-0.57 5.67,-3.19 5.84,-3.31 0.32,2.98 1.41,5.72 3.89,7.32 4.99,3.26 12.82,-0.05 16.01,-4.52 0.71,2.14 2.61,5.54 7.48,5.79 2.9,0.15 6.54,-1.05 8.9,-2.8 3.2,-2.34 5.09,-6.1 7.17,-11.51 0.48,-2.04 -3.61,-3.41 -4.13,-1.24z"
+        android:fillColor="@color/mocha_onSurface"
+        android:fillType="evenOdd"/>
+</vector>