Updated app typography

Moved typography in its own object which is provided to the composables
This commit is contained in:
ThomasSession 2024-06-14 10:19:38 +10:00
parent 1c85de217b
commit 6938d9ada1
20 changed files with 234 additions and 165 deletions

View File

@ -7,12 +7,10 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.MaterialTheme
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.Color
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign
@ -21,12 +19,12 @@ import network.loki.messenger.R
import network.loki.messenger.libsession_util.util.ExpiryMode
import org.thoughtcrime.securesms.ui.Callbacks
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.NoOpCallbacks
import org.thoughtcrime.securesms.ui.OptionsCard
import org.thoughtcrime.securesms.ui.RadioOption
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.extraSmall
import org.thoughtcrime.securesms.ui.fadingEdges
typealias ExpiryCallbacks = Callbacks<ExpiryMode>
@ -55,7 +53,7 @@ fun DisappearingMessages(
if (state.showGroupFooter) Text(
text = stringResource(R.string.activity_disappearing_messages_group_footer),
style = MaterialTheme.typography.extraSmall,
style = LocalType.current.extraSmall,
fontWeight = FontWeight(400),
color = LocalColors.current.textSecondary,
textAlign = TextAlign.Center,

View File

@ -32,14 +32,13 @@ import org.session.libsession.utilities.TextSecurePreferences
import org.thoughtcrime.securesms.preferences.copyPublicKey
import org.thoughtcrime.securesms.preferences.sendInvitationToUseSession
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.components.AppBar
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.components.OutlineCopyButton
import org.thoughtcrime.securesms.ui.components.SmallButtons
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.onCreateView
import org.thoughtcrime.securesms.ui.small
@AndroidEntryPoint
class InviteFriendFragment : Fragment() {
@ -96,14 +95,14 @@ private fun InviteFriend(
.align(Alignment.Center)
.padding(22.dp),
textAlign = TextAlign.Center,
style = MaterialTheme.typography.base
style = LocalType.current.base
)
}
Text(
stringResource(R.string.invite_your_friend_to_chat_with_you_on_session_by_sharing_your_account_id_with_them),
textAlign = TextAlign.Center,
style = MaterialTheme.typography.small,
style = LocalType.current.small,
color = LocalColors.current.textSecondary,
modifier = Modifier.padding(horizontal = 8.dp)
)

View File

@ -28,12 +28,11 @@ import org.thoughtcrime.securesms.ui.Divider
import org.thoughtcrime.securesms.ui.ItemButton
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.components.AppBar
import org.thoughtcrime.securesms.ui.components.QrImage
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.onCreateView
import org.thoughtcrime.securesms.ui.small
import org.thoughtcrime.securesms.ui.xl
import javax.inject.Inject
@AndroidEntryPoint
@ -93,13 +92,13 @@ class NewConversationHomeFragment : Fragment() {
) {
Text(
text = stringResource(R.string.accountIdYours),
style = MaterialTheme.typography.xl
style = LocalType.current.xl
)
Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingTiny))
Text(
text = stringResource(R.string.qrYoursDescription),
color = LocalColors.current.textSecondary,
style = MaterialTheme.typography.small
style = LocalType.current.small
)
Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingSmall))
QrImage(

View File

@ -28,7 +28,6 @@ import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
@ -38,7 +37,6 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.TextStyle
@ -67,16 +65,15 @@ import org.thoughtcrime.securesms.ui.GetString
import org.thoughtcrime.securesms.ui.HorizontalPagerIndicator
import org.thoughtcrime.securesms.ui.ItemButton
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColors
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.TitledText
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.baseMonospace
import org.thoughtcrime.securesms.ui.blackAlpha40
import org.thoughtcrime.securesms.ui.components.SessionButtonText
import org.thoughtcrime.securesms.ui.destructiveButtonColors
import org.thoughtcrime.securesms.ui.monospace
import org.thoughtcrime.securesms.ui.setComposeContent
import javax.inject.Inject
@ -363,7 +360,7 @@ fun FileDetails(fileDetails: List<TitledText>) {
fun TitledErrorText(titledText: TitledText?) {
TitledText(
titledText,
style = MaterialTheme.typography.base.copy(color = LocalColors.current.danger)
style = LocalType.current.base.copy(color = LocalColors.current.danger)
)
}
@ -371,7 +368,7 @@ fun TitledErrorText(titledText: TitledText?) {
fun TitledMonospaceText(titledText: TitledText?) {
TitledText(
titledText,
style = MaterialTheme.typography.baseMonospace
style = LocalType.current.base.monospace()
)
}
@ -379,7 +376,7 @@ fun TitledMonospaceText(titledText: TitledText?) {
fun TitledText(
titledText: TitledText?,
modifier: Modifier = Modifier,
style: TextStyle = MaterialTheme.typography.base,
style: TextStyle = LocalType.current.base,
) {
titledText?.apply {
TitledView(title, modifier) {

View File

@ -20,13 +20,11 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.requiredWidth
import androidx.compose.foundation.layout.width
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
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.Color
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
@ -97,17 +95,14 @@ import org.thoughtcrime.securesms.showSessionDialog
import org.thoughtcrime.securesms.ui.Divider
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColors
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.SessionShieldIcon
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h8
import org.thoughtcrime.securesms.ui.setContentWithTheme
import org.thoughtcrime.securesms.ui.small
import org.thoughtcrime.securesms.util.ConfigurationMessageUtilities
import org.thoughtcrime.securesms.util.IP2Country
import org.thoughtcrime.securesms.util.disableClipping
@ -395,14 +390,14 @@ class HomeActivity : PassphraseRequiredActionBarActivity(),
Row {
Text(
stringResource(R.string.save_your_recovery_password),
style = MaterialTheme.typography.h8
style = LocalType.current.h8
)
Spacer(Modifier.requiredWidth(LocalDimensions.current.itemSpacingExtraSmall))
SessionShieldIcon()
}
Text(
stringResource(R.string.save_your_recovery_password_to_make_sure_you_don_t_lose_access_to_your_account),
style = MaterialTheme.typography.small
style = LocalType.current.small
)
}
Spacer(Modifier.width(LocalDimensions.current.marginExtraExtraSmall))
@ -434,12 +429,12 @@ class HomeActivity : PassphraseRequiredActionBarActivity(),
if (newAccount) {
Text(
stringResource(R.string.onboardingAccountCreated),
style = MaterialTheme.typography.h4,
style = LocalType.current.h4,
textAlign = TextAlign.Center
)
Text(
stringResource(R.string.welcome_to_session),
style = MaterialTheme.typography.base,
style = LocalType.current.base,
color = LocalColors.current.primary,
textAlign = TextAlign.Center
)
@ -449,12 +444,12 @@ class HomeActivity : PassphraseRequiredActionBarActivity(),
Text(
stringResource(R.string.conversationsNone),
style = MaterialTheme.typography.h8,
style = LocalType.current.h8,
textAlign = TextAlign.Center,
modifier = Modifier.padding(bottom = 12.dp))
Text(
stringResource(R.string.onboardingHitThePlusButton),
style = MaterialTheme.typography.small,
style = LocalType.current.small,
textAlign = TextAlign.Center
)
Spacer(modifier = Modifier.weight(2f))

View File

@ -21,7 +21,6 @@ import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
@ -33,7 +32,6 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
@ -49,6 +47,7 @@ import org.thoughtcrime.securesms.service.KeyCachingService
import org.thoughtcrime.securesms.showOpenUrlDialog
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColors
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
@ -56,7 +55,6 @@ import org.thoughtcrime.securesms.ui.components.BorderlessHtmlButton
import org.thoughtcrime.securesms.ui.components.FilledButton
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.large
import org.thoughtcrime.securesms.ui.setComposeContent
import org.thoughtcrime.securesms.util.setUpActionBarSessionLogo
import org.thoughtcrime.securesms.util.start
@ -125,7 +123,7 @@ class LandingActivity : BaseActionBarActivity() {
Text(
stringResource(R.string.onboardingBubblePrivacyInYourPocket),
modifier = Modifier.align(Alignment.CenterHorizontally),
style = MaterialTheme.typography.h4,
style = LocalType.current.h4,
textAlign = TextAlign.Center
)
Spacer(modifier = Modifier.height(LocalDimensions.current.itemSpacingMedium))
@ -246,7 +244,7 @@ private fun MessageText(
) {
Text(
text,
style = MaterialTheme.typography.large,
style = LocalType.current.large,
color = textColor,
modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp)
)

View File

@ -14,14 +14,12 @@ import androidx.compose.foundation.layout.width
import androidx.compose.foundation.pager.HorizontalPager
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
@ -34,17 +32,14 @@ import org.session.libsession.utilities.TextSecurePreferences
import org.thoughtcrime.securesms.BaseActionBarActivity
import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.baseBold
import org.thoughtcrime.securesms.ui.components.MaybeScanQrCode
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField
import org.thoughtcrime.securesms.ui.components.SessionTabRow
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.setComposeContent
import org.thoughtcrime.securesms.util.start
import javax.inject.Inject
private const val TAG = "LinkDeviceActivity"
@ -126,7 +121,7 @@ fun RecoveryPassword(state: LinkDeviceState, onChange: (String) -> Unit = {}, on
Row {
Text(
stringResource(R.string.sessionRecoveryPassword),
style = MaterialTheme.typography.h4
style = LocalType.current.h4
)
Spacer(Modifier.width(6.dp))
Icon(
@ -137,7 +132,7 @@ fun RecoveryPassword(state: LinkDeviceState, onChange: (String) -> Unit = {}, on
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 = MaterialTheme.typography.base
style = LocalType.current.base
)
Spacer(Modifier.size(24.dp))
SessionOutlinedTextField(

View File

@ -8,7 +8,6 @@ import androidx.compose.animation.core.Animatable
import androidx.compose.animation.core.TweenSpec
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
@ -17,7 +16,6 @@ import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.stringResource
import androidx.lifecycle.lifecycleScope
import dagger.hilt.android.AndroidEntryPoint
@ -29,11 +27,9 @@ import org.thoughtcrime.securesms.BaseActionBarActivity
import org.thoughtcrime.securesms.dependencies.ConfigFactory
import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
import org.thoughtcrime.securesms.onboarding.pickname.startPickDisplayNameActivity
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.ProgressArc
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h7
import org.thoughtcrime.securesms.ui.setComposeContent
import org.thoughtcrime.securesms.util.setUpActionBarSessionLogo
import javax.inject.Inject
@ -110,11 +106,11 @@ class LoadingActivity: BaseActionBarActivity() {
)
Text(
stringResource(R.string.waitOneMoment),
style = MaterialTheme.typography.h7
style = LocalType.current.h7
)
Text(
stringResource(R.string.loadAccountProgressMessage),
style = MaterialTheme.typography.base
style = LocalType.current.base
)
Spacer(modifier = Modifier.weight(2f))
}

View File

@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.ButtonDefaults
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedButton
import androidx.compose.material.RadioButton
import androidx.compose.material.Text
@ -24,7 +23,6 @@ import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.tooling.preview.PreviewParameter
@ -38,17 +36,13 @@ import org.thoughtcrime.securesms.home.HomeActivity
import org.thoughtcrime.securesms.notifications.PushRegistry
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColors
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.h8
import org.thoughtcrime.securesms.ui.h9
import org.thoughtcrime.securesms.ui.setComposeContent
import org.thoughtcrime.securesms.ui.small
import org.thoughtcrime.securesms.util.setUpActionBarSessionLogo
import javax.inject.Inject
@ -103,9 +97,9 @@ fun MessageNotificationsScreen(
Column {
Spacer(Modifier.weight(1f))
Column(modifier = Modifier.padding(horizontal = LocalDimensions.current.marginMedium)) {
Text(stringResource(R.string.notificationsMessage), style = MaterialTheme.typography.h4)
Text(stringResource(R.string.notificationsMessage), style = LocalType.current.h4)
Spacer(Modifier.height(LocalDimensions.current.marginExtraSmall))
Text(stringResource(R.string.onboardingMessageNotificationExplaination), style = MaterialTheme.typography.base)
Text(stringResource(R.string.onboardingMessageNotificationExplaination), style = LocalType.current.base)
Spacer(Modifier.height(LocalDimensions.current.marginExtraSmall))
NotificationRadioButton(
R.string.activity_pn_mode_fast_mode,
@ -160,9 +154,9 @@ fun NotificationRadioButton(
Column(
verticalArrangement = Arrangement.spacedBy(6.dp)
) {
Text(stringResource(title), style = MaterialTheme.typography.h8)
Text(stringResource(explanation), style = MaterialTheme.typography.small)
tag?.let { Text(stringResource(it), color = LocalColors.current.primary, style = MaterialTheme.typography.h9) }
Text(stringResource(title), style = LocalType.current.h8)
Text(stringResource(explanation), style = LocalType.current.small)
tag?.let { Text(stringResource(it), color = LocalColors.current.primary, style = LocalType.current.h9) }
}
}
RadioButton(selected = selected, modifier = Modifier.align(Alignment.CenterVertically), onClick = onClick, colors = LocalColors.current.radioButtonColors())

View File

@ -10,13 +10,11 @@ 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.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
@ -27,9 +25,8 @@ import network.loki.messenger.R
import org.thoughtcrime.securesms.ApplicationContext
import org.thoughtcrime.securesms.BaseActionBarActivity
import org.thoughtcrime.securesms.onboarding.messagenotifications.startMessageNotificationsActivity
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
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
@ -86,10 +83,10 @@ class PickDisplayNameActivity : BaseActionBarActivity() {
.padding(bottom = 12.dp)
) {
Spacer(modifier = Modifier.weight(1f))
Text(stringResource(state.title), style = MaterialTheme.typography.h4)
Text(stringResource(state.title), style = LocalType.current.h4)
Text(
stringResource(state.description),
style = MaterialTheme.typography.base,
style = LocalType.current.base,
modifier = Modifier.padding(bottom = 12.dp))
SessionOutlinedTextField(

View File

@ -15,7 +15,6 @@ import androidx.compose.foundation.layout.wrapContentWidth
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
@ -24,7 +23,6 @@ import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
@ -36,19 +34,17 @@ import org.thoughtcrime.securesms.showSessionDialog
import org.thoughtcrime.securesms.ui.CellWithPaddingAndMargin
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColors
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.SessionMaterialTheme
import org.thoughtcrime.securesms.ui.SessionShieldIcon
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.components.OutlineButton
import org.thoughtcrime.securesms.ui.components.OutlineCopyButton
import org.thoughtcrime.securesms.ui.components.QrImage
import org.thoughtcrime.securesms.ui.components.SmallButtons
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.extraSmallMonospace
import org.thoughtcrime.securesms.ui.h8
import org.thoughtcrime.securesms.ui.monospace
import org.thoughtcrime.securesms.ui.setComposeContent
class RecoveryPasswordActivity : BaseActionBarActivity() {
@ -133,7 +129,7 @@ fun RecoveryPasswordCell(seed: String, copySeed:() -> Unit = {}) {
Row {
Text(
stringResource(R.string.sessionRecoveryPassword),
style = MaterialTheme.typography.h8
style = LocalType.current.h8
)
Spacer(Modifier.width(LocalDimensions.current.itemSpacingExtraSmall))
SessionShieldIcon()
@ -143,7 +139,7 @@ fun RecoveryPasswordCell(seed: String, copySeed:() -> Unit = {}) {
Text(
stringResource(R.string.recoveryPasswordDescription),
style = MaterialTheme.typography.base
style = LocalType.current.base
)
AnimatedVisibility(!showQr) {
@ -205,7 +201,7 @@ private fun RecoveryPassword(seed: String) {
)
.padding(LocalDimensions.current.marginSmall),
textAlign = TextAlign.Center,
style = MaterialTheme.typography.extraSmallMonospace,
style = LocalType.current.extraSmall.monospace(),
color = LocalColors.current.run { if (isLight) text else primary },
)
}
@ -219,11 +215,11 @@ private fun HideRecoveryPasswordCell(onHide: () -> Unit = {}) {
) {
Text(
stringResource(R.string.recoveryPasswordHideRecoveryPassword),
style = MaterialTheme.typography.h8
style = LocalType.current.h8
)
Text(
stringResource(R.string.recoveryPasswordHideRecoveryPasswordDescription),
style = MaterialTheme.typography.base
style = LocalType.current.base
)
}
Spacer(modifier = Modifier.width(LocalDimensions.current.marginExtraExtraSmall))

View File

@ -26,12 +26,12 @@ import org.session.libsignal.utilities.PublicKeyValidation
import org.thoughtcrime.securesms.PassphraseRequiredActionBarActivity
import org.thoughtcrime.securesms.conversation.v2.ConversationActivityV2
import org.thoughtcrime.securesms.database.threadDatabase
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.components.MaybeScanQrCode
import org.thoughtcrime.securesms.ui.components.QrImage
import org.thoughtcrime.securesms.ui.components.SessionTabRow
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.setComposeContent
import org.thoughtcrime.securesms.ui.small
import org.thoughtcrime.securesms.util.start
private val TITLES = listOf(R.string.view, R.string.scan)
@ -107,7 +107,7 @@ fun QrPage(string: String) {
Text(
text = stringResource(R.string.this_is_your_account_id_other_users_can_scan_it_to_start_a_conversation_with_you),
textAlign = TextAlign.Center,
style = MaterialTheme.typography.small
style = LocalType.current.small
)
}
}

View File

@ -30,9 +30,7 @@ import androidx.compose.material.Card
import androidx.compose.material.CircularProgressIndicator
import androidx.compose.material.Icon
import androidx.compose.material.LocalContentColor
import androidx.compose.material.MaterialTheme
import androidx.compose.material.RadioButton
import androidx.compose.material.RadioButtonDefaults
import androidx.compose.material.Text
import androidx.compose.material.TextButton
import androidx.compose.runtime.Composable
@ -40,7 +38,6 @@ import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.draw.drawWithContent
import androidx.compose.ui.geometry.Size
import androidx.compose.ui.graphics.BlendMode
@ -93,7 +90,7 @@ data class RadioOption<T>(
fun <T> OptionsCard(card: OptionsCard<T>, callbacks: Callbacks<T>) {
Text(
card.title(),
style = MaterialTheme.typography.base
style = LocalType.current.base
)
CellNoMargin {
LazyColumn(
@ -190,7 +187,7 @@ fun ItemButton(
) {
icon()
}
Text(text, modifier = Modifier.fillMaxWidth(), style = MaterialTheme.typography.xl)
Text(text, modifier = Modifier.fillMaxWidth(), style = LocalType.current.xl)
}
}
@ -239,13 +236,13 @@ fun <T> TitledRadioButton(option: RadioOption<T>, onClick: () -> Unit) {
Column {
Text(
text = option.title(),
style = MaterialTheme.typography.large,
style = LocalType.current.large,
color = color
)
option.subtitle?.let {
Text(
text = it(),
style = MaterialTheme.typography.extraSmall,
style = LocalType.current.extraSmall,
color = color
)
}
@ -357,7 +354,7 @@ fun ProgressArc(progress: Float, modifier: Modifier = Modifier) {
"${text}%",
color = Color.White,
modifier = Modifier.align(Alignment.Center),
style = MaterialTheme.typography.h2
style = LocalType.current.h2
)
}
}

View File

@ -1,42 +1,161 @@
package org.thoughtcrime.securesms.ui
import androidx.compose.material.Typography
import androidx.compose.runtime.Composable
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontFamily
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.sp
fun boldStyle(size: TextUnit) = TextStyle.Default.copy(
fontWeight = FontWeight.Bold,
fontSize = size
fun TextStyle.bold() = TextStyle.Default.copy(
fontWeight = FontWeight.Bold
)
fun defaultStyle(size: TextUnit) = TextStyle.Default.copy(
fontSize = size,
lineHeight = size * 1.2
fun TextStyle.monospace() = TextStyle.Default.copy(
fontFamily = FontFamily.Monospace
)
val sessionTypography = Typography(
h1 = boldStyle(36.sp),
h2 = boldStyle(32.sp),
h3 = boldStyle(29.sp),
h4 = boldStyle(26.sp),
h5 = boldStyle(23.sp),
h6 = boldStyle(20.sp),
val sessionTypography = SessionTypography()
data class SessionTypography(
// Body
val xl: TextStyle = TextStyle(
fontSize = 18.sp,
lineHeight = 21.6.sp,
fontWeight = FontWeight.Normal
),
val large: TextStyle = TextStyle(
fontSize = 16.sp,
lineHeight = 19.2.sp,
fontWeight = FontWeight.Normal
),
val base: TextStyle = TextStyle(
fontSize = 14.sp,
lineHeight = 16.8.sp,
fontWeight = FontWeight.Normal
),
val small: TextStyle = TextStyle(
fontSize = 12.sp,
lineHeight = 14.4.sp,
fontWeight = FontWeight.Normal
),
val extraSmall: TextStyle = TextStyle(
fontSize = 11.sp,
lineHeight = 13.2.sp,
fontWeight = FontWeight.Normal
),
val fine: TextStyle = TextStyle(
fontSize = 9.sp,
lineHeight = 10.8.sp,
fontWeight = FontWeight.Normal
),
// Headings
val h1: TextStyle = TextStyle(
fontSize = 36.sp,
lineHeight = 43.2.sp,
fontWeight = FontWeight.Bold
),
val h2: TextStyle = TextStyle(
fontSize = 32.sp,
lineHeight = 38.4.sp,
fontWeight = FontWeight.Bold
),
val h3: TextStyle = TextStyle(
fontSize = 29.sp,
lineHeight = 34.8.sp,
fontWeight = FontWeight.Bold
),
val h4: TextStyle = TextStyle(
fontSize = 26.sp,
lineHeight = 31.2.sp,
fontWeight = FontWeight.Bold
),
val h5: TextStyle = TextStyle(
fontSize = 23.sp,
lineHeight = 27.6.sp,
fontWeight = FontWeight.Bold
),
val h6: TextStyle = TextStyle(
fontSize = 20.sp,
lineHeight = 24.sp,
fontWeight = FontWeight.Bold
),
val h7: TextStyle = TextStyle(
fontSize = 18.sp,
lineHeight = 21.6.sp,
fontWeight = FontWeight.Bold
),
val h8: TextStyle = TextStyle(
fontSize = 16.sp,
lineHeight = 19.2.sp,
fontWeight = FontWeight.Bold
),
val h9: TextStyle = TextStyle(
fontSize = 14.sp,
lineHeight = 16.8.sp,
fontWeight = FontWeight.Bold
)
) {
//todo ready to go when we switch to Material3
val Typography.xl get() = defaultStyle(18.sp)
val Typography.large get() = defaultStyle(16.sp)
val Typography.base get() = defaultStyle(14.sp)
val Typography.baseBold get() = boldStyle(14.sp)
val Typography.baseMonospace get() = defaultStyle(14.sp).copy(fontFamily = FontFamily.Monospace)
val Typography.small get() = defaultStyle(12.sp)
val Typography.smallMonospace get() = defaultStyle(12.sp).copy(fontFamily = FontFamily.Monospace)
val Typography.extraSmall get() = defaultStyle(11.sp)
val Typography.extraSmallMonospace get() = defaultStyle(11.sp).copy(fontFamily = FontFamily.Monospace)
val Typography.fine get() = defaultStyle(9.sp)
// An opinionated override of Material's defaults
/*@Composable
fun asMaterialTypography() = Typography(
// Display
displayLarge = h1,
displayMedium = h1,
displaySmall = h1,
// Headline
headlineLarge = h2,
headlineMedium = h3,
headlineSmall = h4,
// Title
titleLarge = h5,
titleMedium = h6,
titleSmall = h7,
// Body
bodyLarge = large,
bodyMedium = base,
bodySmall = small,
// Label
labelLarge = extraSmall,
labelMedium = fine,
labelSmall = fine
)*/
@Composable
fun asMaterialTypography() = Typography(
h1 = h1,
h2 = h2,
h3 = h3,
h4 = h4,
h5 = h5,
h6 = h6,
subtitle1 = h7,
subtitle2 = h8,
body1 = base,
body2 = small,
button = base,
caption = small,
overline = fine
)
}
val Typography.h7 get() = boldStyle(18.sp)
val Typography.h8 get() = boldStyle(16.sp)
val Typography.h9 get() = boldStyle(14.sp)

View File

@ -49,7 +49,7 @@ fun SessionMaterialTheme(
) {
MaterialTheme(
colors = sessionColors.toMaterialColors(),
typography = sessionTypography,
typography = sessionTypography.asMaterialTypography(),
shapes = sessionShapes,
) {
val textSelectionColors = TextSelectionColors(
@ -59,6 +59,7 @@ fun SessionMaterialTheme(
CompositionLocalProvider(
LocalColors provides sessionColors,
LocalType provides sessionTypography,
LocalContentColor provides sessionColors.text,
LocalTextSelectionColors provides textSelectionColors
) {
@ -69,6 +70,7 @@ fun SessionMaterialTheme(
// Compose theme holder
val LocalColors = compositionLocalOf { classicDark }
val LocalType = compositionLocalOf { sessionTypography }
// Our themes
val classicDark = SessionColors(
@ -202,29 +204,26 @@ fun PreviewThemeColors(
@Composable
private fun ThemeColors() {
Column {
Box(Modifier.background(MaterialTheme.colors.primary)) {
Text("primary", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.primary)) {
Text("primary", style = LocalType.current.base)
}
Box(Modifier.background(MaterialTheme.colors.primaryVariant)) {
Text("primaryVariant", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.background)) {
Text("background", style = LocalType.current.base)
}
Box(Modifier.background(MaterialTheme.colors.secondary)) {
Text("secondary", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.backgroundSecondary)) {
Text("backgroundSecondary", style = LocalType.current.base)
}
Box(Modifier.background(MaterialTheme.colors.secondaryVariant)) {
Text("secondaryVariant", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.text)) {
Text("text", style = LocalType.current.base)
}
Box(Modifier.background(MaterialTheme.colors.surface)) {
Text("surface", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.textSecondary)) {
Text("textSecondary", style = LocalType.current.base)
}
Box(Modifier.background(MaterialTheme.colors.primarySurface)) {
Text("primarySurface", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.danger)) {
Text("danger", style = LocalType.current.base)
}
Box(Modifier.background(MaterialTheme.colors.background)) {
Text("background", style = MaterialTheme.typography.base)
}
Box(Modifier.background(MaterialTheme.colors.error)) {
Text("error", style = MaterialTheme.typography.base)
Box(Modifier.background(LocalColors.current.borders)) {
Text("border", style = LocalType.current.base)
}
}
}

View File

@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.size
import androidx.compose.material.Icon
import androidx.compose.material.IconButton
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
@ -16,6 +15,7 @@ import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import network.loki.messenger.R
import org.thoughtcrime.securesms.ui.LocalType
@Preview
@Composable
@ -34,7 +34,7 @@ fun AppBar(title: String, onClose: () -> Unit = {}, onBack: (() -> Unit)? = null
}
}
Spacer(modifier = Modifier.weight(1f))
Text(text = title, style = MaterialTheme.typography.h4)
Text(text = title, style = LocalType.current.h4)
Spacer(modifier = Modifier.weight(1f))
Box(contentAlignment = Alignment.Center, modifier = Modifier.size(64.dp)) {
IconButton(onClick = onClose) {

View File

@ -4,21 +4,14 @@ import androidx.annotation.DrawableRes
import androidx.annotation.StringRes
import androidx.compose.animation.Crossfade
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.interaction.PressInteraction
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.IntrinsicSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.material.ButtonDefaults
import androidx.compose.material.ContentAlpha
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedButton
import androidx.compose.material.Text
import androidx.compose.material.TextButton
@ -32,7 +25,6 @@ import androidx.compose.runtime.staticCompositionLocalOf
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.style.TextAlign
@ -44,9 +36,9 @@ import network.loki.messenger.R
import org.thoughtcrime.securesms.ui.GetString
import org.thoughtcrime.securesms.ui.LaunchedEffectAsync
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.baseBold
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.bold
import org.thoughtcrime.securesms.ui.contentDescription
import org.thoughtcrime.securesms.ui.extraSmall
import kotlin.time.Duration
import kotlin.time.Duration.Companion.seconds
@ -68,7 +60,7 @@ fun SessionButtonText(
Text(
modifier = modifier,
text = text,
style = MaterialTheme.typography.baseBold,
style = LocalType.current.base.bold(),
color = if (enabled) color else LocalColors.current.disabled
)
}
@ -248,7 +240,7 @@ fun BorderlessButton(
Text(
text = text,
textAlign = TextAlign.Center,
style = MaterialTheme.typography.extraSmall,
style = LocalType.current.extraSmall,
modifier = Modifier.padding(horizontal = 2.dp)
)
}
@ -259,7 +251,7 @@ fun BorderlessButtonWithIcon(
text: String,
@DrawableRes iconRes: Int,
modifier: Modifier = Modifier,
style: TextStyle = MaterialTheme.typography.baseBold,
style: TextStyle = LocalType.current.base.bold(),
contentColor: Color = LocalColors.current.text,
backgroundColor: Color = Color.Transparent,
onClick: () -> Unit
@ -291,7 +283,7 @@ fun BorderlessHtmlButton(
Text(
text = annotatedStringResource(textId),
textAlign = TextAlign.Center,
style = MaterialTheme.typography.extraSmall,
style = LocalType.current.extraSmall,
modifier = Modifier.padding(horizontal = 2.dp)
)
}

View File

@ -58,7 +58,7 @@ import kotlinx.coroutines.flow.filter
import network.loki.messenger.R
import org.session.libsignal.utilities.Log
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.LocalType
import java.util.concurrent.Executors
private const val TAG = "NewMessageFragment"
@ -92,7 +92,7 @@ fun MaybeScanQrCode(
) {
Text(
stringResource(R.string.activity_link_camera_permission_permanently_denied_configure_in_settings),
style = MaterialTheme.typography.base,
style = LocalType.current.base,
textAlign = TextAlign.Center
)
Spacer(modifier = Modifier.size(20.dp))

View File

@ -5,7 +5,6 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.pager.PagerState
import androidx.compose.foundation.pager.rememberPagerState
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Tab
import androidx.compose.material.TabRow
import androidx.compose.material.TabRowDefaults
@ -21,10 +20,10 @@ import androidx.compose.ui.unit.dp
import kotlinx.coroutines.launch
import network.loki.messenger.R
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.PreviewTheme
import org.thoughtcrime.securesms.ui.SessionColors
import org.thoughtcrime.securesms.ui.SessionColorsParameterProvider
import org.thoughtcrime.securesms.ui.h8
private val TITLES = listOf(R.string.sessionRecoveryPassword, R.string.qrScan)
@ -57,7 +56,7 @@ fun SessionTabRow(pagerState: PagerState, titles: List<Int>) {
) {
Text(
stringResource(id = it),
style = MaterialTheme.typography.h8
style = LocalType.current.h8
)
}
}

View File

@ -9,7 +9,6 @@ import androidx.compose.foundation.text.InlineTextContent
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.appendInlineContent
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedTextField
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
@ -26,8 +25,8 @@ import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import org.thoughtcrime.securesms.ui.LocalColors
import org.thoughtcrime.securesms.ui.LocalDimensions
import org.thoughtcrime.securesms.ui.base
import org.thoughtcrime.securesms.ui.baseBold
import org.thoughtcrime.securesms.ui.LocalType
import org.thoughtcrime.securesms.ui.bold
import org.thoughtcrime.securesms.ui.outlinedTextFieldColors
@Composable
@ -43,12 +42,12 @@ fun SessionOutlinedTextField(
OutlinedTextField(
value = text,
modifier = Modifier.fillMaxWidth(),
textStyle = MaterialTheme.typography.base,
textStyle = LocalType.current.base,
onValueChange = { onChange(it) },
placeholder = {
Text(
placeholder,
style = MaterialTheme.typography.base
style = LocalType.current.base
)
},
colors = outlinedTextFieldColors(error != null),
@ -67,7 +66,7 @@ fun SessionOutlinedTextField(
it,
modifier = Modifier.padding(top = LocalDimensions.current.marginExtraExtraSmall),
textAlign = TextAlign.Center,
style = MaterialTheme.typography.baseBold,
style = LocalType.current.base.bold(),
color = LocalColors.current.danger
)
}
@ -79,7 +78,7 @@ fun AnnotatedTextWithIcon(
text: String,
@DrawableRes iconRes: Int,
modifier: Modifier = Modifier,
style: TextStyle = MaterialTheme.typography.base,
style: TextStyle = LocalType.current.base,
iconTint: Color = Color.Unspecified,
iconSize: TextUnit = 12.sp
) {