diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt index 085d1e9..f680e4a 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt @@ -34,6 +34,70 @@ import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.em import androidx.compose.ui.unit.sp +// region Header Card +@Composable +fun HeaderCard(modifier: Modifier = Modifier, balance: String) { + Surface( + shape = RoundedCornerShape(12.dp), + color = Color(0xfff9f9f9), + border = BorderStroke(1.dp, Color(0xffc6c6c6)), + modifier = modifier + .requiredWidth(width = 360.dp) + .clip(shape = RoundedCornerShape(12.dp)) + ) { + Row( + modifier = Modifier + .fillMaxWidth() + .padding(16.dp) + ) { + LayoutMediaTextHeader(modifier, balance) + } + } +} + +@Composable +fun LayoutMediaTextHeader(modifier: Modifier = Modifier, balance: String) { + Row( + verticalAlignment = Alignment.CenterVertically, + modifier = modifier + .fillMaxWidth() + ) { + Column( + verticalArrangement = Arrangement.spacedBy(4.dp, Alignment.Top), + horizontalAlignment = Alignment.End, // Align content to the right + modifier = Modifier + .weight(1f) + ) { + Text( + text = "your balance", + color = Color(0xff1b1b1b), + lineHeight = 1.5.em, + style = TextStyle( + fontSize = 16.sp, + fontWeight = FontWeight.Medium, + letterSpacing = 0.15.sp + ) + ) + Text( + text = balance, + color = Color(0xff1b1b1b), + lineHeight = 1.43.em, + style = TextStyle( + fontSize = 40.sp, + letterSpacing = 0.25.sp + ) + ) + } + } +} + +@Preview() +@Composable +private fun HeaderCardPreview() { + HeaderCard(Modifier, "-4500627.98€") +} +// endregion + // region Horizontal Card @Composable fun HorizontalCard(modifier: Modifier = Modifier, name: String, date: String, amount:String) {