Fix invisible sparkle on welcome and sign-up screens in light mode (#50)

The welcome screen used theme-following surfaces with a hard-coded white
sparkle and white-derived text — in light display mode the sparkle
became white-on-white and the screen looked broken. Pin the welcome
screen to the brand navy (#1A2332, same as the launcher and splash)
regardless of theme so the white sparkle and title always have contrast,
extending the launcher/splash look into the first screen the user sees.

The sign-up/sign-in screen still follows the system theme since it has
chrome (buttons, links) that should match the rest of the app, so swap
its sparkle tint from hard-coded white to MaterialTheme.colorScheme.primary
so it's visible in both light and dark modes.

Mirrors NativeAppTemplate-Android#65.

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: dadachi

app/src/main/kotlin/com/nativeapptemplate/nativeapptemplatefree/ui/app_root/OnboardingView.kt

@@ -25,6 +25,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
@@ -38,8 +39,11 @@ import com.nativeapptemplate.nativeapptemplatefree.ui.common.NonScaledSp.nonScal
 internal fun OnboardingView(
   onStartClick: () -> Unit,
 ) {
+  val brandNavy = colorResource(R.color.ic_launcher_background)
+
   Scaffold(
-    topBar = { TopAppBar(onStartClick) },
+    topBar = { TopAppBar(onStartClick, brandNavy) },
+    containerColor = brandNavy,
     modifier = Modifier.fillMaxSize(),
   ) { padding ->
     Column(
@@ -60,7 +64,7 @@ internal fun OnboardingView(
       Spacer(Modifier.height(24.dp))
       Text(
         text = stringResource(R.string.welcome_to_app, stringResource(R.string.app_name)),
-        color = MaterialTheme.colorScheme.onBackground,
+        color = Color.White,
         fontSize = 34.sp.nonScaledSp,
         lineHeight = 41.sp.nonScaledSp,
         fontWeight = FontWeight.Bold,
@@ -76,13 +80,16 @@ internal fun OnboardingView(
 @Composable
 private fun TopAppBar(
   onStartClick: () -> Unit,
+  containerColor: Color,
 ) {
   val context = LocalContext.current
 
   CenterAlignedTopAppBar(
     colors = TopAppBarDefaults.topAppBarColors(
-      containerColor = MaterialTheme.colorScheme.primaryContainer,
-      titleContentColor = MaterialTheme.colorScheme.primary,
+      containerColor = containerColor,
+      titleContentColor = Color.White,
+      navigationIconContentColor = Color.White,
+      actionIconContentColor = Color.White,
     ),
     title = { Text("") },
     actions = {
@@ -91,6 +98,7 @@ private fun TopAppBar(
       ) {
         Text(
           "Start",
+          color = Color.White,
           style = MaterialTheme.typography.displaySmall,
         )
       }
@@ -101,6 +109,7 @@ private fun TopAppBar(
       ) {
         Text(
           stringResource(R.string.support_website),
+          color = Color.White,
         )
       }
     },

app/src/main/kotlin/com/nativeapptemplate/nativeapptemplatefree/ui/app_root/SignUpOrSignInView.kt

@@ -25,7 +25,6 @@ import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.LinkAnnotation
@@ -76,7 +75,7 @@ internal fun SignUpOrSignInView(
       Icon(
         imageVector = Icons.Filled.AutoAwesome,
         contentDescription = null,
-        tint = Color.White,
+        tint = MaterialTheme.colorScheme.primary,
         modifier = Modifier
           .fillMaxWidth()
           .height(256.dp)