diff --git a/android/src/main/java/com/tailscale/ipn/ui/view/RunExitNodeView.kt b/android/src/main/java/com/tailscale/ipn/ui/view/RunExitNodeView.kt
index 6ce06a5..df512a1 100644
--- a/android/src/main/java/com/tailscale/ipn/ui/view/RunExitNodeView.kt
+++ b/android/src/main/java/com/tailscale/ipn/ui/view/RunExitNodeView.kt
@@ -6,11 +6,13 @@ package com.tailscale.ipn.ui.view
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.outlined.ArrowForward
+import androidx.compose.material3.Button
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
@@ -19,14 +21,12 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import com.tailscale.ipn.R
-import com.tailscale.ipn.ui.theme.ts_color_light_blue
import com.tailscale.ipn.ui.util.LoadingIndicator
import com.tailscale.ipn.ui.viewModel.ExitNodePickerNav
import com.tailscale.ipn.ui.viewModel.RunExitNodeViewModel
@@ -45,8 +45,9 @@ fun RunExitNodeView(
LoadingIndicator.Wrap {
Column(
horizontalAlignment = Alignment.CenterHorizontally,
- verticalArrangement = Arrangement.spacedBy(16.dp, alignment = Alignment.Top),
- modifier = Modifier.padding(innerPadding).padding(16.dp).fillMaxHeight()) {
+ verticalArrangement =
+ Arrangement.spacedBy(24.dp, alignment = Alignment.CenterVertically),
+ modifier = Modifier.padding(innerPadding).padding(24.dp).fillMaxHeight()) {
RunExitNodeGraphic()
if (isRunningExitNode) {
@@ -64,15 +65,16 @@ fun RunExitNodeView(
fontWeight = FontWeight.SemiBold)
Text(stringResource(R.string.run_exit_node_explainer))
}
- Text(stringResource(R.string.run_exit_node_caution), color = Color.Red)
+ Text(stringResource(R.string.run_exit_node_caution))
- PrimaryActionButton(onClick = { model.setRunningExitNode(!isRunningExitNode) }) {
+ Button(onClick = { model.setRunningExitNode(!isRunningExitNode) }) {
if (isRunningExitNode) {
Text(stringResource(R.string.stop_running_as_exit_node))
} else {
Text(stringResource(R.string.start_running_as_exit_node))
}
}
+ Spacer(modifier = Modifier.size(24.dp))
}
}
}
@@ -82,7 +84,11 @@ fun RunExitNodeView(
fun RunExitNodeGraphic() {
@Composable
fun ArrowForward() {
- Icon(Icons.AutoMirrored.Outlined.ArrowForward, "Arrow Forward", modifier = Modifier.size(24.dp))
+ Icon(
+ Icons.AutoMirrored.Outlined.ArrowForward,
+ "Arrow Forward",
+ modifier = Modifier.size(24.dp),
+ tint = MaterialTheme.colorScheme.onSurfaceVariant)
}
Row(
@@ -92,19 +98,19 @@ fun RunExitNodeGraphic() {
Icon(
painter = painterResource(id = R.drawable.computer),
"Computer icon",
- tint = ts_color_light_blue,
+ tint = MaterialTheme.colorScheme.onSurface,
modifier = Modifier.size(36.dp))
ArrowForward()
Icon(
painter = painterResource(id = R.drawable.android),
"Android icon",
- tint = ts_color_light_blue,
+ tint = MaterialTheme.colorScheme.onSurface,
modifier = Modifier.size(36.dp))
ArrowForward()
Icon(
painter = painterResource(id = R.drawable.globe),
"Globe icon",
- tint = ts_color_light_blue,
+ tint = MaterialTheme.colorScheme.onSurface,
modifier = Modifier.size(36.dp))
}
}
diff --git a/android/src/main/res/values/strings.xml b/android/src/main/res/values/strings.xml
index 4c50b5e..46fde52 100644
--- a/android/src/main/res/values/strings.xml
+++ b/android/src/main/res/values/strings.xml
@@ -116,11 +116,11 @@
Mullvad VPN
Best available
Run as exit node
- Run this device as an exit node?
+ Run as exit node?
Other devices in your tailnet will be able to route their internet traffic through this Android device. Make sure to approve this exit node in the admin console in order for other devices to see it.
- Caution: Running an exit node will severely impact battery life. On a metered data plan, significant cellular data charges may also apply. Always disable this feature when no longer needed.
+ Running an exit node will severely impact battery life. On a metered data plan, significant cellular data charges may also apply. Always disable this feature when no longer needed.
Stop running as exit node
- Start running as exit node
+ Run as exit node
Now running as exit node
Other devices in your tailnet can now route their internet traffic through this Android device. Make sure to approve this exit node in the admin console in order for other devices to see it.
Enabled