Picker with fullscreen scrim, framed QR tile

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

app/build.gradle.kts

@@ -12,8 +12,8 @@ android {
         applicationId = "dev.castarr.tv"
         minSdk = 26
         targetSdk = 35
-        versionCode = 16
+        versionCode = 17
-        versionName = "0.8.0"
+        versionName = "0.8.1"
     }
 
     // Release signing from environment (see ~/.keys/castarr-release.env on the

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)
@@ -325,6 +338,7 @@ private fun PickerDialog(picker: Picker, onClose: () -> Unit) {
         }
         }
     }
+}
 
 /** Current value plus a small drawn caret, shown at a row's trailing edge. */
 @Composable
@@ -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))
+            .clip(RoundedCornerShape(18.dp))
-            .background(androidx.compose.ui.graphics.Color(0xFFFBFCFD))
+            .background(CastarrColors.bg)
-            .padding(14.dp),
+            .border(1.dp, CastarrColors.line, RoundedCornerShape(18.dp))
+            .padding(8.dp),
         verticalArrangement = Arrangement.Center,
+    ) {
+        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(170.dp),
+                modifier = Modifier.size(164.dp),
             )
         }
     }
+}