Minor UI changes (#673)

## Description
- Always update home page backdrop
- Use smaller font size for episode names & force single line
- Use smaller cards for episode cards on person page

app/src/main/java/com/github/damontecres/wholphin/ui/UiConstants.kt

@@ -69,6 +69,7 @@ val SlimItemFields =
 
 object Cards {
     val height2x3 = 172.dp
+    val heightEpisode = height2x3 * .75f
     val playedPercentHeight = 6.dp
     val serverUserCircle = height2x3 * .75f
 }

app/src/main/java/com/github/damontecres/wholphin/ui/components/SeriesComponents.kt

@@ -7,6 +7,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
+import androidx.compose.ui.unit.sp
 import androidx.tv.material3.MaterialTheme
 import androidx.tv.material3.Text
 import com.github.damontecres.wholphin.ui.formatDateTime
@@ -42,7 +43,8 @@ fun EpisodeName(
         text = episodeName ?: "",
         color = MaterialTheme.colorScheme.onSurface,
         style = MaterialTheme.typography.headlineSmall,
-        maxLines = 2,
+        fontSize = 20.sp,
+        maxLines = 1,
         overflow = TextOverflow.Ellipsis,
         modifier = modifier,
     )

app/src/main/java/com/github/damontecres/wholphin/ui/detail/PersonPage.kt

@@ -43,10 +43,12 @@ import com.github.damontecres.wholphin.data.model.BaseItem
 import com.github.damontecres.wholphin.preferences.UserPreferences
 import com.github.damontecres.wholphin.services.FavoriteWatchManager
 import com.github.damontecres.wholphin.services.NavigationManager
+import com.github.damontecres.wholphin.ui.Cards
 import com.github.damontecres.wholphin.ui.LocalImageUrlService
 import com.github.damontecres.wholphin.ui.OneTimeLaunchedEffect
 import com.github.damontecres.wholphin.ui.PreviewTvSpec
 import com.github.damontecres.wholphin.ui.SlimItemFields
+import com.github.damontecres.wholphin.ui.cards.SeasonCard
 import com.github.damontecres.wholphin.ui.components.ErrorMessage
 import com.github.damontecres.wholphin.ui.components.ExpandableFaButton
 import com.github.damontecres.wholphin.ui.components.LoadingPage
@@ -54,7 +56,9 @@ import com.github.damontecres.wholphin.ui.components.LoadingRow
 import com.github.damontecres.wholphin.ui.components.OverviewText
 import com.github.damontecres.wholphin.ui.data.ItemDetailsDialog
 import com.github.damontecres.wholphin.ui.data.ItemDetailsDialogInfo
+import com.github.damontecres.wholphin.ui.data.RowColumn
 import com.github.damontecres.wholphin.ui.formatDate
+import com.github.damontecres.wholphin.ui.ifElse
 import com.github.damontecres.wholphin.ui.isNotNullOrBlank
 import com.github.damontecres.wholphin.ui.launchIO
 import com.github.damontecres.wholphin.ui.nav.Destination
@@ -334,8 +338,25 @@ fun PersonPageContent(
                 onClickItem = onClickItem,
                 onClickPosition = { position = it },
                 showIfEmpty = false,
-                horizontalPadding = 32.dp,
+                horizontalPadding = 24.dp,
                 modifier = Modifier.fillMaxWidth(),
+                cardContent = { index, item, mod, onClick, onLongClick ->
+                    SeasonCard(
+                        item = item,
+                        onClick = {
+                            position = RowColumn(EPISODE_ROW, index)
+                            onClick.invoke()
+                        },
+                        onLongClick = onLongClick,
+                        imageHeight = Cards.heightEpisode,
+                        modifier =
+                            mod
+                                .ifElse(
+                                    position.row == EPISODE_ROW && position.column == index,
+                                    Modifier.focusRequester(focusRequester),
+                                ),
+                    )
+                },
             )
         }
     }

app/src/main/java/com/github/damontecres/wholphin/ui/detail/movie/MovieDetails.kt

@@ -506,6 +506,14 @@ fun MovieDetailsContent(
             }
             if (similar.isNotEmpty()) {
                 item {
+                    val imageHeight =
+                        remember(movie.type) {
+                            if (movie.type == BaseItemKind.MOVIE) {
+                                Cards.height2x3
+                            } else {
+                                Cards.heightEpisode
+                            }
+                        }
                     ItemRow(
                         title = stringResource(R.string.more_like_this),
                         items = similar,
@@ -524,7 +532,7 @@ fun MovieDetailsContent(
                                 onLongClick = onLongClick,
                                 modifier = mod,
                                 showImageOverlay = true,
-                                imageHeight = Cards.height2x3,
+                                imageHeight = imageHeight,
                                 imageWidth = Dp.Unspecified,
                             )
                         },

app/src/main/java/com/github/damontecres/wholphin/ui/main/HomePage.kt

@@ -54,6 +54,7 @@ import com.github.damontecres.wholphin.ui.cards.ItemRow
 import com.github.damontecres.wholphin.ui.components.CircularProgress
 import com.github.damontecres.wholphin.ui.components.DialogParams
 import com.github.damontecres.wholphin.ui.components.DialogPopup
+import com.github.damontecres.wholphin.ui.components.EpisodeName
 import com.github.damontecres.wholphin.ui.components.EpisodeQuickDetails
 import com.github.damontecres.wholphin.ui.components.ErrorMessage
 import com.github.damontecres.wholphin.ui.components.LoadingPage
@@ -259,6 +260,9 @@ fun HomePageContent(
     LaunchedEffect(position) {
         listState.animateScrollToItem(position.row)
     }
+    LaunchedEffect(onUpdateBackdrop, focusedItem) {
+        focusedItem?.let { onUpdateBackdrop.invoke(it) }
+    }
     Box(modifier = modifier) {
         Column(modifier = Modifier.fillMaxSize()) {
             HomePageHeader(
@@ -379,7 +383,7 @@ fun HomePageContent(
                                                     .onFocusChanged {
                                                         if (it.isFocused) {
                                                             position = RowColumn(rowIndex, index)
-                                                            item?.let(onUpdateBackdrop)
+//                                                            item?.let(onUpdateBackdrop)
                                                         }
                                                         if (it.isFocused && onFocusPosition != null) {
                                                             val nonEmptyRowBefore =
@@ -466,13 +470,7 @@ fun HomePageHeader(
                 val subtitle = if (isEpisode) dto.name else null
                 val overview = dto.overview
                 subtitle?.let {
-                    Text(
+                    EpisodeName(it)
-                        text = subtitle,
-                        style = MaterialTheme.typography.headlineSmall,
-                        color = MaterialTheme.colorScheme.onBackground,
-                        maxLines = 1,
-                        overflow = TextOverflow.Ellipsis,
-                    )
                 }
                 when (item.type) {
                     BaseItemKind.EPISODE -> EpisodeQuickDetails(dto, Modifier)