From e2e841d49f57cd24b9478fafe8dcdac1348d72e0 Mon Sep 17 00:00:00 2001
From: benjamin <b@benj.de>
Date: Wed, 26 Aug 2026 01:07:11 +0200
Subject: [PATCH] Picker with fullscreen scrim, framed QR tile

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 app/build.gradle.kts                          |  4 +-
 .../java/dev/castarr/tv/ui/SettingsScreen.kt  | 44 ++++++++++++++-----
 2 files changed, 36 insertions(+), 12 deletions(-)

diff --git a/app/build.gradle.kts b/app/build.gradle.kts
index 08c142b..f6b89df 100644
--- a/app/build.gradle.kts
+++ b/app/build.gradle.kts
@@ -12,8 +12,8 @@ android {
         applicationId = "dev.castarr.tv"
         minSdk = 26
         targetSdk = 35
-        versionCode = 16
-        versionName = "0.8.0"
+        versionCode = 17
+        versionName = "0.8.1"
     }
 
     // Release signing from environment (see ~/.keys/castarr-release.env on the
diff --git a/app/src/main/java/dev/castarr/tv/ui/SettingsScreen.kt b/app/src/main/java/dev/castarr/tv/ui/SettingsScreen.kt
index cd3b5f3..d5cb843 100644
--- a/app/src/main/java/dev/castarr/tv/ui/SettingsScreen.kt
+++ b/app/src/main/java/dev/castarr/tv/ui/SettingsScreen.kt
@@ -5,6 +5,7 @@ import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.Canvas
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.border
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -39,6 +40,7 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.compose.ui.window.Dialog
+import androidx.compose.ui.window.DialogProperties
 import androidx.tv.material3.Border
 import androidx.tv.material3.ClickableSurfaceDefaults
 import androidx.tv.material3.Surface
@@ -251,12 +253,23 @@ fun SettingsScreen(state: AppState) {
     }
 }
 
-/** TV-friendly dropdown replacement: a centered dialog listing the options. */
+/** TV-friendly dropdown replacement: fullscreen scrim, options centered. */
 @Composable
 private fun PickerDialog(picker: Picker, onClose: () -> Unit) {
     val selectedFocus = remember { FocusRequester() }
     LaunchedEffect(Unit) { selectedFocus.requestFocus() }
-    Dialog(onDismissRequest = onClose) {
+    Dialog(
+        onDismissRequest = onClose,
+        properties = DialogProperties(usePlatformDefaultWidth = false),
+    ) {
+        Box(
+            Modifier
+                .fillMaxSize()
+                // Own heavy scrim — the platform default is too light and
+                // lets the white QR card fight the panel.
+                .background(CastarrColors.bgDeep.copy(alpha = 0.88f)),
+            contentAlignment = Alignment.Center,
+        ) {
         Column(
             Modifier
                 .width(360.dp)
@@ -323,6 +336,7 @@ private fun PickerDialog(picker: Picker, onClose: () -> Unit) {
                 }
             }
         }
+        }
     }
 }
 
@@ -458,17 +472,27 @@ fun ActionButton(label: String, danger: Boolean = false, onClick: () -> Unit) {
 
 @Composable
 fun QrCard(bitmap: Bitmap) {
+    // Quiet zone stays white for scannability, but the tile sits in a
+    // bordered frame on the card instead of floating as a bare white block.
     Column(
         Modifier
-            .clip(RoundedCornerShape(16.dp))
-            .background(androidx.compose.ui.graphics.Color(0xFFFBFCFD))
-            .padding(14.dp),
+            .clip(RoundedCornerShape(18.dp))
+            .background(CastarrColors.bg)
+            .border(1.dp, CastarrColors.line, RoundedCornerShape(18.dp))
+            .padding(8.dp),
         verticalArrangement = Arrangement.Center,
     ) {
-        Image(
-            bitmap = bitmap.asImageBitmap(),
-            contentDescription = "QR-Code zum Koppeln",
-            modifier = Modifier.size(170.dp),
-        )
+        Column(
+            Modifier
+                .clip(RoundedCornerShape(12.dp))
+                .background(androidx.compose.ui.graphics.Color(0xFFF4F6F7))
+                .padding(10.dp),
+        ) {
+            Image(
+                bitmap = bitmap.asImageBitmap(),
+                contentDescription = "QR-Code zum Koppeln",
+                modifier = Modifier.size(164.dp),
+            )
+        }
     }
 }