From 22c129ee1cd2f6c4ffc8fdf0194b31165ccd4077 Mon Sep 17 00:00:00 2001 From: kari-ts <135075563+kari-ts@users.noreply.github.com> Date: Tue, 30 Apr 2024 09:21:00 -0700 Subject: [PATCH] android: accessibility fixes (#359) Updates tailscale/corp#18976 Signed-off-by: kari-ts --- .../java/com/tailscale/ipn/ui/theme/Theme.kt | 28 ++++++++++++------- .../com/tailscale/ipn/ui/view/AboutView.kt | 2 +- .../java/com/tailscale/ipn/ui/view/Avatar.kt | 7 ++++- .../tailscale/ipn/ui/view/ExitNodePicker.kt | 4 +-- .../com/tailscale/ipn/ui/view/SharedViews.kt | 2 +- android/src/main/res/values/strings.xml | 1 + 6 files changed, 29 insertions(+), 15 deletions(-) diff --git a/android/src/main/java/com/tailscale/ipn/ui/theme/Theme.kt b/android/src/main/java/com/tailscale/ipn/ui/theme/Theme.kt index 273df4e..6383199 100644 --- a/android/src/main/java/com/tailscale/ipn/ui/theme/Theme.kt +++ b/android/src/main/java/com/tailscale/ipn/ui/theme/Theme.kt @@ -86,11 +86,11 @@ private val LightColors = private val DarkColors = darkColorScheme( - primary = Color(0xFF4B70CC), // blue-500 + primary = Color(0xFF3E5DB3), // blue-600 onPrimary = Color(0xFFFFFFFF), // white primaryContainer = Color(0xFFf0f5ff), // blue-0 - onPrimaryContainer = Color(0xFF3f5eb3), // blue-600 - error = Color(0xFFB22D30), // red-500 + onPrimaryContainer = Color(0xFF5A82DC), // blue-400 + error = Color(0xFFEF5350), // red-400 onError = Color(0xFFFFFFFF), // white errorContainer = Color(0xFFfff6f4), // red-0 onErrorContainer = Color(0xFF940822), // red-600 @@ -150,7 +150,7 @@ val ColorScheme.off: Color } val ColorScheme.link: Color - get() = primary + get() = onPrimaryContainer /** * Main color scheme for list items, uses onPrimaryContainer color for leading and trailing icons. @@ -248,7 +248,7 @@ val ColorScheme.warningListItem: ListItemColors containerColor = MaterialTheme.colorScheme.warning, headlineColor = MaterialTheme.colorScheme.onPrimary, leadingIconColor = MaterialTheme.colorScheme.onPrimary, - overlineColor = MaterialTheme.colorScheme.onPrimary.copy(alpha = 0.7f), + overlineColor = MaterialTheme.colorScheme.onPrimary.copy(alpha = 0.8f), supportingTextColor = MaterialTheme.colorScheme.onPrimary, trailingIconColor = MaterialTheme.colorScheme.onPrimary, disabledHeadlineColor = default.disabledHeadlineColor, @@ -272,11 +272,19 @@ val ColorScheme.secondaryButton: ButtonColors @Composable get() { val defaults = ButtonDefaults.buttonColors() - return ButtonColors( - containerColor = Color(0xFF6D94EC), // blue-400 - contentColor = Color(0xFFFFFFFF), // white - disabledContainerColor = defaults.disabledContainerColor, - disabledContentColor = defaults.disabledContentColor) + if (isSystemInDarkTheme()) { + return ButtonColors( + containerColor = Color(0xFF4B70CC), // blue-500 + contentColor = Color(0xFFFFFFFF), // white + disabledContainerColor = defaults.disabledContainerColor, + disabledContentColor = defaults.disabledContentColor) + } else { + return ButtonColors( + containerColor = Color(0xFF5A82DC), // blue-400 + contentColor = Color(0xFFFFFFFF), // white + disabledContainerColor = defaults.disabledContainerColor, + disabledContentColor = defaults.disabledContentColor) + } } val ColorScheme.defaultTextColor: Color diff --git a/android/src/main/java/com/tailscale/ipn/ui/view/AboutView.kt b/android/src/main/java/com/tailscale/ipn/ui/view/AboutView.kt index d80356c..7640b6c 100644 --- a/android/src/main/java/com/tailscale/ipn/ui/view/AboutView.kt +++ b/android/src/main/java/com/tailscale/ipn/ui/view/AboutView.kt @@ -38,7 +38,7 @@ import com.tailscale.ipn.ui.theme.logoBackground fun AboutView(backToSettings: BackNavigation) { val localClipboardManager = LocalClipboardManager.current - Scaffold(topBar = { Header(R.string.about_view_title, onBack = backToSettings) }) { innerPadding + Scaffold(topBar = { Header(R.string.about_view_header, onBack = backToSettings) }) { innerPadding -> Column( verticalArrangement = diff --git a/android/src/main/java/com/tailscale/ipn/ui/view/Avatar.kt b/android/src/main/java/com/tailscale/ipn/ui/view/Avatar.kt index 82c061d..9f64878 100644 --- a/android/src/main/java/com/tailscale/ipn/ui/view/Avatar.kt +++ b/android/src/main/java/com/tailscale/ipn/ui/view/Avatar.kt @@ -17,9 +17,11 @@ import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.res.stringResource import androidx.compose.ui.unit.dp import coil.annotation.ExperimentalCoilApi import coil.compose.AsyncImage +import com.tailscale.ipn.R import com.tailscale.ipn.ui.model.IpnLocal @OptIn(ExperimentalCoilApi::class) @@ -34,7 +36,10 @@ fun Avatar(profile: IpnLocal.LoginProfile?, size: Int = 50, action: (() -> Unit) indication = rememberRipple(bounded = false), onClick = action) } - Icon(imageVector = Icons.Default.Person, contentDescription = null, modifier = modifier) + Icon( + imageVector = Icons.Default.Person, + contentDescription = stringResource(R.string.settings_title), + modifier = modifier) profile?.UserProfile?.ProfilePicURL?.let { url -> AsyncImage(model = url, modifier = Modifier.size((size * 1.2f).dp), contentDescription = null) diff --git a/android/src/main/java/com/tailscale/ipn/ui/view/ExitNodePicker.kt b/android/src/main/java/com/tailscale/ipn/ui/view/ExitNodePicker.kt index 4f77693..54c3bea 100644 --- a/android/src/main/java/com/tailscale/ipn/ui/view/ExitNodePicker.kt +++ b/android/src/main/java/com/tailscale/ipn/ui/view/ExitNodePicker.kt @@ -110,7 +110,7 @@ fun ExitNodeItem( trailingContent = { Row { if (node.selected) { - Icon(Icons.Outlined.Check, contentDescription = stringResource(R.string.selected)) + Icon(Icons.Outlined.Check, null) } } }) @@ -134,7 +134,7 @@ fun MullvadItem(nav: ExitNodePickerNav, count: Int, selected: Boolean) { }, trailingContent = { if (selected) { - Icon(Icons.Outlined.Check, contentDescription = stringResource(R.string.selected)) + Icon(Icons.Outlined.Check, null) } }) } diff --git a/android/src/main/java/com/tailscale/ipn/ui/view/SharedViews.kt b/android/src/main/java/com/tailscale/ipn/ui/view/SharedViews.kt index 9225c6f..0df763b 100644 --- a/android/src/main/java/com/tailscale/ipn/ui/view/SharedViews.kt +++ b/android/src/main/java/com/tailscale/ipn/ui/view/SharedViews.kt @@ -71,7 +71,7 @@ fun BackArrow(action: () -> Unit) { @Composable fun CheckedIndicator() { - Icon(Icons.Default.CheckCircle, "selected", tint = ts_color_light_blue) + Icon(Icons.Default.CheckCircle, null, tint = ts_color_light_blue) } @Composable diff --git a/android/src/main/res/values/strings.xml b/android/src/main/res/values/strings.xml index faa93e6..7f1c011 100644 --- a/android/src/main/res/values/strings.xml +++ b/android/src/main/res/values/strings.xml @@ -25,6 +25,7 @@ Tailscale Tailscale Version + About Tailscale Tailscale for Android Acknowledgements Privacy Policy