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

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

View file

@ -18,7 +18,6 @@ import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.ExperimentalLayoutApi
import androidx.compose.foundation.layout.FlowRow
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
@ -148,7 +147,7 @@ fun EmptyHero(userName: String, onPick: (String) -> Unit, modifier: Modifier = M
.padding(horizontal = 24.dp),
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)
Spacer(Modifier.height(24.dp))
Text("${greeting(now.hour)}, $userName", color = cs.onSurfaceVariant, fontSize = 17.sp)

View file

@ -9,7 +9,6 @@ import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.layout.widthIn
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
@ -86,8 +85,8 @@ fun ChatScreen(userName: String = "Bruno") {
MeshBackground {
Box(Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
// 1. Scrollable Chat Content
// Stretches to the full screen, allowing bubbles to scroll cleanly behind the floating glass panels.
// Responsive width capping and centering on tablets.
// Stretches to the full screen, allowing bubbles to scroll cleanly behind the floating bottom dock.
// Centered layout with responsive width capping on tablets.
if (messages.isEmpty()) {
EmptyHero(
userName = userName,
@ -103,7 +102,7 @@ fun ChatScreen(userName: String = "Bruno") {
.fillMaxSize()
.then(if (isTablet) Modifier.widthIn(max = 720.dp) else Modifier),
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
start = 16.dp,
end = 16.dp
@ -114,15 +113,7 @@ fun ChatScreen(userName: String = "Bruno") {
}
}
// 2. Floating Header (Translucent Frosted Glass, responsive centering)
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)
// 2. Floating Bottom Control Dock (responsive centering and clear bottom margins)
Column(
modifier = Modifier
.align(Alignment.BottomCenter)