From 2341685fd3e2646eccaf3588fa0f407f0089eca4 Mon Sep 17 00:00:00 2001 From: Andrew Date: Mon, 17 Jun 2024 14:39:45 +0930 Subject: [PATCH] Standardise margins --- .../securesms/onboarding/LandingActivity.kt | 7 +- .../onboarding/LinkDeviceActivity.kt | 71 +++++++++---------- .../MessageNotifications.kt | 17 ++--- .../onboarding/pickname/PickDisplayName.kt | 61 ++++++++-------- .../recoverypassword/RecoveryPassword.kt | 1 - .../securesms/onboarding/ui/ContinueButton.kt | 36 ++++++++++ .../thoughtcrime/securesms/ui/Dimensions.kt | 5 +- .../securesms/ui/components/Button.kt | 1 - 8 files changed, 113 insertions(+), 86 deletions(-) create mode 100644 app/src/main/java/org/thoughtcrime/securesms/onboarding/ui/ContinueButton.kt diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/LandingActivity.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/LandingActivity.kt index 0cefbfcd2c..1d353fb102 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/LandingActivity.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/LandingActivity.kt @@ -94,7 +94,7 @@ class LandingActivity: BaseActionBarActivity() { @Preview @Composable - private fun LandingScreen( + private fun PreviewLandingScreen( @PreviewParameter(SessionColorsParameterProvider::class) colors: Colors ) { PreviewTheme(colors) { @@ -119,7 +119,8 @@ class LandingActivity: BaseActionBarActivity() { Column { Column(modifier = Modifier .weight(1f) - .padding(horizontal = LocalDimensions.current.marginMedium)) { + .padding(horizontal = LocalDimensions.current.marginOnboarding) + ) { Spacer(modifier = Modifier.weight(1f)) Text( stringResource(R.string.onboardingBubblePrivacyInYourPocket), @@ -132,7 +133,7 @@ class LandingActivity: BaseActionBarActivity() { LazyColumn( state = listState, modifier = Modifier - .heightIn(min = 200.dp) + .heightIn(min = LocalDimensions.current.minScrollableViewHeight) .fillMaxWidth() .weight(3f), verticalArrangement = Arrangement.spacedBy(LocalDimensions.current.itemSpacingSmall) diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/LinkDeviceActivity.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/LinkDeviceActivity.kt index c7d3d6ea55..da1bb483af 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/LinkDeviceActivity.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/LinkDeviceActivity.kt @@ -32,6 +32,7 @@ import org.session.libsession.utilities.TextSecurePreferences import org.thoughtcrime.securesms.BaseActionBarActivity import org.thoughtcrime.securesms.onboarding.loading.LoadingManager import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity +import org.thoughtcrime.securesms.onboarding.ui.ContinueButton import org.thoughtcrime.securesms.ui.LocalDimensions import org.thoughtcrime.securesms.ui.PreviewTheme import org.thoughtcrime.securesms.ui.base @@ -116,45 +117,43 @@ fun PreviewRecoveryPassword() { @Composable fun RecoveryPassword(state: LinkDeviceState, onChange: (String) -> Unit = {}, onContinue: () -> Unit = {}) { - Column( - modifier = Modifier.padding(horizontal = LocalDimensions.current.marginLarge) - ) { - Spacer(Modifier.weight(1f)) - Row { + Column { + Column( + modifier = Modifier.padding(horizontal = LocalDimensions.current.marginLarge) + .weight(1f) + ) { + Spacer(Modifier.weight(1f)) + Row { + Text( + stringResource(R.string.sessionRecoveryPassword), + style = h4 + ) + Spacer(Modifier.width(6.dp)) + Icon( + painter = painterResource(id = R.drawable.ic_shield_outline), + contentDescription = null, + ) + } + Spacer(Modifier.size(28.dp)) Text( - stringResource(R.string.sessionRecoveryPassword), - style = h4 + stringResource(R.string.activity_link_enter_your_recovery_password_to_load_your_account_if_you_haven_t_saved_it_you_can_find_it_in_your_app_settings), + style = base ) - Spacer(Modifier.width(6.dp)) - Icon( - painter = painterResource(id = R.drawable.ic_shield_outline), - contentDescription = null, + Spacer(Modifier.size(24.dp)) + SessionOutlinedTextField( + text = state.recoveryPhrase, + modifier = Modifier + .fillMaxWidth() + .contentDescription(R.string.AccessibilityId_recovery_phrase_input), + placeholder = stringResource(R.string.recoveryPasswordEnter), + onChange = onChange, + onContinue = onContinue, + error = state.error ) + + Spacer(Modifier.weight(2f)) } - Spacer(Modifier.size(28.dp)) - Text( - stringResource(R.string.activity_link_enter_your_recovery_password_to_load_your_account_if_you_haven_t_saved_it_you_can_find_it_in_your_app_settings), - style = base - ) - Spacer(Modifier.size(24.dp)) - SessionOutlinedTextField( - text = state.recoveryPhrase, - modifier = Modifier - .fillMaxWidth() - .contentDescription(R.string.AccessibilityId_recovery_phrase_input), - placeholder = stringResource(R.string.recoveryPasswordEnter), - onChange = onChange, - onContinue = onContinue, - error = state.error - ) - Spacer(Modifier.weight(2f)) - OutlineButton( - stringResource(R.string.continue_2), - modifier = Modifier - .align(Alignment.CenterHorizontally) - .padding(vertical = 20.dp) - .fillMaxWidth(), - onClick = onContinue - ) + + ContinueButton(modifier = Modifier.align(Alignment.CenterHorizontally), onContinue) } } diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/messagenotifications/MessageNotifications.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/messagenotifications/MessageNotifications.kt index 25a8c33138..420353ce5e 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/messagenotifications/MessageNotifications.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/messagenotifications/MessageNotifications.kt @@ -13,6 +13,7 @@ import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.tooling.preview.PreviewParameter import network.loki.messenger.R +import org.thoughtcrime.securesms.onboarding.ui.ContinueButton import org.thoughtcrime.securesms.ui.LocalDimensions import org.thoughtcrime.securesms.ui.PreviewTheme import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider @@ -42,7 +43,8 @@ fun MessageNotificationsScreen( ) { Column { Spacer(Modifier.weight(1f)) - Column(modifier = Modifier.padding(horizontal = LocalDimensions.current.marginMedium)) { + + Column(modifier = Modifier.padding(horizontal = LocalDimensions.current.marginOnboarding)) { Text(stringResource(R.string.notificationsMessage), style = h4) Spacer(Modifier.height(LocalDimensions.current.marginExtraSmall)) Text(stringResource(R.string.onboardingMessageNotificationExplaination), style = base) @@ -64,16 +66,9 @@ fun MessageNotificationsScreen( onClick = { setEnabled(false) } ) } + Spacer(Modifier.weight(1f)) - OutlineButton( - stringResource(R.string.continue_2), - modifier = Modifier - .padding(horizontal = LocalDimensions.current.marginLarge) - .contentDescription(R.string.AccessibilityId_continue) - .align(Alignment.CenterHorizontally) - .fillMaxWidth(), - onClick = onContinue - ) - Spacer(modifier = Modifier.height(LocalDimensions.current.marginExtraExtraSmall)) + + ContinueButton(Modifier.align(Alignment.CenterHorizontally), onContinue) } } diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt index 58f359760a..6264ffa143 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/pickname/PickDisplayName.kt @@ -5,7 +5,6 @@ import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.width import androidx.compose.material.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -14,9 +13,10 @@ import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import network.loki.messenger.R +import org.thoughtcrime.securesms.onboarding.ui.ContinueButton +import org.thoughtcrime.securesms.ui.LocalDimensions import org.thoughtcrime.securesms.ui.PreviewTheme import org.thoughtcrime.securesms.ui.base -import org.thoughtcrime.securesms.ui.components.OutlineButton import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField import org.thoughtcrime.securesms.ui.contentDescription import org.thoughtcrime.securesms.ui.h4 @@ -31,39 +31,34 @@ fun PreviewDisplayName() { @Composable fun DisplayName(state: State, onChange: (String) -> Unit = {}, onContinue: () -> Unit = {}) { - Column( - verticalArrangement = Arrangement.spacedBy(20.dp), - modifier = Modifier - .padding(horizontal = 50.dp) - .padding(bottom = 12.dp) - ) { - Spacer(modifier = Modifier.weight(1f)) - Text(stringResource(state.title), style = h4) - Text( - stringResource(state.description), - style = base, - modifier = Modifier.padding(bottom = 12.dp)) - - SessionOutlinedTextField( - text = state.displayName, + Column { + Column( + verticalArrangement = Arrangement.spacedBy(LocalDimensions.current.itemSpacingOnboarding), modifier = Modifier - .fillMaxWidth() - .contentDescription(R.string.AccessibilityId_enter_display_name), - placeholder = stringResource(R.string.displayNameEnter), - onChange = onChange, - onContinue = onContinue, - error = state.error?.let { stringResource(it) } - ) + .padding(horizontal = LocalDimensions.current.marginOnboarding) + .weight(1f) + ) { + Spacer(modifier = Modifier.weight(1f)) + Text(stringResource(state.title), style = h4) + Text( + stringResource(state.description), + style = base, + modifier = Modifier.padding(bottom = 12.dp)) - Spacer(modifier = Modifier.weight(2f)) + SessionOutlinedTextField( + text = state.displayName, + modifier = Modifier + .fillMaxWidth() + .contentDescription(R.string.AccessibilityId_enter_display_name), + placeholder = stringResource(R.string.displayNameEnter), + onChange = onChange, + onContinue = onContinue, + error = state.error?.let { stringResource(it) } + ) - OutlineButton( - stringResource(R.string.continue_2), - modifier = Modifier - .contentDescription(R.string.AccessibilityId_continue) - .align(Alignment.CenterHorizontally) - .width(262.dp), - onClick = onContinue, - ) + Spacer(modifier = Modifier.weight(2f)) + } + + ContinueButton(Modifier.align(Alignment.CenterHorizontally), onContinue) } } diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/recoverypassword/RecoveryPassword.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/recoverypassword/RecoveryPassword.kt index d17ae68b11..0f67629f6c 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/onboarding/recoverypassword/RecoveryPassword.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/recoverypassword/RecoveryPassword.kt @@ -42,7 +42,6 @@ import org.thoughtcrime.securesms.ui.contentDescription import org.thoughtcrime.securesms.ui.extraSmallMonospace import org.thoughtcrime.securesms.ui.h8 - @Preview @Composable fun PreviewRecoveryPasswordScreen( diff --git a/app/src/main/java/org/thoughtcrime/securesms/onboarding/ui/ContinueButton.kt b/app/src/main/java/org/thoughtcrime/securesms/onboarding/ui/ContinueButton.kt new file mode 100644 index 0000000000..87b104d255 --- /dev/null +++ b/app/src/main/java/org/thoughtcrime/securesms/onboarding/ui/ContinueButton.kt @@ -0,0 +1,36 @@ +package org.thoughtcrime.securesms.onboarding.ui + +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.stringResource +import network.loki.messenger.R +import org.thoughtcrime.securesms.ui.LocalDimensions +import org.thoughtcrime.securesms.ui.components.OutlineButton +import org.thoughtcrime.securesms.ui.contentDescription + +@Composable +fun ContinueButton(modifier: Modifier, onContinue: () -> Unit) { + OutlineButton( + stringResource(R.string.continue_2), + modifier = modifier + .contentDescription(R.string.AccessibilityId_continue) + .fillMaxWidth() + .padding(horizontal = LocalDimensions.current.marginLarge) + .padding(bottom = LocalDimensions.current.marginExtraExtraSmall), + onClick = onContinue, + ) +} + +@Composable +fun OnboardingButton(text: String, modifier: Modifier, onClick: () -> Unit) { + OutlineButton( + text, + modifier = modifier + .fillMaxWidth() + .padding(horizontal = LocalDimensions.current.marginLarge) + .padding(bottom = LocalDimensions.current.marginExtraExtraSmall), + onClick = onClick, + ) +} diff --git a/app/src/main/java/org/thoughtcrime/securesms/ui/Dimensions.kt b/app/src/main/java/org/thoughtcrime/securesms/ui/Dimensions.kt index 4c8fb38752..5f7323ce8b 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/ui/Dimensions.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/ui/Dimensions.kt @@ -10,13 +10,16 @@ data class Dimensions( val itemSpacingTiny: Dp = 4.dp, val itemSpacingExtraSmall: Dp = 8.dp, val itemSpacingSmall: Dp = 16.dp, + val itemSpacingOnboarding: Dp = 20.dp, val itemSpacingMedium: Dp = 24.dp, val marginTiny: Dp = 8.dp, val marginExtraExtraSmall: Dp = 12.dp, val marginExtraSmall: Dp = 16.dp, val marginSmall: Dp = 24.dp, val marginMedium: Dp = 32.dp, + val marginOnboarding: Dp = 36.dp, val marginLarge: Dp = 64.dp, val dividerIndent: Dp = 80.dp, - val appBarHeight: Dp = 64.dp + val appBarHeight: Dp = 64.dp, + val minScrollableViewHeight: Dp = 200.dp ) diff --git a/app/src/main/java/org/thoughtcrime/securesms/ui/components/Button.kt b/app/src/main/java/org/thoughtcrime/securesms/ui/components/Button.kt index 148c31da04..4382335550 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/ui/components/Button.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/ui/components/Button.kt @@ -50,7 +50,6 @@ import org.thoughtcrime.securesms.ui.baseBold import org.thoughtcrime.securesms.ui.color.Colors import org.thoughtcrime.securesms.ui.color.LocalColors import org.thoughtcrime.securesms.ui.color.radioButtonColors -import org.thoughtcrime.securesms.ui.color.slimOutlineButton import org.thoughtcrime.securesms.ui.contentDescription import org.thoughtcrime.securesms.ui.extraSmall import org.thoughtcrime.securesms.ui.h8