diff --git a/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeScreen.kt b/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeScreen.kt index 104c31ea8d6b..0e8756c33dae 100644 --- a/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeScreen.kt +++ b/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/WooPosHomeScreen.kt @@ -128,17 +128,6 @@ private fun WooPosHomeScreen( label = "cartOverlayAnimated" ) - val totalsStartPaddingAnimatedDp by animateDpAsState( - when (state.screenPositionState) { - is WooPosHomeState.ScreenPositionState.Cart, - WooPosHomeState.ScreenPositionState.Checkout.NotPaid -> - 0.dp.toAdaptivePadding() - - WooPosHomeState.ScreenPositionState.Checkout.Paid -> 24.dp.toAdaptivePadding() - }, - label = "totalsStartPaddingAnimatedDp" - ) - val scrollState = buildScrollStateForNavigationBetweenState(state.screenPositionState) WooPosHomeScreen( state = state, @@ -147,7 +136,6 @@ private fun WooPosHomeScreen( cartWidthDp = cartWidthDp, cartOverlayIntensity = cartOverlayIntensityAnimated, totalsWidthDp = totalsWidthAnimatedDp, - totalsStartPaddingDp = totalsStartPaddingAnimatedDp, onHomeUIEvent, ) } @@ -160,7 +148,6 @@ private fun WooPosHomeScreen( cartWidthDp: Dp, cartOverlayIntensity: Float, totalsWidthDp: Dp, - totalsStartPaddingDp: Dp, onHomeUIEvent: (WooPosHomeUIEvent) -> Unit, ) { Box(modifier = Modifier.fillMaxSize()) { @@ -201,7 +188,7 @@ private fun WooPosHomeScreen( ) { WooPosHomeScreenTotals( modifier = Modifier - .width(totalsWidthDp - 24.dp.toAdaptivePadding() - totalsStartPaddingDp) + .width(totalsWidthDp) ) } } diff --git a/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/totals/payment/success/WooPosTotalsPaymentSuccessScreen.kt b/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/totals/payment/success/WooPosTotalsPaymentSuccessScreen.kt index f13399608abb..8736a02005ab 100644 --- a/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/totals/payment/success/WooPosTotalsPaymentSuccessScreen.kt +++ b/WooCommerce/src/main/kotlin/com/woocommerce/android/ui/woopos/home/totals/payment/success/WooPosTotalsPaymentSuccessScreen.kt @@ -1,10 +1,8 @@ package com.woocommerce.android.ui.woopos.home.totals.payment.success import androidx.compose.foundation.background -import androidx.compose.foundation.border import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth @@ -13,10 +11,8 @@ import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.width import androidx.compose.foundation.rememberScrollState -import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.verticalScroll import androidx.compose.material.ButtonDefaults -import androidx.compose.material.Divider import androidx.compose.material.Icon import androidx.compose.material.MaterialTheme import androidx.compose.material.OutlinedButton @@ -24,7 +20,6 @@ import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource @@ -43,33 +38,17 @@ fun WooPosPaymentSuccessScreen( onNewTransactionClicked: () -> Unit, ) { Column( - modifier = Modifier.fillMaxSize(), + modifier = Modifier + .fillMaxSize() + .background(Color(0xFF98F179)), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { Column( modifier = Modifier - .padding( - top = 24.dp.toAdaptivePadding(), - start = 24.dp.toAdaptivePadding(), - end = 24.dp.toAdaptivePadding(), - bottom = 0.dp - ) + .padding(24.dp.toAdaptivePadding()) .weight(1f) .fillMaxWidth() - .background( - color = MaterialTheme.colors.background, - shape = RoundedCornerShape(16.dp), - ) - .background( - brush = Brush.verticalGradient( - colors = listOf( - Color(152, 241, 121, 0), - Color(152, 241, 121, 0x1A) - ) - ), - shape = RoundedCornerShape(16.dp), - ) .verticalScroll(rememberScrollState()), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, @@ -81,18 +60,22 @@ fun WooPosPaymentSuccessScreen( tint = Color.Unspecified, contentDescription = null, ) - Spacer(modifier = Modifier.height(32.dp.toAdaptivePadding())) + Spacer(modifier = Modifier.height(16.dp.toAdaptivePadding())) Text( text = stringResource(R.string.woopos_payment_successful_label), style = MaterialTheme.typography.h4, fontWeight = FontWeight.Bold, textAlign = TextAlign.Center, - color = Color(0xFF004D40) + color = MaterialTheme.colors.onSurface ) - Spacer(modifier = Modifier.height(32.dp.toAdaptivePadding())) - - TotalsSummary(state) + Text( + text = stringResource(R.string.woopos_success_screen_total, state.orderTotalText), + style = MaterialTheme.typography.subtitle1, + textAlign = TextAlign.Center, + color = MaterialTheme.colors.onSurface, + modifier = Modifier.padding(24.dp.toAdaptivePadding()) + ) Spacer(modifier = Modifier.weight(1f)) } @@ -101,109 +84,26 @@ fun WooPosPaymentSuccessScreen( OutlinedButton( modifier = Modifier - .padding( - top = 0.dp.toAdaptivePadding(), - start = 24.dp.toAdaptivePadding(), - end = 24.dp.toAdaptivePadding(), - bottom = 24.dp.toAdaptivePadding(), - ) - .fillMaxWidth(), + .padding(24.dp.toAdaptivePadding()) + .height(80.dp.toAdaptivePadding()) + .width(600.dp.toAdaptivePadding()), colors = ButtonDefaults.outlinedButtonColors( - contentColor = MaterialTheme.colors.onSurface, + contentColor = MaterialTheme.colors.onSurface ), onClick = onNewTransactionClicked ) { - Row( - modifier = Modifier.padding(8.dp.toAdaptivePadding()), - verticalAlignment = Alignment.CenterVertically, - ) { - Icon( - modifier = Modifier.size(24.dp), - painter = painterResource(id = R.drawable.woo_pos_ic_return_home), - contentDescription = null - ) - Spacer(modifier = Modifier.width(12.dp.toAdaptivePadding())) - Text( - text = stringResource(R.string.woopos_new_transaction_button), - style = MaterialTheme.typography.h4, - fontWeight = FontWeight.SemiBold, - textAlign = TextAlign.Center, - ) - } - } - } -} - -@Composable -private fun TotalsSummary(state: WooPosTotalsViewState.PaymentSuccess) { - Column( - modifier = Modifier - .border( - width = (0.5).dp, - color = WooPosTheme.colors.border, - shape = RoundedCornerShape(8.dp) - ) - .padding(24.dp.toAdaptivePadding()) - .width(380.dp) - ) { - Row( - modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.SpaceBetween - ) { - Text( - text = stringResource(R.string.woopos_payment_subtotal_label), - style = MaterialTheme.typography.h6, - fontWeight = FontWeight.Normal - ) - Text( - text = state.orderSubtotalText, - style = MaterialTheme.typography.h6, - fontWeight = FontWeight.Normal - ) - } - - Spacer(modifier = Modifier.height(16.dp.toAdaptivePadding())) - - Divider(color = WooPosTheme.colors.border, thickness = 0.5.dp) - - Spacer(modifier = Modifier.height(16.dp.toAdaptivePadding())) - - Row( - modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.SpaceBetween - ) { - Text( - text = stringResource(R.string.woopos_payment_tax_label), - style = MaterialTheme.typography.h6, - fontWeight = FontWeight.Normal + Icon( + modifier = Modifier.size(20.dp.toAdaptivePadding()), + painter = painterResource(id = R.drawable.woo_pos_ic_return_home), + contentDescription = null ) + Spacer(modifier = Modifier.width(8.dp.toAdaptivePadding())) Text( - text = state.orderTaxText, + text = stringResource(R.string.woopos_new_order_button), style = MaterialTheme.typography.h6, - fontWeight = FontWeight.Normal - ) - } - - Spacer(modifier = Modifier.height(16.dp.toAdaptivePadding())) - - Divider(color = WooPosTheme.colors.border, thickness = 0.5.dp) - - Spacer(modifier = Modifier.height(16.dp.toAdaptivePadding())) - - Row( - modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.SpaceBetween - ) { - Text( - text = stringResource(R.string.woopos_payment_total_label), - style = MaterialTheme.typography.h6, - fontWeight = FontWeight.SemiBold - ) - Text( - text = state.orderTotalText, - style = MaterialTheme.typography.h4, - fontWeight = FontWeight.Bold, - color = Color(0xFF3C2861) + fontWeight = FontWeight.SemiBold, + color = MaterialTheme.colors.onSurface, + textAlign = TextAlign.Center ) } } diff --git a/WooCommerce/src/main/res/values/strings.xml b/WooCommerce/src/main/res/values/strings.xml index a07bb63ea589..f4d3c4b9092d 100644 --- a/WooCommerce/src/main/res/values/strings.xml +++ b/WooCommerce/src/main/res/values/strings.xml @@ -4218,7 +4218,7 @@ Cart icon Payment failed. Please try again. Payment successful - New transaction + New order Subtotal Tax Total @@ -4239,6 +4239,8 @@ Error indication icon Rerty Couldn\'t create order + A payment of %1$s was successfully made + Customer Orders