krypto/kaizen-app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(ui): sculpt KaizenOrb into a highly realistic 3D sphere with heavy volume shadows, and remove the redundant top header bar

Browse source
This commit is contained in:
Bruno Deanoz 2026-06-18 16:55:49 +02:00
parent 7a95f7735c
commit c3fb668ea1
2 changed files with 5 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
app/src/main/java/dev/kaizen/app/chat/ChatComponents.kt
View file

@ -18,7 +18,6 @@ import androidx.compose.foundation.isSystemInDarkTheme
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
import androidx.compose.foundation.layout.ExperimentalLayoutApi
import androidx.compose.foundation.layout.FlowRow import androidx.compose.foundation.layout.FlowRow
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.Spacer
@ -148,7 +147,7 @@ fun EmptyHero(userName: String, onPick: (String) -> Unit, modifier: Modifier = M
.padding(horizontal = 24.dp), .padding(horizontal = 24.dp),
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
) { ) {
Spacer(Modifier.height(88.dp)) // Clear the floating glass header Spacer(Modifier.height(48.dp)) // Clean native layout, reduced from 88.dp as there is no top bar
KaizenOrb(104.dp) KaizenOrb(104.dp)
Spacer(Modifier.height(24.dp)) Spacer(Modifier.height(24.dp))
Text("${greeting(now.hour)}, $userName", color = cs.onSurfaceVariant, fontSize = 17.sp) Text("${greeting(now.hour)}, $userName", color = cs.onSurfaceVariant, fontSize = 17.sp)

17
app/src/main/java/dev/kaizen/app/chat/ChatScreen.kt
View file

@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.navigationBarsPadding import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.layout.widthIn import androidx.compose.foundation.layout.widthIn
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items import androidx.compose.foundation.lazy.items
@ -86,8 +85,8 @@ fun ChatScreen(userName: String = "Bruno") {
MeshBackground { MeshBackground {
Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) { Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
// 1. Scrollable Chat Content // 1. Scrollable Chat Content
// Stretches to the full screen, allowing bubbles to scroll cleanly behind the floating glass panels. // Stretches to the full screen, allowing bubbles to scroll cleanly behind the floating bottom dock.
// Responsive width capping and centering on tablets. // Centered layout with responsive width capping on tablets.
if (messages.isEmpty()) { if (messages.isEmpty()) {
EmptyHero( EmptyHero(
userName = userName, userName = userName,
@ -103,7 +102,7 @@ fun ChatScreen(userName: String = "Bruno") {
.fillMaxSize() .fillMaxSize()
.then(if (isTablet) Modifier.widthIn(max = 720.dp) else Modifier), .then(if (isTablet) Modifier.widthIn(max = 720.dp) else Modifier),
contentPadding = PaddingValues( contentPadding = PaddingValues(
top = 92.dp, // Leaves luxurious room for the floating KaizenHeader + status bars top = 16.dp, // Clean, native layout allows messages to scroll all the way to the top status bar!
bottom = 152.dp, // Leaves luxurious room for the floating ModePills + ChatInput + bottom margins bottom = 152.dp, // Leaves luxurious room for the floating ModePills + ChatInput + bottom margins
start = 16.dp, start = 16.dp,
end = 16.dp end = 16.dp
@ -114,15 +113,7 @@ fun ChatScreen(userName: String = "Bruno") {
} }
} }
// 2. Floating Header (Translucent Frosted Glass, responsive centering) // 2. Floating Bottom Control Dock (responsive centering and clear bottom margins)
KaizenHeader(
modifier = Modifier
.align(Alignment.TopCenter)
.statusBarsPadding()
.then(if (isTablet) Modifier.widthIn(max = 720.dp) else Modifier)
)
// 3. Floating Bottom Control Dock (responsive centering and clear bottom margins)
Column( Column(
modifier = Modifier modifier = Modifier
.align(Alignment.BottomCenter) .align(Alignment.BottomCenter)