let5see/clawdbot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(android): make chat more Material

Browse Source
This commit is contained in:
Peter Steinberger
2025-12-17 23:57:14 +01:00
parent d12ca22b19
commit 0e201c4c18
3 changed files with 43 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/android/app/src/main/java/com/steipete/clawdis/node/ui/StatusPill.kt
View File

@@ -36,9 +36,9 @@ fun StatusPill(
onClick = onClick, onClick = onClick,
modifier = modifier, modifier = modifier,
shape = RoundedCornerShape(14.dp), shape = RoundedCornerShape(14.dp),
color = MaterialTheme.colorScheme.surface.copy(alpha = 0.86f), color = MaterialTheme.colorScheme.surfaceContainer.copy(alpha = 0.92f),
shadowElevation = 10.dp, shadowElevation = 3.dp,
border = BorderStroke(0.5.dp, Color.White.copy(alpha = 0.18f)), border = BorderStroke(0.5.dp, Color.White.copy(alpha = 0.10f)),
) { ) {
Row( Row(
modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp), modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp),

75
apps/android/app/src/main/java/com/steipete/clawdis/node/ui/chat/ChatComposer.kt
View File

@@ -1,6 +1,5 @@
package com.steipete.clawdis.node.ui.chat package com.steipete.clawdis.node.ui.chat
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
@@ -61,10 +60,10 @@ fun ChatComposer(
val canSend = pendingRunCount == 0 && (input.trim().isNotEmpty() || attachments.isNotEmpty()) && healthOk val canSend = pendingRunCount == 0 && (input.trim().isNotEmpty() || attachments.isNotEmpty()) && healthOk
Surface( Surface(
shape = RoundedCornerShape(16.dp), shape = MaterialTheme.shapes.large,
color = MaterialTheme.colorScheme.surfaceContainerHighest, color = MaterialTheme.colorScheme.surfaceContainer,
tonalElevation = 2.dp, tonalElevation = 0.dp,
shadowElevation = 6.dp, shadowElevation = 0.dp,
) { ) {
Column(modifier = Modifier.padding(10.dp), verticalArrangement = Arrangement.spacedBy(8.dp)) { Column(modifier = Modifier.padding(10.dp), verticalArrangement = Arrangement.spacedBy(8.dp)) {
Row( Row(
@@ -103,45 +102,37 @@ fun ChatComposer(
AttachmentsStrip(attachments = attachments, onRemoveAttachment = onRemoveAttachment) AttachmentsStrip(attachments = attachments, onRemoveAttachment = onRemoveAttachment)
} }
Surface( OutlinedTextField(
shape = RoundedCornerShape(12.dp), value = input,
color = MaterialTheme.colorScheme.surface, onValueChange = { input = it },
border = BorderStroke(1.dp, MaterialTheme.colorScheme.outline.copy(alpha = 0.35f)), modifier = Modifier.fillMaxWidth(),
) { placeholder = { Text("Message Clawd…") },
Column(modifier = Modifier.padding(10.dp), verticalArrangement = Arrangement.spacedBy(8.dp)) { minLines = 2,
OutlinedTextField( maxLines = 6,
value = input, )
onValueChange = { input = it },
modifier = Modifier.fillMaxWidth(),
placeholder = { Text("Message Clawd…") },
minLines = 2,
maxLines = 6,
)
Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) { Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) {
ConnectionPill(sessionKey = sessionKey, healthOk = healthOk) ConnectionPill(sessionKey = sessionKey, healthOk = healthOk)
Spacer(modifier = Modifier.weight(1f)) Spacer(modifier = Modifier.weight(1f))
if (pendingRunCount > 0) { if (pendingRunCount > 0) {
FilledTonalIconButton( FilledTonalIconButton(
onClick = onAbort, onClick = onAbort,
colors = colors =
IconButtonDefaults.filledTonalIconButtonColors( IconButtonDefaults.filledTonalIconButtonColors(
containerColor = Color(0x33E74C3C), containerColor = Color(0x33E74C3C),
contentColor = Color(0xFFE74C3C), contentColor = Color(0xFFE74C3C),
), ),
) { ) {
Icon(Icons.Default.Stop, contentDescription = "Abort") Icon(Icons.Default.Stop, contentDescription = "Abort")
} }
} else { } else {
FilledTonalIconButton(onClick = { FilledTonalIconButton(onClick = {
val text = input val text = input
input = "" input = ""
onSend(text) onSend(text)
}, enabled = canSend) { }, enabled = canSend) {
Icon(Icons.Default.ArrowUpward, contentDescription = "Send") Icon(Icons.Default.ArrowUpward, contentDescription = "Send")
}
}
} }
} }
} }

14
apps/android/app/src/main/java/com/steipete/clawdis/node/ui/chat/ChatMessageListCard.kt
View File

@@ -57,12 +57,12 @@ fun ChatMessageListCard(
Card( Card(
modifier = modifier.fillMaxWidth(), modifier = modifier.fillMaxWidth(),
shape = MaterialTheme.shapes.extraLarge, shape = MaterialTheme.shapes.large,
colors = colors =
CardDefaults.cardColors( CardDefaults.cardColors(
containerColor = MaterialTheme.colorScheme.surfaceContainerHighest, containerColor = MaterialTheme.colorScheme.surfaceContainer,
), ),
elevation = CardDefaults.cardElevation(defaultElevation = 6.dp), elevation = CardDefaults.cardElevation(defaultElevation = 0.dp),
) { ) {
Box(modifier = Modifier.fillMaxSize()) { Box(modifier = Modifier.fillMaxSize()) {
LazyColumn( LazyColumn(
@@ -120,10 +120,10 @@ private fun ChatStatusPill(
) { ) {
Surface( Surface(
modifier = modifier, modifier = modifier,
shape = MaterialTheme.shapes.extraLarge, shape = MaterialTheme.shapes.large,
color = MaterialTheme.colorScheme.surface.copy(alpha = 0.90f), color = MaterialTheme.colorScheme.surfaceContainerHighest.copy(alpha = 0.96f),
shadowElevation = 4.dp, shadowElevation = 1.dp,
tonalElevation = 2.dp, tonalElevation = 0.dp,
) { ) {
Row( Row(
modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp), modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp),