gui improvements

app/src/main/kotlin/org/mjdev/tvapp/base/extensions/ComposeExt.kt

@@ -85,11 +85,13 @@ object ComposeExt {
         get() = !isFocused
 
     @Composable
-    fun computeCardHeight(): Dp = LocalConfiguration.current.let { config ->
+    fun computeCardWidth(
+        ratio: Float = 2.5f
+    ): Dp = LocalConfiguration.current.let { config ->
         if (config.orientation == Configuration.ORIENTATION_PORTRAIT)
-            config.screenHeightDp / 7f
+            config.screenWidthDp / ratio
         else
-            config.screenWidthDp / 7f
+            config.screenHeightDp / ratio
     }.dp
 
     @SuppressLint("RememberReturnType", "ComposableNaming")

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/card/Card.kt

@@ -125,7 +125,7 @@ fun CardDefaults.colorFocusBorder(
     colorFocused: Color = Color.Green,
     colorUnFocused: Color = Color.Black,
     colorPressed: Color = Color.Yellow,
-    width: Dp = 3.dp,
+    width: Dp = 1.dp,
     roundCornerSize: Dp = 8.dp
 ) = border(
 //    border = Border(

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/card/ItemCard.kt

@@ -25,7 +25,7 @@ import androidx.tv.material3.CardGlow
 import androidx.tv.material3.CardScale
 import androidx.tv.material3.CardShape
 import androidx.tv.material3.ExperimentalTvMaterial3Api
-import org.mjdev.tvapp.base.extensions.ComposeExt.computeCardHeight
+import org.mjdev.tvapp.base.extensions.ComposeExt.computeCardWidth
 import org.mjdev.tvapp.base.extensions.ComposeExt.rememberFocusState
 import org.mjdev.tvapp.base.extensions.ModifierExt.recomposeHighlighter
 import org.mjdev.tvapp.base.interfaces.ItemWithDescription
@@ -57,7 +57,7 @@ fun ItemCard(
             placeholder = placeholder
         )
     },
-    cardHeight: Dp = computeCardHeight(),
+    cardWidth: Dp = computeCardWidth(),
     focusState: MutableState<FocusState?> = rememberFocusState(item),
     onClick: (item: Any?) -> Unit = {},
 ) = FocusableCard(
@@ -71,7 +71,7 @@ fun ItemCard(
     colors = colors,
     border = border,
     glow = glow,
-    cardHeight = cardHeight,
+    cardWidth = cardWidth,
     imageRenderer = imageRenderer,
     placeholder = placeholder,
     onClick = onClick,

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/card/PhotoCard.kt

@@ -20,7 +20,7 @@ import androidx.compose.ui.unit.Dp
 import androidx.tv.material3.CardDefaults
 import androidx.tv.material3.CardScale
 import androidx.tv.material3.ExperimentalTvMaterial3Api
-import org.mjdev.tvapp.base.extensions.ComposeExt.computeCardHeight
+import org.mjdev.tvapp.base.extensions.ComposeExt.computeCardWidth
 import org.mjdev.tvapp.base.extensions.ComposeExt.rememberFocusState
 import org.mjdev.tvapp.base.extensions.ModifierExt.recomposeHighlighter
 import org.mjdev.tvapp.base.interfaces.ItemWithDescription
@@ -44,7 +44,7 @@ fun PhotoCard(
             contentDescription = (item as? ItemWithDescription<*>)?.description?.toString(),
         )
     },
-    cardHeight: Dp = computeCardHeight(),
+    cardWidth: Dp = computeCardWidth(),
     aspectRatio: Float = 16f / 9f,
     placeholder: @Composable () -> Unit = {},
     scale: CardScale = CardDefaults.scale(),
@@ -56,7 +56,7 @@ fun PhotoCard(
         contentScale = contentScale,
         focusState = focusState,
         aspectRatio = aspectRatio,
-        cardHeight = cardHeight,
+        cardWidth = cardWidth,
         scale = scale,
         imageRenderer = imageRenderer,
         placeholder = placeholder,

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/complex/FocusableCard.kt

@@ -11,9 +11,8 @@ package org.mjdev.tvapp.base.ui.components.complex
 import android.annotation.SuppressLint
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.size
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.MutableState
 import androidx.compose.ui.Modifier
@@ -33,7 +32,8 @@ import androidx.tv.material3.CardScale
 import androidx.tv.material3.CardShape
 import androidx.tv.material3.CompactCard
 import androidx.tv.material3.ExperimentalTvMaterial3Api
-import org.mjdev.tvapp.base.extensions.ComposeExt.computeCardHeight
+import androidx.tv.material3.MaterialTheme
+import org.mjdev.tvapp.base.extensions.ComposeExt.computeCardWidth
 import org.mjdev.tvapp.base.extensions.ComposeExt.isEditMode
 import org.mjdev.tvapp.base.extensions.ComposeExt.isFocused
 import org.mjdev.tvapp.base.extensions.ComposeExt.rememberFocusRequester
@@ -77,7 +77,7 @@ fun FocusableCard(
     focusRequester: FocusRequester = rememberFocusRequester(item),
     focusState: MutableState<FocusState?> = rememberFocusState(item),
     onFocusChange: (state: FocusState) -> Unit = {},
-    cardHeight: Dp = computeCardHeight(),
+    cardWidth: Dp = computeCardWidth(),
     aspectRatio: Float = 16f / 9f,
     onClick: (item: Any?) -> Unit = {},
 ) {
@@ -90,8 +90,10 @@ fun FocusableCard(
         glow = glow,
         modifier = modifier
             .recomposeHighlighter()
-            .height(cardHeight)
-            .width(cardHeight * aspectRatio)
+            .size(
+                width = cardWidth,
+                height = cardWidth / aspectRatio
+            )
             .focusState(focusState)
             .onFocusChanged { state ->
                 onFocusChange(state)
@@ -111,6 +113,7 @@ fun FocusableCard(
             AutoHideEmptyText(
                 modifier = Modifier.padding(4.dp),
                 maxLines = 1,
+                style = MaterialTheme.typography.titleSmall,
                 text = (item as? ItemWithTitle<*>)?.title
             )
         },
@@ -118,6 +121,7 @@ fun FocusableCard(
             AutoHideEmptyText(
                 modifier = Modifier.padding(4.dp),
                 maxLines = 1,
+                style = MaterialTheme.typography.displaySmall,
                 text = (item as? ItemWithSubtitle<*>)?.subtitle
             )
         },

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/image/PhotoImage.kt

@@ -53,7 +53,7 @@ fun PhotoImage(
     contrast: Float = 5f,
     @FloatRange(from = -255.0, to = 255.0)
     brightness: Float = -255f,
-    borderSize: Dp = 4.dp,
+    borderSize: Dp = 2.dp,
     borderColor: Color = Color.Black,
     roundCornerSize: Dp = 8.dp,
     shape: Shape = RoundedCornerShape(roundCornerSize),

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/navigation/NavigationRow.kt

@@ -58,8 +58,8 @@ fun NavigationRow(
     expandedWidth: Dp = 150.dp,
     roundCornerSize: Dp = 32.dp,
     shape: Shape = RoundedCornerShape(roundCornerSize),
-    strokeWidth: Dp = 2.dp,
-    margin: Dp = 2.dp,
+    strokeWidth: Dp = 1.dp,
+    margin: Dp = 0.dp,
     padding: Dp = 4.dp,
 //    brush: Brush? = BrushBuilder()
 //        .type(BrushBuilder.Vertical)

app/src/main/kotlin/org/mjdev/tvapp/base/ui/components/tv/TVRow.kt

@@ -42,7 +42,7 @@ fun TVRow(
     TvLazyRow(
         modifier = modifier.recomposeHighlighter(),
         state = state,
-        contentPadding = PaddingValues(contentPadding),
+        contentPadding = PaddingValues(contentPadding * 2, contentPadding),
         reverseLayout = reverseLayout,
         horizontalArrangement = horizontalArrangement,
         verticalAlignment = verticalAlignment,

app/src/main/kotlin/org/mjdev/tvapp/base/ui/theme/ThemeHelper.kt

@@ -10,32 +10,27 @@
 
 package org.mjdev.tvapp.base.ui.theme
 
-import android.app.Activity
 import android.os.Build
 import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.ReadOnlyComposable
-import androidx.compose.runtime.SideEffect
 import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
-import androidx.compose.ui.graphics.toArgb
-import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.TextUnit
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import androidx.core.view.ViewCompat
 import androidx.tv.material3.ColorScheme
 import androidx.tv.material3.ExperimentalTvMaterial3Api
 import androidx.tv.material3.MaterialTheme
 import androidx.tv.material3.darkColorScheme
 import androidx.tv.material3.lightColorScheme
 
-@Suppress("DEPRECATION", "UNUSED_PARAMETER")
+@Suppress("UNUSED_PARAMETER")
 @OptIn(ExperimentalTvMaterial3Api::class)
 @Composable
 fun ThemeHelper(
@@ -60,13 +55,13 @@ fun ThemeHelper(
         }
     }
 
-    val view = LocalView.current
-    if (!view.isInEditMode) {
-        SideEffect {
-            (view.context as Activity).window.statusBarColor = colorScheme.primary.toArgb()
-            ViewCompat.getWindowInsetsController(view)?.isAppearanceLightStatusBars = useDarkTheme
-        }
-    }
+//    val view = LocalView.current
+//    if (!view.isInEditMode) {
+//        SideEffect {
+//            (view.context as Activity).window.statusBarColor = colorScheme.primary.toArgb()
+//            ViewCompat.getWindowInsetsController(view)?.isAppearanceLightStatusBars = useDarkTheme
+//        }
+//    }
 
     MaterialTheme(
         colorScheme = colorScheme,