draw a compact blob gradient behind the mini player

app/src/main/kotlin/com/subtracks/ui/playback/MiniPlayer.kt

@@ -4,6 +4,7 @@ import androidx.compose.foundation.basicMarquee
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -19,20 +20,19 @@ import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 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.lerp
 import androidx.compose.ui.unit.dp
 import com.subtracks.data.model.CoverArtRef
 import com.subtracks.playback.PlaybackState
 import com.subtracks.ui.components.CoverArt
 import com.subtracks.ui.theme.ArtworkColors
 import com.subtracks.ui.theme.ArtworkTheme
+import com.subtracks.ui.theme.HeroGradient
 
 @Composable
 fun MiniPlayer(
@@ -46,11 +46,7 @@ fun MiniPlayer(
 ) {
     val item = state.item ?: return
     ArtworkTheme(artwork) {
-        Surface(
+        Box(
-            color =
-                artwork?.let { lerp(it.scheme.surfaceContainerHigh, it.gradientHigh, 0.5f) }
-                    ?: MaterialTheme.colorScheme.surfaceContainerHigh,
-            contentColor = MaterialTheme.colorScheme.onSurface,
             modifier =
                 modifier.fillMaxWidth().clickable(
                     interactionSource = remember { MutableInteractionSource() },
@@ -58,6 +54,12 @@ fun MiniPlayer(
                     onClick = onExpand,
                 ),
         ) {
+            HeroGradient(
+                colors = artwork,
+                scrollPx = { 0f },
+                compact = true,
+                modifier = Modifier.matchParentSize(),
+            )
             Row(
                 modifier =
                     Modifier

app/src/main/kotlin/com/subtracks/ui/theme/ArtworkTheme.kt

@@ -210,6 +210,7 @@ fun HeroGradient(
     colors: ArtworkColors?,
     scrollPx: () -> Float,
     modifier: Modifier = Modifier,
+    compact: Boolean = false,
 ) {
     val high = colors?.gradientHigh ?: MaterialTheme.colorScheme.surfaceContainerHigh
     val low = colors?.gradientLow ?: MaterialTheme.colorScheme.background
@@ -218,7 +219,7 @@ fun HeroGradient(
     val seed = colors?.blobSeed ?: 0
 
     Canvas(modifier) {
-        val period = size.height * PERIOD_SCREENS
+        val period = size.height * if (compact) 1f else PERIOD_SCREENS
         if (period <= 0f) return@Canvas
         val scroll = scrollPx()
         val phase = scroll.mod(period)
@@ -233,10 +234,15 @@ fun HeroGradient(
         )
         if (accents.isNotEmpty()) {
             val random = Random(seed)
-            repeat(BLOB_COUNT) { index ->
+            repeat(if (compact) 3 else BLOB_COUNT) { index ->
                 val centerX = size.width * (0.10f + random.nextFloat() * 0.80f)
                 val baseY = period * BLOB_ZONE * random.nextFloat()
-                val radius = size.width * (0.45f + random.nextFloat() * 0.35f)
+                val radius =
+                    if (compact) {
+                        size.height * (0.70f + random.nextFloat() * 0.70f)
+                    } else {
+                        size.width * (0.45f + random.nextFloat() * 0.35f)
+                    }
                 val alpha = 0.50f + random.nextFloat() * 0.32f
                 val accent = accents[index % accents.size]
                 for (shift in -1..1) {
@@ -253,6 +259,7 @@ fun HeroGradient(
                 }
             }
         }
+        if (compact) return@Canvas
         val darkenStart = size.height * DARKEN_START_SCREENS - scroll
         val darkenEnd = size.height * DARKEN_END_SCREENS - scroll
         drawRect(