diff --git a/app/src/main/java/com/tomhempel/coordinatorapp/ui/components/CoordinatorBrand.kt b/app/src/main/java/com/tomhempel/coordinatorapp/ui/components/CoordinatorBrand.kt
new file mode 100644
index 0000000..0ddfb14
--- /dev/null
+++ b/app/src/main/java/com/tomhempel/coordinatorapp/ui/components/CoordinatorBrand.kt
@@ -0,0 +1,136 @@
+package com.tomhempel.coordinatorapp.ui.components
+
+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.Row
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
+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.Brush
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.vectorResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+import com.tomhempel.coordinatorapp.R
+
+@Composable
+fun CoordinatorMarkIcon(
+ modifier: Modifier = Modifier,
+ size: Dp = 24.dp,
+ contentDescription: String? = null,
+) {
+ Icon(
+ imageVector = ImageVector.vectorResource(R.drawable.ic_coordinator_mark),
+ contentDescription = contentDescription,
+ tint = MaterialTheme.colorScheme.primary,
+ modifier = modifier.size(size),
+ )
+}
+
+@Composable
+fun CoordinatorBrandBadge(
+ modifier: Modifier = Modifier,
+ size: Dp = 72.dp,
+ iconSize: Dp = 40.dp,
+) {
+ val scheme = MaterialTheme.colorScheme
+ Box(
+ modifier = modifier
+ .size(size)
+ .clip(RoundedCornerShape(22.dp))
+ .background(
+ Brush.linearGradient(
+ colors = listOf(
+ scheme.primary,
+ scheme.primary.copy(alpha = 0.82f),
+ scheme.primaryContainer,
+ ),
+ ),
+ ),
+ contentAlignment = Alignment.Center,
+ ) {
+ Icon(
+ imageVector = ImageVector.vectorResource(R.drawable.ic_coordinator_mark),
+ contentDescription = null,
+ tint = scheme.onPrimary,
+ modifier = Modifier.size(iconSize),
+ )
+ }
+}
+
+@Composable
+fun CoordinatorBrandHeader(
+ modifier: Modifier = Modifier,
+ subtitle: String = "Coordinator tools",
+ badgeSize: Dp = 72.dp,
+) {
+ val scheme = MaterialTheme.colorScheme
+ Column(
+ modifier = modifier,
+ horizontalAlignment = Alignment.CenterHorizontally,
+ verticalArrangement = Arrangement.spacedBy(14.dp),
+ ) {
+ CoordinatorBrandBadge(size = badgeSize)
+ Column(
+ horizontalAlignment = Alignment.CenterHorizontally,
+ verticalArrangement = Arrangement.spacedBy(6.dp),
+ ) {
+ Text(
+ text = "NAT-AS Coordinator",
+ style = MaterialTheme.typography.headlineMedium,
+ fontWeight = FontWeight.Bold,
+ color = scheme.onBackground,
+ )
+ Text(
+ text = subtitle,
+ style = MaterialTheme.typography.bodyLarge,
+ color = scheme.onSurfaceVariant,
+ )
+ }
+ }
+}
+
+@Composable
+fun CoordinatorAppBarTitle(
+ title: String,
+ subtitle: String,
+ modifier: Modifier = Modifier,
+) {
+ val scheme = MaterialTheme.colorScheme
+ Row(
+ modifier = modifier,
+ horizontalArrangement = Arrangement.spacedBy(12.dp),
+ verticalAlignment = Alignment.CenterVertically,
+ ) {
+ Box(
+ modifier = Modifier
+ .size(36.dp)
+ .clip(CircleShape)
+ .background(scheme.primaryContainer),
+ contentAlignment = Alignment.Center,
+ ) {
+ CoordinatorMarkIcon(size = 20.dp)
+ }
+ Column {
+ Text(
+ text = title,
+ fontWeight = FontWeight.SemiBold,
+ )
+ Text(
+ text = subtitle,
+ style = MaterialTheme.typography.bodySmall,
+ color = scheme.onSurfaceVariant,
+ )
+ }
+ }
+}
diff --git a/app/src/main/java/com/tomhempel/coordinatorapp/ui/counselors/CounselorsScreen.kt b/app/src/main/java/com/tomhempel/coordinatorapp/ui/counselors/CounselorsScreen.kt
index 7de4eaf..377f2c2 100644
--- a/app/src/main/java/com/tomhempel/coordinatorapp/ui/counselors/CounselorsScreen.kt
+++ b/app/src/main/java/com/tomhempel/coordinatorapp/ui/counselors/CounselorsScreen.kt
@@ -49,6 +49,7 @@ import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.unit.dp
import com.tomhempel.coordinatorapp.data.CounselorUser
+import com.tomhempel.coordinatorapp.ui.components.CoordinatorAppBarTitle
import com.tomhempel.coordinatorapp.ui.components.CoordinatorBackground
import com.tomhempel.coordinatorapp.ui.components.gridColumnCount
import com.tomhempel.coordinatorapp.ui.components.gridContentPadding
@@ -99,14 +100,10 @@ fun SessionManagementScreen(
}
},
title = {
- Column {
- Text("Session management", fontWeight = FontWeight.SemiBold)
- Text(
- text = "$username · ${formatRole(role)}",
- style = MaterialTheme.typography.bodySmall,
- color = MaterialTheme.colorScheme.onSurfaceVariant,
- )
- }
+ CoordinatorAppBarTitle(
+ title = "Session management",
+ subtitle = "$username · ${formatRole(role)}",
+ )
},
actions = {
IconButton(onClick = onRefresh, enabled = !isRefreshing) {
@@ -293,7 +290,7 @@ private fun ResetPasswordDialog(
text = {
Column(verticalArrangement = Arrangement.spacedBy(12.dp)) {
Text(
- text = "Set a new temporary password for ${counselor.username}. They must change it when signing in to the field app.",
+ text = "Set a new temporary password for ${counselor.username}. They must change it when signing in to the NAT-AS App.",
style = MaterialTheme.typography.bodyMedium,
)
diff --git a/app/src/main/java/com/tomhempel/coordinatorapp/ui/home/HomeScreen.kt b/app/src/main/java/com/tomhempel/coordinatorapp/ui/home/HomeScreen.kt
index abab68e..15af93a 100644
--- a/app/src/main/java/com/tomhempel/coordinatorapp/ui/home/HomeScreen.kt
+++ b/app/src/main/java/com/tomhempel/coordinatorapp/ui/home/HomeScreen.kt
@@ -26,6 +26,7 @@ import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
+import com.tomhempel.coordinatorapp.ui.components.CoordinatorAppBarTitle
import com.tomhempel.coordinatorapp.ui.components.CoordinatorBackground
import com.tomhempel.coordinatorapp.ui.components.FeatureTile
import com.tomhempel.coordinatorapp.ui.components.gridColumnCount
@@ -67,17 +68,10 @@ fun HomeScreen(
topBar = {
TopAppBar(
title = {
- Column {
- Text(
- text = "NAT-AS Coordinator",
- fontWeight = FontWeight.SemiBold,
- )
- Text(
- text = "$username · ${formatRole(role)}",
- style = MaterialTheme.typography.bodySmall,
- color = MaterialTheme.colorScheme.onSurfaceVariant,
- )
- }
+ CoordinatorAppBarTitle(
+ title = "NAT-AS Coordinator",
+ subtitle = "$username · ${formatRole(role)}",
+ )
},
actions = {
IconButton(onClick = onLogout) {
diff --git a/app/src/main/java/com/tomhempel/coordinatorapp/ui/login/LoginScreen.kt b/app/src/main/java/com/tomhempel/coordinatorapp/ui/login/LoginScreen.kt
index 8965b00..1092c3a 100644
--- a/app/src/main/java/com/tomhempel/coordinatorapp/ui/login/LoginScreen.kt
+++ b/app/src/main/java/com/tomhempel/coordinatorapp/ui/login/LoginScreen.kt
@@ -33,6 +33,8 @@ import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.unit.dp
import com.tomhempel.coordinatorapp.ui.components.AuthCard
import com.tomhempel.coordinatorapp.ui.components.CoordinatorBackground
+import com.tomhempel.coordinatorapp.ui.components.CoordinatorBrandBadge
+import com.tomhempel.coordinatorapp.ui.components.CoordinatorBrandHeader
import com.tomhempel.coordinatorapp.ui.components.ResponsiveContent
@Composable
@@ -62,17 +64,8 @@ fun LoginScreen(
.verticalScroll(rememberScrollState()),
horizontalAlignment = Alignment.CenterHorizontally,
) {
- Text(
- text = "NAT-AS Coordinator",
- style = MaterialTheme.typography.headlineMedium,
- fontWeight = FontWeight.Bold,
- color = MaterialTheme.colorScheme.onBackground,
- )
- Text(
- text = "Supervisor and admin tools",
- style = MaterialTheme.typography.bodyLarge,
- color = MaterialTheme.colorScheme.onSurfaceVariant,
- modifier = Modifier.padding(top = 8.dp, bottom = 28.dp),
+ CoordinatorBrandHeader(
+ modifier = Modifier.padding(bottom = 28.dp),
)
AuthCard {
@@ -149,7 +142,7 @@ fun LoginScreen(
Spacer(modifier = Modifier.height(20.dp))
Text(
- text = "Counselors sign in through the field app.",
+ text = "Counselors sign in through the NAT-AS App.",
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
@@ -185,7 +178,13 @@ fun ChangePasswordScreen(
modifier = Modifier
.fillMaxWidth()
.verticalScroll(rememberScrollState()),
+ horizontalAlignment = Alignment.CenterHorizontally,
) {
+ CoordinatorBrandBadge(
+ size = 56.dp,
+ iconSize = 30.dp,
+ modifier = Modifier.padding(bottom = 20.dp),
+ )
AuthCard {
Text(
text = "Choose a new password",
diff --git a/app/src/main/res/drawable/ic_coordinator_mark.xml b/app/src/main/res/drawable/ic_coordinator_mark.xml
new file mode 100644
index 0000000..5d7b258
--- /dev/null
+++ b/app/src/main/res/drawable/ic_coordinator_mark.xml
@@ -0,0 +1,43 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/app/src/main/res/drawable/ic_launcher_background.xml b/app/src/main/res/drawable/ic_launcher_background.xml
index 07d5da9..7086652 100644
--- a/app/src/main/res/drawable/ic_launcher_background.xml
+++ b/app/src/main/res/drawable/ic_launcher_background.xml
@@ -1,170 +1,25 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+