Cleaning up more dimensions

This commit is contained in:
ThomasSession 2024-06-18 14:25:08 +10:00
parent b24d331cc5
commit 96d09f3367
14 changed files with 71 additions and 46 deletions

View File

@ -10,7 +10,9 @@ import androidx.compose.foundation.layout.Arrangement.Absolute.spacedBy
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
@ -39,6 +41,7 @@ import org.thoughtcrime.securesms.ui.components.SlimOutlineButton
import org.thoughtcrime.securesms.ui.components.SlimOutlineCopyButton import org.thoughtcrime.securesms.ui.components.SlimOutlineCopyButton
import org.thoughtcrime.securesms.ui.contentDescription import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.createThemedComposeView import org.thoughtcrime.securesms.ui.createThemedComposeView
import org.thoughtcrime.securesms.ui.extraSmallMonospace
import org.thoughtcrime.securesms.ui.small import org.thoughtcrime.securesms.ui.small
@AndroidEntryPoint @AndroidEntryPoint
@ -78,39 +81,36 @@ private fun InviteFriend(
Column(modifier = Modifier.background(LocalColors.current.backgroundSecondary)) { Column(modifier = Modifier.background(LocalColors.current.backgroundSecondary)) {
AppBar(stringResource(R.string.invite_a_friend), onBack = onBack, onClose = onClose) AppBar(stringResource(R.string.invite_a_friend), onBack = onBack, onClose = onClose)
Column( Column(
modifier = Modifier.padding(horizontal = 24.dp), modifier = Modifier.padding(horizontal = LocalDimensions.current.itemSpacingMedium),
verticalArrangement = spacedBy(10.dp)
) { ) {
Box( Text(
accountId,
modifier = Modifier modifier = Modifier
.contentDescription(R.string.AccessibilityId_recovery_password_container)
.fillMaxWidth()
.border( .border(
width = 1.dp, width = LocalDimensions.current.borderStroke,
color = LocalColors.current.textSecondary, color = LocalColors.current.borders,
shape = MaterialTheme.shapes.small shape = MaterialTheme.shapes.small
) )
.fillMaxWidth() .padding(LocalDimensions.current.marginSmall),
.wrapContentHeight() textAlign = TextAlign.Center,
) { style = base
Text( )
accountId,
modifier = Modifier Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingXSmall))
.contentDescription("Your account ID")
.align(Alignment.Center)
.padding(22.dp),
textAlign = TextAlign.Center,
style = base
)
}
Text( Text(
stringResource(R.string.invite_your_friend_to_chat_with_you_on_session_by_sharing_your_account_id_with_them), stringResource(R.string.invite_your_friend_to_chat_with_you_on_session_by_sharing_your_account_id_with_them),
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
style = small, style = small,
color = LocalColors.current.textSecondary, color = LocalColors.current.textSecondary,
modifier = Modifier.padding(horizontal = 8.dp) modifier = Modifier.padding(horizontal = LocalDimensions.current.itemSpacingSmall)
) )
Row(horizontalArrangement = spacedBy(20.dp)) { Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingSmall))
Row(horizontalArrangement = spacedBy(LocalDimensions.current.itemSpacingSmall)) {
SlimOutlineButton( SlimOutlineButton(
stringResource(R.string.share), stringResource(R.string.share),
modifier = Modifier modifier = Modifier

View File

@ -37,7 +37,7 @@ internal fun SeedReminder(startRecoveryPasswordActivity: () -> Unit) {
Box( Box(
Modifier Modifier
.fillMaxWidth() .fillMaxWidth()
.height(4.dp) .height(LocalDimensions.current.indicatorHeight)
.background(LocalColors.current.primary) .background(LocalColors.current.primary)
) )
Row( Row(

View File

@ -80,7 +80,7 @@ private fun RecoveryPassword(state: State, onChange: (String) -> Unit = {}, onCo
stringResource(R.string.sessionRecoveryPassword), stringResource(R.string.sessionRecoveryPassword),
style = h4 style = h4
) )
Spacer(Modifier.width(6.dp)) Spacer(Modifier.width(LocalDimensions.current.itemSpacingXXSmall))
Icon( Icon(
painter = painterResource(id = R.drawable.ic_shield_outline), painter = painterResource(id = R.drawable.ic_shield_outline),
contentDescription = null, contentDescription = null,

View File

@ -4,6 +4,7 @@ import androidx.compose.animation.core.Animatable
import androidx.compose.animation.core.TweenSpec import androidx.compose.animation.core.TweenSpec
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height
import androidx.compose.material.Text import androidx.compose.material.Text
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.LaunchedEffect
@ -12,6 +13,7 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import network.loki.messenger.R import network.loki.messenger.R
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.ProgressArc import org.thoughtcrime.securesms.ui.ProgressArc
import org.thoughtcrime.securesms.ui.base import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.contentDescription import org.thoughtcrime.securesms.ui.contentDescription
@ -39,6 +41,7 @@ internal fun LoadingScreen(state: State) {
stringResource(R.string.waitOneMoment), stringResource(R.string.waitOneMoment),
style = h7 style = h7
) )
Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingTiny))
Text( Text(
stringResource(R.string.loadAccountProgressMessage), stringResource(R.string.loadAccountProgressMessage),
style = base style = base

View File

@ -99,7 +99,7 @@ private fun NotificationRadioButton(
shape = RoundedCornerShape(8.dp) shape = RoundedCornerShape(8.dp)
) { ) {
Column( Column(
verticalArrangement = Arrangement.spacedBy(6.dp) verticalArrangement = Arrangement.spacedBy(LocalDimensions.current.itemSpacingXXSmall)
) { ) {
Text(stringResource(title), style = h8) Text(stringResource(title), style = h8)
Text(stringResource(explanation), style = small) Text(stringResource(explanation), style = small)

View File

@ -403,7 +403,7 @@ class SettingsActivity : PassphraseRequiredActionBarActivity() {
) )
} }
Spacer(modifier = Modifier.height(24.dp)) Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingMedium))
var hasPaths by remember { var hasPaths by remember {
mutableStateOf(false) mutableStateOf(false)

View File

@ -114,7 +114,7 @@ private fun RecoveryPasswordCell(seed: String, copySeed:() -> Unit = {}) {
AnimatedVisibility(!showQr) { AnimatedVisibility(!showQr) {
Row( Row(
horizontalArrangement = Arrangement.spacedBy(LocalDimensions.current.marginMedium), horizontalArrangement = Arrangement.spacedBy(LocalDimensions.current.itemSpacingSmall),
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically
) { ) {
SlimOutlineCopyButton( SlimOutlineCopyButton(
@ -146,7 +146,7 @@ private fun RecoveryPassword(seed: String) {
.contentDescription(R.string.AccessibilityId_recovery_password_container) .contentDescription(R.string.AccessibilityId_recovery_password_container)
.padding(vertical = LocalDimensions.current.marginSmall) .padding(vertical = LocalDimensions.current.marginSmall)
.border( .border(
width = 1.dp, width = LocalDimensions.current.borderStroke,
color = LocalColors.current.borders, color = LocalColors.current.borders,
shape = MaterialTheme.shapes.small shape = MaterialTheme.shapes.small
) )

View File

@ -44,7 +44,11 @@ fun AlertDialog(
onClick = onDismissRequest, onClick = onDismissRequest,
modifier = Modifier.align(Alignment.TopEnd) modifier = Modifier.align(Alignment.TopEnd)
) { ) {
Icon(painter = painterResource(id = R.drawable.ic_dialog_x), tint = LocalColors.current.text, contentDescription = "back") Icon(
painter = painterResource(id = R.drawable.ic_dialog_x),
tint = LocalColors.current.text,
contentDescription = "back"
)
} }
Column(modifier = Modifier.fillMaxWidth()) { Column(modifier = Modifier.fillMaxWidth()) {
@ -52,14 +56,24 @@ fun AlertDialog(
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.padding(top = 24.dp) .padding(top = LocalDimensions.current.itemSpacingSmall)
.padding(horizontal = 24.dp) .padding(horizontal = LocalDimensions.current.itemSpacingSmall)
) { ) {
title?.let { title?.let {
Text(it, textAlign = TextAlign.Center, style = h7, modifier = Modifier.padding(bottom = 8.dp)) Text(
it,
textAlign = TextAlign.Center,
style = h7,
modifier = Modifier.padding(bottom = LocalDimensions.current.itemSpacingXXSmall)
)
} }
text?.let { text?.let {
Text(it, textAlign = TextAlign.Center, style = large, modifier = Modifier.padding(bottom = 8.dp)) Text(
it,
textAlign = TextAlign.Center,
style = large,
modifier = Modifier.padding(bottom = LocalDimensions.current.itemSpacingXXSmall)
)
} }
} }
buttons?.takeIf { it.isNotEmpty() }?.let { buttons?.takeIf { it.isNotEmpty() }?.let {
@ -95,8 +109,8 @@ fun DialogButton(text: String, modifier: Modifier, onClick: () -> Unit) {
color = LocalColors.current.text, color = LocalColors.current.text,
style = largeBold, style = largeBold,
modifier = Modifier.padding( modifier = Modifier.padding(
top = 16.dp, top = LocalDimensions.current.itemSpacingSmall,
bottom = 24.dp bottom = LocalDimensions.current.itemSpacingMedium
) )
) )
} }

View File

@ -23,5 +23,8 @@ data class Dimensions(
val dividerIndent: Dp = 80.dp, val dividerIndent: Dp = 80.dp,
val appBarHeight: Dp = 64.dp, val appBarHeight: Dp = 64.dp,
val minScrollableViewHeight: Dp = 200.dp, val minScrollableViewHeight: Dp = 200.dp,
val marginHomeEmptyView: Dp = 50.dp val marginHomeEmptyView: Dp = 50.dp,
val indicatorHeight: Dp = 4.dp,
val borderStroke: Dp = 1.dp
) )

View File

@ -60,7 +60,7 @@ fun Button(
type: ButtonType, type: ButtonType,
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
enabled: Boolean = true, enabled: Boolean = true,
size: ButtonStyle = ButtonStyle.Large, style: ButtonStyle = ButtonStyle.Large,
elevation: ButtonElevation? = type.elevation, elevation: ButtonElevation? = type.elevation,
shape: Shape = MaterialTheme.shapes.large, shape: Shape = MaterialTheme.shapes.large,
border: BorderStroke? = type.border(color, enabled), border: BorderStroke? = type.border(color, enabled),
@ -68,10 +68,10 @@ fun Button(
interactionSource: MutableInteractionSource = remember { MutableInteractionSource() }, interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
content: @Composable RowScope.() -> Unit content: @Composable RowScope.() -> Unit
) { ) {
size.applyButtonConstraints { style.applyButtonConstraints {
androidx.compose.material.Button( androidx.compose.material.Button(
onClick, onClick,
modifier.heightIn(min = size.minHeight), modifier.heightIn(min = style.minHeight),
enabled, enabled,
interactionSource, interactionSource,
elevation, elevation,
@ -80,7 +80,7 @@ fun Button(
colors colors
) { ) {
// Button sets LocalTextStyle, so text style is applied inside to override that. // Button sets LocalTextStyle, so text style is applied inside to override that.
size.applyTextConstraints { style.applyTextConstraints {
content() content()
} }
} }
@ -158,7 +158,7 @@ fun OutlineCopyButton(
Button( Button(
modifier = modifier.contentDescription(R.string.AccessibilityId_copy_button), modifier = modifier.contentDescription(R.string.AccessibilityId_copy_button),
interactionSource = interactionSource, interactionSource = interactionSource,
size = size, style = size,
type = ButtonType.Outline, type = ButtonType.Outline,
color = color, color = color,
onClick = onClick onClick = onClick

View File

@ -7,6 +7,7 @@ import androidx.compose.material.ButtonElevation
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.color.LocalColors import org.thoughtcrime.securesms.ui.color.LocalColors
interface ButtonType { interface ButtonType {
@ -19,7 +20,10 @@ interface ButtonType {
object Outline: ButtonType { object Outline: ButtonType {
@Composable @Composable
override fun border(color: Color, enabled: Boolean) = override fun border(color: Color, enabled: Boolean) =
BorderStroke(1.dp, if (enabled) color else LocalColors.current.disabled) BorderStroke(
width = LocalDimensions.current.borderStroke,
color = if (enabled) color else LocalColors.current.disabled
)
@Composable @Composable
override fun buttonColors(color: Color) = ButtonDefaults.buttonColors( override fun buttonColors(color: Color) = ButtonDefaults.buttonColors(
contentColor = color, contentColor = color,

View File

@ -95,7 +95,7 @@ fun MaybeScanQrCode(
style = base, style = base,
textAlign = TextAlign.Center textAlign = TextAlign.Center
) )
Spacer(modifier = Modifier.size(20.dp)) Spacer(modifier = Modifier.size(LocalDimensions.current.itemSpacingMedium))
OutlineButton( OutlineButton(
stringResource(R.string.sessionSettings), stringResource(R.string.sessionSettings),
modifier = Modifier.align(Alignment.CenterHorizontally), modifier = Modifier.align(Alignment.CenterHorizontally),
@ -163,11 +163,11 @@ fun ScanQrCode(errors: Flow<String>, onScan: (String) -> Unit) {
snackbarHost = { snackbarHost = {
SnackbarHost( SnackbarHost(
hostState = scaffoldState.snackbarHostState, hostState = scaffoldState.snackbarHostState,
modifier = Modifier.padding(16.dp) modifier = Modifier.padding(LocalDimensions.current.itemSpacingSmall)
) { data -> ) { data ->
Snackbar( Snackbar(
snackbarData = data, snackbarData = data,
modifier = Modifier.padding(16.dp) modifier = Modifier.padding(LocalDimensions.current.itemSpacingSmall)
) )
} }
} }
@ -181,7 +181,7 @@ fun ScanQrCode(errors: Flow<String>, onScan: (String) -> Unit) {
Box( Box(
Modifier Modifier
.aspectRatio(1f) .aspectRatio(1f)
.padding(20.dp) .padding(LocalDimensions.current.itemSpacingMedium)
.clip(shape = RoundedCornerShape(26.dp)) .clip(shape = RoundedCornerShape(26.dp))
.background(Color(0x33ffffff)) .background(Color(0x33ffffff))
.align(Alignment.Center) .align(Alignment.Center)

View File

@ -19,6 +19,7 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
import network.loki.messenger.R import network.loki.messenger.R
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.color.LocalColors import org.thoughtcrime.securesms.ui.color.LocalColors
import org.thoughtcrime.securesms.ui.PreviewTheme import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.color.Colors import org.thoughtcrime.securesms.ui.color.Colors
@ -39,7 +40,7 @@ fun SessionTabRow(pagerState: PagerState, titles: List<Int>) {
TabRowDefaults.Indicator( TabRowDefaults.Indicator(
Modifier.tabIndicatorOffset(tabPositions[pagerState.currentPage]), Modifier.tabIndicatorOffset(tabPositions[pagerState.currentPage]),
color = LocalColors.current.primary, color = LocalColors.current.primary,
height = 5.dp height = LocalDimensions.current.indicatorHeight
) )
}, },
divider = { TabRowDefaults.Divider(color = LocalColors.current.divider) }, divider = { TabRowDefaults.Divider(color = LocalColors.current.divider) },

View File

@ -66,7 +66,7 @@ fun SessionOutlinedTextField(
shape = MaterialTheme.shapes.small shape = MaterialTheme.shapes.small
) )
error?.let { error?.let {
Spacer(modifier = Modifier.height(14.dp)) Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingXSmall))
Text( Text(
it, it,
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),