Additional tweaks to better match comps

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyQuestions.kt

@@ -233,22 +233,18 @@ private fun QuestionContent(
 
 @Composable
 private fun QuestionTitle(@StringRes title: Int) {
-    val backgroundColor = if (surfaceIsLight()) {
-        MaterialTheme.colorScheme.onSurface.copy(alpha = 0.04f)
-    } else {
-        MaterialTheme.colorScheme.onSurface.copy(alpha = 0.06f)
-    }
     Row(
         modifier = Modifier
             .fillMaxWidth()
             .background(
-                color = backgroundColor,
+                color = MaterialTheme.colorScheme.inverseOnSurface,
                 shape = MaterialTheme.shapes.small
             )
     ) {
         Text(
             text = stringResource(id = title),
             style = MaterialTheme.typography.titleMedium,
+            color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.87f),
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(vertical = 24.dp, horizontal = 16.dp)
@@ -598,6 +594,7 @@ private fun PhotoQuestion(
     OutlinedButton(
         onClick = { onAction(questionId, SurveyActionType.TAKE_PHOTO) },
         modifier = modifier,
+        shape = MaterialTheme.shapes.small,
         contentPadding = PaddingValues()
     ) {
         Column {
@@ -786,14 +783,16 @@ fun QuestionPreview() {
         description = R.string.select_one
     )
     JetsurveyTheme {
-        Question(
-            question = question,
-            shouldAskPermissions = true,
-            answer = null,
-            onAnswer = {},
-            onAction = { _, _ -> },
-            onDoNotAskForPermissions = {}
-        )
+        Surface {
+            Question(
+                question = question,
+                shouldAskPermissions = true,
+                answer = null,
+                onAnswer = {},
+                onAction = { _, _ -> },
+                onDoNotAskForPermissions = {}
+            )
+        }
     }
 }
 
@@ -802,7 +801,9 @@ fun QuestionPreview() {
 @Composable
 fun PhotoQuestionPreview() {
     JetsurveyTheme {
-        PhotoQuestion(questionId = 1, answer = null, onAction = { _, _ -> })
+        Surface {
+            PhotoQuestion(questionId = 1, answer = null, onAction = { _, _ -> })
+        }
     }
 }
 
@@ -811,6 +812,8 @@ fun PhotoQuestionPreview() {
 @Composable
 fun DateQuestionPreview() {
     JetsurveyTheme {
-        DateQuestion(questionId = 1, answer = null, onAction = {_, _ -> })
+        Surface {
+            DateQuestion(questionId = 1, answer = null, onAction = {_, _ -> })
+        }
     }
 }

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/survey/SurveyScreen.kt

@@ -52,9 +52,6 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.buildAnnotatedString
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.withStyle
 import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
 import com.example.compose.jetsurvey.R
@@ -202,24 +199,18 @@ private fun TopAppBarTitle(
     totalQuestionsCount: Int,
     modifier: Modifier = Modifier
 ) {
-    val indexStyle = MaterialTheme.typography.bodySmall.toSpanStyle().copy(
-        fontWeight = FontWeight.Bold
-    )
-    val totalStyle = MaterialTheme.typography.bodySmall.toSpanStyle()
-    val questionCount = stringResource(R.string.question_count, totalQuestionsCount)
-    val text = buildAnnotatedString {
-        withStyle(style = indexStyle) {
-            append("${questionIndex + 1}")
-        }
-        withStyle(style = totalStyle) {
-            append(questionCount)
-        }
+    Row (modifier = modifier){
+        Text(
+            text = (questionIndex+1).toString(),
+            style = MaterialTheme.typography.labelMedium,
+            color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f)
+        )
+        Text(
+            text = stringResource(R.string.question_count, totalQuestionsCount),
+            style = MaterialTheme.typography.labelMedium,
+            color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.38f)
+        )
     }
-    Text(
-        text = text,
-        style = MaterialTheme.typography.bodySmall,
-        modifier = modifier
-    )
 }
 
 @Composable
@@ -274,7 +265,8 @@ private fun SurveyBottomBar(
     onDonePressed: () -> Unit
 ) {
     Surface(
-        modifier = Modifier.fillMaxWidth()
+        modifier = Modifier.fillMaxWidth(),
+        shadowElevation = 7.dp,
     ) {
 
         Row(

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/theme/Color.kt

@@ -41,7 +41,7 @@ val md_theme_light_onSurface = Color(0xFF1D1B1E)
 val md_theme_light_surfaceVariant = Color(0xFFE8E0EB)
 val md_theme_light_onSurfaceVariant = Color(0xFF4A454E)
 val md_theme_light_outline = Color(0xFF7B757F)
-val md_theme_light_inverseOnSurface = Color(0xFFE7E1E5)
+val md_theme_light_inverseOnSurface = Color(0xFFF5EFF4)
 val md_theme_light_inverseSurface = Color(0xFF1D1B1E)
 val md_theme_light_inversePrimary = Color(0xFFD9B9FF)
 val md_theme_light_shadow = Color(0xFF000000)

Jetsurvey/app/src/main/java/com/example/compose/jetsurvey/theme/Theme.kt

@@ -22,7 +22,6 @@ import androidx.compose.material3.darkColorScheme
 import androidx.compose.material3.lightColorScheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.DisposableEffect
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.luminance
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
 
@@ -100,7 +99,7 @@ fun JetsurveyTheme(
     val systemUiController = rememberSystemUiController()
     DisposableEffect(systemUiController, useDarkTheme) {
         systemUiController.setSystemBarsColor(
-            color = Color.Transparent,
+            color = colors.surface,
             darkIcons = !useDarkTheme
         ) {
             md_theme_dark_surface