diff --git a/android/src/main/java/com/tailscale/ipn/ui/view/IntroView.kt b/android/src/main/java/com/tailscale/ipn/ui/view/IntroView.kt
index 3712377..d4f421a 100644
--- a/android/src/main/java/com/tailscale/ipn/ui/view/IntroView.kt
+++ b/android/src/main/java/com/tailscale/ipn/ui/view/IntroView.kt
@@ -4,22 +4,21 @@
package com.tailscale.ipn.ui.view
import androidx.compose.foundation.Image
-import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
-import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.clip
-import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
@@ -30,33 +29,36 @@ import com.tailscale.ipn.R
fun IntroView(onContinue: () -> Unit) {
Surface {
Column(
- modifier = Modifier.fillMaxHeight().padding(20.dp),
- horizontalAlignment = Alignment.CenterHorizontally) {
- Spacer(modifier = Modifier.height(30.dp))
+ modifier = Modifier.fillMaxHeight(),
+ horizontalAlignment = Alignment.CenterHorizontally,
+ verticalArrangement = Arrangement.Center) {
Image(
- modifier =
- Modifier.width(140.dp)
- .height(140.dp)
- .clip(RoundedCornerShape(50))
- .background(Color.Black)
- .padding(15.dp),
- painter = painterResource(id = R.drawable.ic_tile),
+ modifier = Modifier.width(80.dp).height(80.dp),
+ painter = painterResource(id = R.drawable.androidicon_light),
contentDescription = stringResource(R.string.app_icon_content_description))
- Spacer(modifier = Modifier.height(10.dp))
- Text(
- text = stringResource(R.string.tailscale),
- style = MaterialTheme.typography.headlineLarge)
- Spacer(modifier = Modifier.height(20.dp))
+ Spacer(modifier = Modifier.height(40.dp))
Text(
+ modifier = Modifier.padding(start = 40.dp, end = 40.dp, bottom = 40.dp),
text = stringResource(R.string.welcome1),
- style = MaterialTheme.typography.bodyMedium,
+ style = MaterialTheme.typography.bodyLarge,
textAlign = TextAlign.Center)
- Spacer(modifier = Modifier.height(20.dp))
- PrimaryActionButton(onClick = onContinue) {
+
+ Button(onClick = onContinue) {
Text(
text = stringResource(id = R.string.getStarted),
fontSize = MaterialTheme.typography.titleMedium.fontSize)
}
+ Spacer(modifier = Modifier.height(40.dp))
+ }
+
+ Box(
+ modifier = Modifier.fillMaxHeight().padding(start = 20.dp, end = 20.dp, bottom = 40.dp),
+ contentAlignment = Alignment.BottomCenter) {
+ Text(
+ text = stringResource(R.string.welcome2),
+ style = MaterialTheme.typography.bodyMedium,
+ color = MaterialTheme.colorScheme.onSurfaceVariant,
+ textAlign = TextAlign.Center)
}
}
}
diff --git a/android/src/main/res/drawable/androidicon_light.xml b/android/src/main/res/drawable/androidicon_light.xml
new file mode 100644
index 0000000..341e69f
--- /dev/null
+++ b/android/src/main/res/drawable/androidicon_light.xml
@@ -0,0 +1,34 @@
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/android/src/main/res/values/strings.xml b/android/src/main/res/values/strings.xml
index 4c50b5e..3b0c564 100644
--- a/android/src/main/res/values/strings.xml
+++ b/android/src/main/res/values/strings.xml
@@ -219,8 +219,8 @@
Taildrop failed
- Tailscale
- Get started
- Tailscale is a mesh VPN for securely connecting your devices. All connections are device-to-device, so we never see your data.\n\nWe collect and use your email address and name, as well as your device name, OS version, and IP address in order to help you to connect your devices and manage your settings. We log when you are connected to your network.\n
+ Get Started
+ Tailscale is a mesh VPN for securely connecting your devices.
+ All connections are device-to-device, so we never see your data. We collect and use your email address and name, as well as your device name, OS version, and IP address in order to help you to connect your devices and manage your settings. We log when you are connected to your network.