diff --git a/apps/ios/Shared/Views/Badges/BadgesCheckOrderView.swift b/apps/ios/Shared/Views/Badges/BadgesCheckOrderView.swift index 997089bac3..130d0a0abb 100644 --- a/apps/ios/Shared/Views/Badges/BadgesCheckOrderView.swift +++ b/apps/ios/Shared/Views/Badges/BadgesCheckOrderView.swift @@ -35,16 +35,13 @@ struct BadgesCheckOrderView: View { orderRow("Duration", Text(period.label)) Divider() .padding(.top, 8) - orderRow("Total", period.priceText(store.price(level, period, compact: false)), total: true) + .padding(.bottom, 6) + orderRow("Total", period.priceText(store.price(level, period, compact: false))) } .padding(.horizontal, 24) .padding(.vertical, 12) .background(Color(uiColor: .secondarySystemGroupedBackground)) .clipShape(RoundedRectangle(cornerRadius: 16)) - .overlay( - RoundedRectangle(cornerRadius: 16) - .stroke(Color(uiColor: .secondarySystemFill), lineWidth: 1) - ) .padding(.top, 20) Spacer(minLength: 20) @@ -79,18 +76,17 @@ struct BadgesCheckOrderView: View { .alert(item: $alert) { $0.alert } } - private func orderRow(_ title: LocalizedStringKey, _ value: Text, total: Bool = false) -> some View { + private func orderRow(_ title: LocalizedStringKey, _ value: Text) -> some View { HStack { Text(title) - .fontWeight(total ? .semibold : .medium) - .foregroundColor(total ? nil : theme.colors.secondary) + .fontWeight(.medium) + .foregroundColor(theme.colors.secondary) Spacer() value .fontWeight(.semibold) } - .font(total ? .title3 : .body) - .padding(.top, total ? 14 : 8) - .padding(.bottom, 8) + .font(.body) + .padding(.vertical, 8) } private func payButton() -> some View { diff --git a/apps/ios/Shared/Views/Badges/BadgesChooseBadgeView.swift b/apps/ios/Shared/Views/Badges/BadgesChooseBadgeView.swift index 8561f6f3a1..a303710900 100644 --- a/apps/ios/Shared/Views/Badges/BadgesChooseBadgeView.swift +++ b/apps/ios/Shared/Views/Badges/BadgesChooseBadgeView.swift @@ -130,15 +130,15 @@ struct BadgesChooseBadgeView: View { Text(level.title) .font(.title3) .fontWeight(.bold) + BadgePeriod.monthly.priceText(store.price(level, .monthly)) + .font(.body) VStack(spacing: 2) { Text(level.fileSize) Text(level.fileStorage) } .font(.subheadline) .foregroundColor(theme.colors.secondary) - BadgePeriod.monthly.priceText(store.price(level, .monthly)) - .font(.body) - .padding(.bottom, 20) + .padding(.bottom, 20) } .multilineTextAlignment(.center) .padding(.horizontal, 12) diff --git a/apps/ios/Shared/Views/Badges/BadgesHowLongView.swift b/apps/ios/Shared/Views/Badges/BadgesHowLongView.swift index da43418924..2377a79a3b 100644 --- a/apps/ios/Shared/Views/Badges/BadgesHowLongView.swift +++ b/apps/ios/Shared/Views/Badges/BadgesHowLongView.swift @@ -138,12 +138,11 @@ struct BadgesHowLongView: View { .foregroundColor(isSelected ? theme.colors.primary : theme.colors.secondary) .opacity(forSale ? 1 : 0.4) Text(period.label) - .font(.body) + .font(.subheadline) period.priceText(store.price(level, period)) - .font(.title3) - .fontWeight(.semibold) - if forSale, let percent = savingsPercent(period) { - Text("Save \(percent)%") + .font(.headline) + if let percent = savingsPercent(period) { + Text("\(percent)% off") .font(.footnote) .foregroundColor(isSelected ? theme.colors.primary : theme.colors.secondary) } @@ -179,7 +178,7 @@ struct BadgesHowLongView: View { NavigationLink(isActive: $continueActive) { BadgesCheckOrderView(level: level, period: selectedPeriod) - .modifier(ThemedBackground()) + .modifier(ThemedBackground(grouped: true)) } label: { EmptyView() } diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesCheckOrderView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesCheckOrderView.kt index f7dced9587..2dbee3af48 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesCheckOrderView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesCheckOrderView.kt @@ -1,7 +1,6 @@ package chat.simplex.common.views.badges import androidx.compose.foundation.background -import androidx.compose.foundation.border import androidx.compose.foundation.layout.* import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.* @@ -9,7 +8,6 @@ import androidx.compose.runtime.* import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip -import androidx.compose.ui.graphics.Color import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp @@ -29,7 +27,7 @@ fun BadgesCheckOrderView(level: BadgeLevel, period: BadgePeriod, modalManager: M CloseWhenSupportGivesWay(modalManager) ColumnWithScrollBar( - Modifier.background(MaterialTheme.colors.background).padding(horizontal = 25.dp).padding(top = 8.dp, bottom = 20.dp), + Modifier.padding(horizontal = 25.dp).padding(top = 8.dp, bottom = 20.dp), verticalArrangement = Arrangement.spacedBy(16.dp), horizontalAlignment = Alignment.CenterHorizontally, maxIntrinsicSize = true, @@ -49,13 +47,12 @@ fun BadgesCheckOrderView(level: BadgeLevel, period: BadgePeriod, modalManager: M .padding(top = 20.dp) .clip(RoundedCornerShape(16.dp)) .background(sectionCardColor()) - .border(1.dp, MaterialTheme.colors.background.mixWith(MaterialTheme.colors.onBackground, 0.92f), RoundedCornerShape(16.dp)) .padding(horizontal = 24.dp, vertical = 12.dp) ) { OrderRow(MR.strings.badges_your_badge, stringResource(level.title)) OrderRow(MR.strings.badges_order_duration, stringResource(period.label)) - Divider(Modifier.padding(top = 8.dp)) - OrderRow(MR.strings.badges_order_total, period.priceText(BadgeStore.price(level, period, compact = false)), total = true) + Divider(Modifier.padding(top = 8.dp, bottom = 6.dp)) + OrderRow(MR.strings.badges_order_total, period.priceText(BadgeStore.price(level, period, compact = false))) } Spacer(Modifier.weight(1f).heightIn(min = 20.dp)) @@ -84,17 +81,11 @@ fun BadgesCheckOrderView(level: BadgeLevel, period: BadgePeriod, modalManager: M } @Composable -private fun OrderRow(title: StringResource, value: String, total: Boolean = false) { - val style = if (total) MaterialTheme.typography.h3 else MaterialTheme.typography.body1 - Row(Modifier.fillMaxWidth().padding(top = if (total) 14.dp else 8.dp, bottom = 8.dp)) { - Text( - stringResource(title), - style = style, - fontWeight = if (total) FontWeight.SemiBold else FontWeight.Medium, - color = if (total) Color.Unspecified else MaterialTheme.colors.secondary - ) +private fun OrderRow(title: StringResource, value: String) { + Row(Modifier.fillMaxWidth().padding(vertical = 8.dp)) { + Text(stringResource(title), style = MaterialTheme.typography.body1, fontWeight = FontWeight.Medium, color = MaterialTheme.colors.secondary) Spacer(Modifier.weight(1f)) - Text(value, style = style, fontWeight = FontWeight.SemiBold) + Text(value, style = MaterialTheme.typography.body1, fontWeight = FontWeight.SemiBold) } } diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesChooseBadgeView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesChooseBadgeView.kt index 22d61d20da..ca3dc357d2 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesChooseBadgeView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesChooseBadgeView.kt @@ -144,11 +144,11 @@ private fun LevelCard(level: BadgeLevel, selectedLevel: BadgeLevel, modifier: Mo modifier = Modifier.size(60.dp) ) Text(stringResource(level.title), style = MaterialTheme.typography.h3, fontWeight = FontWeight.Bold, textAlign = TextAlign.Center) + Text(BadgePeriod.Monthly.priceText(BadgeStore.price(level, BadgePeriod.Monthly)), style = MaterialTheme.typography.body1, textAlign = TextAlign.Center) Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.spacedBy(2.dp)) { Text(stringResource(level.fileSize), style = MaterialTheme.typography.body2, color = MaterialTheme.colors.secondary, textAlign = TextAlign.Center) Text(stringResource(level.fileStorage), style = MaterialTheme.typography.body2, color = MaterialTheme.colors.secondary, textAlign = TextAlign.Center) } - Text(BadgePeriod.Monthly.priceText(BadgeStore.price(level, BadgePeriod.Monthly)), style = MaterialTheme.typography.body1, textAlign = TextAlign.Center) } } diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesHowLongView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesHowLongView.kt index 9d30c785ad..5b430b7350 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesHowLongView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/badges/BadgesHowLongView.kt @@ -168,10 +168,10 @@ private fun PeriodCard(level: BadgeLevel, period: BadgePeriod, selectedPeriod: B tint = if (isSelected) MaterialTheme.colors.primary else MaterialTheme.colors.secondary, modifier = Modifier.size(32.dp).alpha(if (forSale) 1f else 0.4f) ) - Text(stringResource(period.label), style = MaterialTheme.typography.body1, color = textColor, textAlign = TextAlign.Center) - Text(period.priceText(BadgeStore.price(level, period)), style = MaterialTheme.typography.h3, fontWeight = FontWeight.SemiBold, color = textColor, textAlign = TextAlign.Center) + Text(stringResource(period.label), style = MaterialTheme.typography.body2, color = textColor, textAlign = TextAlign.Center) + Text(period.priceText(BadgeStore.price(level, period)), style = MaterialTheme.typography.body1, fontWeight = FontWeight.SemiBold, color = textColor, textAlign = TextAlign.Center) val percent = savingsPercent(level, period) - if (forSale && percent != null) { + if (percent != null) { Text( stringResource(MR.strings.badges_savings).format("${percent}%"), style = MaterialTheme.typography.body2, @@ -192,7 +192,7 @@ private fun ContinueButton(level: BadgeLevel, selectedPeriod: BadgePeriod, modal labelId = MR.strings.badges_continue, onboarding = null, onclick = { - modalManager.showModal { BadgesCheckOrderView(level, selectedPeriod, modalManager) } + modalManager.showModal(cardScreen = true) { BadgesCheckOrderView(level, selectedPeriod, modalManager) } } ) } diff --git a/apps/multiplatform/common/src/commonMain/resources/MR/base/strings.xml b/apps/multiplatform/common/src/commonMain/resources/MR/base/strings.xml index 9ae04740e2..98333123d8 100644 --- a/apps/multiplatform/common/src/commonMain/resources/MR/base/strings.xml +++ b/apps/multiplatform/common/src/commonMain/resources/MR/base/strings.xml @@ -3153,7 +3153,7 @@ Pay %1$s Loading… Not available - Save %1$s + %1$s off Supporter: 2 GB files available for 7 days. Legend: 5 GB files available for 21 days. 1 month