Merge pull request #840 from vector-im/feature/bma/cleanupText
Cleanup text
This commit is contained in:
@@ -81,7 +81,7 @@ fun LoadingRoomNodeView(
|
||||
Text(
|
||||
text = stringResource(id = CommonStrings.error_unknown),
|
||||
color = ElementTheme.colors.textSecondary,
|
||||
fontSize = 14.sp,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
} else {
|
||||
CircularProgressIndicator()
|
||||
|
||||
@@ -41,14 +41,11 @@ import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.clip
|
||||
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
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.analytics.api.AnalyticsOptInEvents
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMolecule
|
||||
import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
|
||||
import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
|
||||
@@ -59,6 +56,7 @@ import io.element.android.libraries.designsystem.theme.components.Button
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TextButton
|
||||
import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
|
||||
import io.element.android.libraries.designsystem.utils.LogCompositions
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
@@ -109,7 +107,7 @@ private fun AnalyticsOptInHeader(
|
||||
.clip(shape = RoundedCornerShape(8.dp))
|
||||
.clickable { onClickTerms() }
|
||||
.padding(8.dp),
|
||||
style = ElementTextStyles.Regular.subheadline,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
textAlign = TextAlign.Center,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
)
|
||||
@@ -162,7 +160,7 @@ private fun AnalyticsOptInContentRow(
|
||||
modifier = modifier
|
||||
.fillMaxWidth()
|
||||
.background(
|
||||
color = ElementTheme.legacyColors.quinary,
|
||||
color = ElementTheme.colors.temporaryColorBgSpecial,
|
||||
shape = bgShape,
|
||||
)
|
||||
.padding(vertical = 12.dp, horizontal = 20.dp),
|
||||
@@ -179,8 +177,7 @@ private fun AnalyticsOptInContentRow(
|
||||
Text(
|
||||
modifier = Modifier.padding(start = 16.dp),
|
||||
text = text,
|
||||
fontSize = 14.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.fontBodyMdMedium,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -26,11 +26,9 @@ import androidx.compose.material3.ExperimentalMaterial3Api
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.createroom.impl.R
|
||||
import io.element.android.features.createroom.impl.components.UserListView
|
||||
import io.element.android.features.createroom.impl.userlist.UserListEvents
|
||||
@@ -38,10 +36,13 @@ import io.element.android.features.createroom.impl.userlist.UserListState
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TextButton
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalLayoutApi::class)
|
||||
@@ -97,8 +98,7 @@ fun AddPeopleViewTopBar(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.screen_create_room_add_people_title),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle
|
||||
)
|
||||
},
|
||||
navigationIcon = { BackButton(onClick = onBackPressed) },
|
||||
@@ -110,7 +110,7 @@ fun AddPeopleViewTopBar(
|
||||
val textActionResId = if (hasSelectedUsers) CommonStrings.action_next else CommonStrings.action_skip
|
||||
Text(
|
||||
text = stringResource(id = textActionResId),
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -38,6 +38,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.RadioButton
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
fun RoomPrivacyOption(
|
||||
@@ -70,14 +71,13 @@ fun RoomPrivacyOption(
|
||||
) {
|
||||
Text(
|
||||
text = roomPrivacyItem.title,
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
)
|
||||
Spacer(Modifier.size(3.dp))
|
||||
Text(
|
||||
text = roomPrivacyItem.description,
|
||||
fontSize = 12.sp,
|
||||
lineHeight = 17.sp,
|
||||
style = ElementTheme.typography.fontBodySmRegular,
|
||||
color = MaterialTheme.colorScheme.tertiary,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -43,11 +43,9 @@ import androidx.compose.ui.focus.FocusManager
|
||||
import androidx.compose.ui.input.pointer.pointerInput
|
||||
import androidx.compose.ui.platform.LocalFocusManager
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.createroom.impl.R
|
||||
import io.element.android.features.createroom.impl.components.RoomPrivacyOption
|
||||
import io.element.android.libraries.architecture.Async
|
||||
@@ -57,6 +55,8 @@ import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TextButton
|
||||
@@ -65,6 +65,7 @@ import io.element.android.libraries.matrix.api.core.RoomId
|
||||
import io.element.android.libraries.matrix.ui.components.AvatarActionBottomSheet
|
||||
import io.element.android.libraries.matrix.ui.components.SelectedUsersList
|
||||
import io.element.android.libraries.matrix.ui.components.UnsavedAvatar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import kotlinx.coroutines.launch
|
||||
|
||||
@@ -186,8 +187,7 @@ fun ConfigureRoomToolbar(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(R.string.screen_create_room_title),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = { BackButton(onClick = onBackPressed) },
|
||||
@@ -199,7 +199,7 @@ fun ConfigureRoomToolbar(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.action_create),
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -36,11 +36,9 @@ import androidx.compose.runtime.LaunchedEffect
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.createroom.impl.R
|
||||
import io.element.android.features.createroom.impl.components.UserListView
|
||||
import io.element.android.libraries.architecture.Async
|
||||
@@ -48,12 +46,14 @@ import io.element.android.libraries.designsystem.components.ProgressDialog
|
||||
import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.IconButton
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.matrix.api.core.RoomId
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import io.element.android.libraries.designsystem.R as DrawableR
|
||||
|
||||
@@ -138,8 +138,7 @@ fun CreateRoomRootViewTopBar(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(id = CommonStrings.action_start_chat),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = {
|
||||
@@ -199,8 +198,7 @@ fun CreateRoomActionButton(
|
||||
)
|
||||
Text(
|
||||
text = text,
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.Normal
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -42,11 +42,13 @@ import io.element.android.libraries.designsystem.components.dialogs.Confirmation
|
||||
import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Divider
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.matrix.api.core.RoomId
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@Composable
|
||||
@@ -124,7 +126,10 @@ fun InviteListContent(
|
||||
BackButton(onClick = onBackClicked)
|
||||
},
|
||||
title = {
|
||||
Text(text = stringResource(CommonStrings.action_invites_list))
|
||||
Text(
|
||||
text = stringResource(CommonStrings.action_invites_list),
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
}
|
||||
)
|
||||
},
|
||||
|
||||
@@ -41,20 +41,19 @@ import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.invitelist.impl.R
|
||||
import io.element.android.features.invitelist.impl.model.InviteListInviteSummary
|
||||
import io.element.android.features.invitelist.impl.model.InviteListInviteSummaryProvider
|
||||
import io.element.android.features.invitelist.impl.model.InviteSender
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.atomic.atoms.UnreadIndicatorAtom
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.components.Button
|
||||
import io.element.android.libraries.designsystem.theme.components.OutlinedButton
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.noFontPadding
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
private val minHeight = 72.dp
|
||||
@@ -106,21 +105,18 @@ internal fun DefaultInviteSummaryRow(
|
||||
|
||||
// Name
|
||||
Text(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.Medium,
|
||||
text = invite.roomName,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
style = noFontPadding,
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
modifier = Modifier.padding(end = bonusPadding),
|
||||
)
|
||||
|
||||
// ID or Alias
|
||||
invite.roomAlias?.let {
|
||||
Text(
|
||||
fontSize = 14.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
text = it,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
maxLines = 1,
|
||||
@@ -137,7 +133,7 @@ internal fun DefaultInviteSummaryRow(
|
||||
// CTAs
|
||||
Row(Modifier.padding(top = 12.dp)) {
|
||||
OutlinedButton(
|
||||
content = { Text(stringResource(CommonStrings.action_decline), style = ElementTextStyles.Button) },
|
||||
content = { Text(stringResource(CommonStrings.action_decline), style = ElementTheme.typography.aliasButtonText) },
|
||||
onClick = onDeclineClicked,
|
||||
modifier = Modifier
|
||||
.weight(1f)
|
||||
@@ -148,7 +144,7 @@ internal fun DefaultInviteSummaryRow(
|
||||
Spacer(modifier = Modifier.width(12.dp))
|
||||
|
||||
Button(
|
||||
content = { Text(stringResource(CommonStrings.action_accept), style = ElementTextStyles.Button) },
|
||||
content = { Text(stringResource(CommonStrings.action_accept), style = ElementTheme.typography.aliasButtonText) },
|
||||
onClick = onAcceptClicked,
|
||||
modifier = Modifier
|
||||
.weight(1f)
|
||||
@@ -188,10 +184,8 @@ private fun SenderRow(sender: InviteSender) {
|
||||
)
|
||||
)
|
||||
},
|
||||
style = noFontPadding,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 14.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -36,21 +36,21 @@ 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.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.IntOffset
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.location.impl.map.MapView
|
||||
import io.element.android.features.location.impl.map.rememberMapState
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.BottomSheetScaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import io.element.android.libraries.designsystem.R as DesignSystemR
|
||||
|
||||
@@ -95,8 +95,7 @@ fun SendLocationView(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.screen_share_location_title),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = {
|
||||
|
||||
@@ -39,11 +39,13 @@ import io.element.android.features.location.impl.map.rememberMapState
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.IconButton
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.theme.compound.generated.TypographyTokens
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@@ -65,7 +67,7 @@ fun ShowLocationView(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.screen_view_location_title),
|
||||
style = TypographyTokens.fontBodyLgMedium,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = {
|
||||
|
||||
@@ -35,7 +35,6 @@ import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.features.login.impl.R
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtom
|
||||
import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtomSize
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
@@ -43,6 +42,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Divider
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
/**
|
||||
* https://www.figma.com/file/o9p34zmiuEpZRyvZXJZAYL/FTUE?type=design&node-id=604-60817
|
||||
@@ -86,7 +86,7 @@ fun AccountProviderView(
|
||||
.padding(start = 16.dp)
|
||||
.weight(1f),
|
||||
text = item.title,
|
||||
style = ElementTextStyles.Regular.headline.copy(textAlign = TextAlign.Start),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
)
|
||||
if (item.isPublic) {
|
||||
@@ -105,7 +105,7 @@ fun AccountProviderView(
|
||||
modifier = Modifier
|
||||
.padding(start = 46.dp, bottom = 12.dp, end = 26.dp),
|
||||
text = item.subtitle,
|
||||
style = ElementTextStyles.Regular.subheadline.copy(textAlign = TextAlign.Start),
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -58,7 +58,6 @@ import io.element.android.features.login.impl.R
|
||||
import io.element.android.features.login.impl.error.isWaitListError
|
||||
import io.element.android.features.login.impl.error.loginError
|
||||
import io.element.android.libraries.architecture.Async
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
|
||||
@@ -76,6 +75,7 @@ import io.element.android.libraries.designsystem.theme.components.autofill
|
||||
import io.element.android.libraries.designsystem.theme.components.onTabOrEnterKeyFocusNext
|
||||
import io.element.android.libraries.testtags.TestTags
|
||||
import io.element.android.libraries.testtags.testTag
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
|
||||
@@ -186,7 +186,7 @@ internal fun LoginForm(
|
||||
Text(
|
||||
text = stringResource(R.string.screen_login_form_header),
|
||||
modifier = Modifier.padding(start = 16.dp),
|
||||
style = ElementTextStyles.Regular.formHeader
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
|
||||
Spacer(modifier = Modifier.height(8.dp))
|
||||
|
||||
@@ -52,6 +52,7 @@ import io.element.android.libraries.architecture.Async
|
||||
import io.element.android.libraries.designsystem.components.dialogs.RetryDialog
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.components.Button
|
||||
import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
@@ -151,7 +152,7 @@ private fun WaitListContent(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.action_cancel),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -222,7 +223,7 @@ private fun WaitListContent(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(id = CommonStrings.action_continue),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -79,6 +79,7 @@ import io.element.android.libraries.designsystem.utils.LogCompositions
|
||||
import io.element.android.libraries.designsystem.utils.rememberSnackbarHostState
|
||||
import io.element.android.libraries.matrix.api.core.UserId
|
||||
import io.element.android.libraries.matrix.api.timeline.item.event.LocalEventSendState
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
import timber.log.Timber
|
||||
@@ -307,9 +308,8 @@ fun MessagesViewTopBar(
|
||||
Avatar(roomAvatar)
|
||||
Spacer(modifier = Modifier.width(8.dp))
|
||||
Text(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
text = roomTitle,
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis
|
||||
)
|
||||
|
||||
@@ -66,12 +66,10 @@ import io.element.android.features.messages.impl.timeline.model.event.TimelineIt
|
||||
import io.element.android.features.messages.impl.timeline.model.event.TimelineItemUnknownContent
|
||||
import io.element.android.features.messages.impl.timeline.model.event.TimelineItemVideoContent
|
||||
import io.element.android.features.messages.impl.utils.messagesummary.MessageSummaryFormatterImpl
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
import io.element.android.libraries.designsystem.preview.DayNightPreviews
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreview
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.text.toSp
|
||||
import io.element.android.libraries.designsystem.theme.components.Divider
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
@@ -221,7 +219,7 @@ private fun SheetContent(
|
||||
private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modifier) {
|
||||
val content: @Composable () -> Unit
|
||||
var icon: @Composable () -> Unit = { Avatar(avatarData = event.senderAvatar.copy(size = AvatarSize.MessageActionSender)) }
|
||||
val contentStyle = ElementTextStyles.Regular.bodyMD.copy(color = MaterialTheme.colorScheme.secondary)
|
||||
val contentStyle = ElementTheme.typography.fontBodyMdRegular.copy(color = MaterialTheme.colorScheme.secondary)
|
||||
val imageModifier = Modifier
|
||||
.size(AvatarSize.MessageActionSender.dp)
|
||||
.clip(RoundedCornerShape(9.dp))
|
||||
@@ -306,7 +304,7 @@ private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modif
|
||||
if (event.senderDisplayName != null) {
|
||||
Text(
|
||||
text = event.senderDisplayName,
|
||||
style = ElementTextStyles.Bold.caption1,
|
||||
style = ElementTheme.typography.fontBodySmMedium,
|
||||
color = MaterialTheme.colorScheme.primary
|
||||
)
|
||||
}
|
||||
@@ -316,7 +314,7 @@ private fun MessageSummary(event: TimelineItem.Event, modifier: Modifier = Modif
|
||||
Spacer(modifier = Modifier.width(16.dp))
|
||||
Text(
|
||||
event.sentTime,
|
||||
style = ElementTextStyles.Regular.caption2,
|
||||
style = ElementTheme.typography.fontBodyXsRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
textAlign = TextAlign.End,
|
||||
)
|
||||
|
||||
@@ -38,13 +38,10 @@ import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.components.ProgressDialog
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarData
|
||||
@@ -54,6 +51,7 @@ import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
|
||||
import io.element.android.libraries.designsystem.components.dialogs.ErrorDialogDefaults
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Divider
|
||||
import io.element.android.libraries.designsystem.theme.components.RadioButton
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
@@ -67,6 +65,7 @@ import io.element.android.libraries.designsystem.theme.roomListRoomName
|
||||
import io.element.android.libraries.matrix.api.core.RoomId
|
||||
import io.element.android.libraries.matrix.api.room.RoomSummaryDetails
|
||||
import io.element.android.libraries.matrix.ui.components.SelectedRoom
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
|
||||
@@ -112,7 +111,12 @@ fun ForwardMessagesView(
|
||||
modifier = modifier,
|
||||
topBar = {
|
||||
TopAppBar(
|
||||
title = { Text(stringResource(CommonStrings.common_forward_message), style = ElementTextStyles.Bold.callout) },
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.common_forward_message),
|
||||
style = ElementTheme.typography.aliasScreenTitle
|
||||
)
|
||||
},
|
||||
navigationIcon = {
|
||||
BackButton(onClick = { onBackButton(state) })
|
||||
},
|
||||
@@ -248,8 +252,7 @@ internal fun RoomSummaryView(
|
||||
) {
|
||||
// Name
|
||||
Text(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
text = summary.name,
|
||||
color = MaterialTheme.roomListRoomName(),
|
||||
maxLines = 1,
|
||||
@@ -259,7 +262,7 @@ internal fun RoomSummaryView(
|
||||
Text(
|
||||
text = roomAlias,
|
||||
color = MaterialTheme.roomListRoomMessage(),
|
||||
fontSize = 14.sp,
|
||||
style = ElementTheme.typography.fontBodySmRegular,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis
|
||||
)
|
||||
|
||||
@@ -66,6 +66,7 @@ import io.element.android.libraries.designsystem.R
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.utils.OnLifecycleEvent
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import me.saket.telephoto.zoomable.ZoomSpec
|
||||
import me.saket.telephoto.zoomable.ZoomableState
|
||||
import me.saket.telephoto.zoomable.coil.ZoomableAsyncImage
|
||||
@@ -238,7 +239,7 @@ fun MediaFileView(
|
||||
Text(
|
||||
text = info.name,
|
||||
maxLines = 2,
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
textAlign = TextAlign.Center,
|
||||
color = MaterialTheme.colorScheme.primary
|
||||
@@ -246,7 +247,7 @@ fun MediaFileView(
|
||||
Spacer(modifier = Modifier.height(4.dp))
|
||||
Text(
|
||||
text = formatFileExtensionAndSize(info.fileExtension, info.formattedFileSize),
|
||||
fontSize = 14.sp,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
color = MaterialTheme.colorScheme.primary
|
||||
|
||||
@@ -38,22 +38,22 @@ import androidx.compose.runtime.LaunchedEffect
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.platform.LocalFocusManager
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.architecture.Async
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
|
||||
import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.OutlinedTextField
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
|
||||
@@ -87,8 +87,7 @@ fun ReportMessageView(
|
||||
title = {
|
||||
Text(
|
||||
stringResource(CommonStrings.action_report_content),
|
||||
style = ElementTextStyles.Regular.callout,
|
||||
fontWeight = FontWeight.Medium,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = {
|
||||
@@ -120,7 +119,7 @@ fun ReportMessageView(
|
||||
)
|
||||
Text(
|
||||
text = stringResource(CommonStrings.report_content_explanation),
|
||||
style = ElementTextStyles.Regular.caption1,
|
||||
style = ElementTheme.typography.fontBodySmRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
textAlign = TextAlign.Start,
|
||||
modifier = Modifier.padding(top = 4.dp, bottom = 24.dp, start = 16.dp, end = 16.dp)
|
||||
@@ -134,11 +133,11 @@ fun ReportMessageView(
|
||||
Column(modifier = Modifier.weight(1f), verticalArrangement = Arrangement.spacedBy(4.dp)) {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.screen_report_content_block_user),
|
||||
style = ElementTextStyles.Regular.callout,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
)
|
||||
Text(
|
||||
text = stringResource(CommonStrings.screen_report_content_block_user_hint),
|
||||
style = ElementTextStyles.Regular.bodyMD,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -48,6 +48,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import kotlinx.coroutines.launch
|
||||
|
||||
@OptIn(ExperimentalFoundationApi::class)
|
||||
@@ -105,8 +106,10 @@ fun EmojiPicker(
|
||||
),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Text(text = item.unicode, fontSize = 20.sp)
|
||||
}
|
||||
Text(
|
||||
text = item.unicode,
|
||||
style = ElementTheme.typography.fontHeadingSmRegular,
|
||||
) }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -163,8 +163,8 @@ private fun ContentToPreview(state: BubbleState) {
|
||||
contentAlignment = Alignment.Center,
|
||||
) {
|
||||
Text(
|
||||
fontSize = 10.sp,
|
||||
text = "${state.groupPosition.javaClass.simpleName} m:${state.isMine.to01()} h:${state.isHighlighted.to01()}"
|
||||
text = "${state.groupPosition.javaClass.simpleName} m:${state.isMine.to01()} h:${state.isHighlighted.to01()}",
|
||||
style = ElementTheme.typography.fontBodyXsRegular,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -45,7 +45,6 @@ import io.element.android.features.messages.impl.R
|
||||
import io.element.android.features.messages.impl.timeline.model.AggregatedReaction
|
||||
import io.element.android.features.messages.impl.timeline.model.AggregatedReactionProvider
|
||||
import io.element.android.features.messages.impl.timeline.model.aTimelineItemReactions
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.preview.DayNightPreviews
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreview
|
||||
import io.element.android.libraries.designsystem.text.toDp
|
||||
@@ -117,7 +116,7 @@ private fun TextContent(
|
||||
modifier = modifier
|
||||
.height(reactionEmojiLineHeight.toDp()),
|
||||
text = text,
|
||||
style = ElementTextStyles.Regular.bodyMD
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
|
||||
@Composable
|
||||
@@ -142,14 +141,17 @@ private fun ReactionContent(
|
||||
) {
|
||||
Text(
|
||||
text = reaction.displayKey,
|
||||
fontSize = 15.sp, lineHeight = reactionEmojiLineHeight
|
||||
style = ElementTheme.typography.fontBodyMdRegular.copy(
|
||||
fontSize = 15.sp,
|
||||
lineHeight = reactionEmojiLineHeight,
|
||||
),
|
||||
)
|
||||
if (reaction.count > 1) {
|
||||
Spacer(modifier = Modifier.width(4.dp))
|
||||
Text(
|
||||
text = reaction.count.toString(),
|
||||
color = if (reaction.isHighlighted) MaterialTheme.colorScheme.primary else MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 14.sp,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -176,9 +178,11 @@ internal fun MessagesReactionExtraButtonsPreview() = ElementPreview {
|
||||
onClick = {}
|
||||
)
|
||||
MessagesReactionButton(
|
||||
content = MessagesReactionsButtonContent.Reaction(aTimelineItemReactions().reactions.first().copy(
|
||||
key = "A very long reaction with many characters that should be truncated"
|
||||
)),
|
||||
content = MessagesReactionsButtonContent.Reaction(
|
||||
aTimelineItemReactions().reactions.first().copy(
|
||||
key = "A very long reaction with many characters that should be truncated"
|
||||
)
|
||||
),
|
||||
onClick = {}
|
||||
)
|
||||
}
|
||||
|
||||
@@ -38,12 +38,12 @@ import androidx.compose.ui.unit.dp
|
||||
import io.element.android.features.messages.impl.timeline.model.TimelineItem
|
||||
import io.element.android.features.messages.impl.timeline.model.event.TimelineItemTextBasedContent
|
||||
import io.element.android.libraries.core.bool.orFalse
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.matrix.api.timeline.item.event.LocalEventSendState
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalFoundationApi::class)
|
||||
@@ -78,14 +78,14 @@ fun TimelineEventTimestampView(
|
||||
if (isMessageEdited) {
|
||||
Text(
|
||||
stringResource(CommonStrings.common_edited_suffix),
|
||||
style = ElementTextStyles.Regular.caption2,
|
||||
style = ElementTheme.typography.fontBodyXsRegular,
|
||||
color = tint ?: MaterialTheme.colorScheme.secondary,
|
||||
)
|
||||
Spacer(modifier = Modifier.width(4.dp))
|
||||
}
|
||||
Text(
|
||||
formattedTime,
|
||||
style = ElementTextStyles.Regular.caption2,
|
||||
style = ElementTheme.typography.fontBodyXsRegular,
|
||||
color = tint ?: MaterialTheme.colorScheme.secondary,
|
||||
)
|
||||
if (hasMessageSendingFailed && tint != null) {
|
||||
|
||||
@@ -336,9 +336,8 @@ private fun MessageSenderInformation(
|
||||
Spacer(modifier = Modifier.width(4.dp))
|
||||
Text(
|
||||
text = sender,
|
||||
fontSize = 14.sp,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
style = MaterialTheme.typography.titleMedium,
|
||||
style = ElementTheme.typography.fontBodyMdMedium,
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -393,7 +392,7 @@ private fun MessageEventBubbleContent(
|
||||
onLongClick = ::onTimestampLongClick,
|
||||
modifier = timestampModifier
|
||||
.padding(horizontal = 4.dp, vertical = 4.dp) // Outer padding
|
||||
.background(ElementTheme.legacyColors.gray300, RoundedCornerShape(10.0.dp))
|
||||
.background(ElementTheme.colors.bgSubtleSecondary, RoundedCornerShape(10.0.dp))
|
||||
.align(Alignment.BottomEnd)
|
||||
.padding(horizontal = 4.dp, vertical = 2.dp) // Inner padding
|
||||
)
|
||||
|
||||
@@ -75,13 +75,13 @@ fun TimelineItemFileView(
|
||||
text = content.body,
|
||||
color = ElementTheme.materialColors.primary,
|
||||
maxLines = 2,
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
overflow = TextOverflow.Ellipsis
|
||||
)
|
||||
Text(
|
||||
text = content.fileExtensionAndSize + extraPadding.getStr(12.sp),
|
||||
color = ElementTheme.materialColors.secondary,
|
||||
fontSize = 12.sp,
|
||||
style = ElementTheme.typography.fontBodySmRegular,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
)
|
||||
|
||||
@@ -35,6 +35,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
fun TimelineItemInformativeView(
|
||||
@@ -58,7 +59,7 @@ fun TimelineItemInformativeView(
|
||||
Text(
|
||||
fontStyle = FontStyle.Italic,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 14.sp,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
text = text + extraPadding.getStr(14.sp)
|
||||
)
|
||||
}
|
||||
|
||||
@@ -21,12 +21,12 @@ import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.messages.impl.timeline.model.event.TimelineItemStateContent
|
||||
import io.element.android.features.messages.impl.timeline.model.event.aTimelineItemStateEventContent
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
fun TimelineItemStateView(
|
||||
@@ -36,7 +36,7 @@ fun TimelineItemStateView(
|
||||
Text(
|
||||
modifier = modifier,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 13.sp,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
text = content.body,
|
||||
textAlign = TextAlign.Center,
|
||||
)
|
||||
|
||||
@@ -41,6 +41,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Surface
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
private val CORNER_RADIUS = 8.dp
|
||||
|
||||
@@ -76,7 +77,7 @@ fun GroupHeaderView(
|
||||
Text(
|
||||
text = text,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 13.sp
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
val icon = if (isExpanded) {
|
||||
Icons.Default.ExpandLess
|
||||
|
||||
@@ -35,11 +35,12 @@ import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.features.messages.impl.R
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.features.messages.impl.R
|
||||
import io.element.android.libraries.designsystem.theme.components.ModalBottomSheet
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import kotlinx.coroutines.launch
|
||||
|
||||
@Composable
|
||||
@@ -112,11 +113,17 @@ private fun ColumnScope.RetrySendMenuContents(
|
||||
val coroutineScope = rememberCoroutineScope()
|
||||
|
||||
ListItem(headlineContent = {
|
||||
Text(stringResource(R.string.screen_room_retry_send_menu_title), fontWeight = FontWeight.Medium)
|
||||
Text(
|
||||
text = stringResource(R.string.screen_room_retry_send_menu_title),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
)
|
||||
})
|
||||
ListItem(
|
||||
headlineContent = {
|
||||
Text(stringResource(R.string.screen_room_retry_send_menu_send_again_action))
|
||||
Text(
|
||||
text = stringResource(R.string.screen_room_retry_send_menu_send_again_action),
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
)
|
||||
},
|
||||
modifier = Modifier.clickable {
|
||||
coroutineScope.launch {
|
||||
@@ -127,7 +134,10 @@ private fun ColumnScope.RetrySendMenuContents(
|
||||
)
|
||||
ListItem(
|
||||
headlineContent = {
|
||||
Text(stringResource(R.string.screen_room_retry_send_menu_remove_action))
|
||||
Text(
|
||||
text = stringResource(R.string.screen_room_retry_send_menu_remove_action),
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
)
|
||||
},
|
||||
colors = ListItemDefaults.colors(headlineColor = MaterialTheme.colorScheme.error),
|
||||
modifier = Modifier.clickable {
|
||||
|
||||
@@ -33,6 +33,7 @@ import io.element.android.features.messages.impl.timeline.model.virtual.Timeline
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
internal fun TimelineItemDaySeparatorView(
|
||||
@@ -48,7 +49,7 @@ internal fun TimelineItemDaySeparatorView(
|
||||
) {
|
||||
Text(
|
||||
text = model.formattedDate,
|
||||
style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.Medium),
|
||||
style = ElementTheme.typography.fontBodyMdMedium,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -18,7 +18,6 @@ package io.element.android.features.messages.impl.timeline.debug
|
||||
|
||||
import android.content.ClipData
|
||||
import android.content.ClipboardManager
|
||||
import android.content.Context
|
||||
import androidx.compose.animation.AnimatedVisibility
|
||||
import androidx.compose.animation.expandVertically
|
||||
import androidx.compose.animation.shrinkVertically
|
||||
@@ -52,16 +51,17 @@ import androidx.compose.ui.platform.LocalInspectionMode
|
||||
import androidx.compose.ui.text.font.FontFamily
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import androidx.core.content.getSystemService
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.matrix.api.core.EventId
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
/**
|
||||
* Screen used to display debug info for events.
|
||||
@@ -83,18 +83,22 @@ fun EventDebugInfoView(
|
||||
topBar = {
|
||||
TopAppBar(
|
||||
title = {
|
||||
Text("Debug event info")
|
||||
Text(
|
||||
text = "Debug event info",
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = { BackButton(onClick = onBackPressed) }
|
||||
)
|
||||
},
|
||||
modifier = modifier
|
||||
) { padding ->
|
||||
LazyColumn(modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(padding) // Window insets
|
||||
.consumeWindowInsets(padding)
|
||||
.padding(horizontal = 16.dp) // Internal padding
|
||||
LazyColumn(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(padding) // Window insets
|
||||
.consumeWindowInsets(padding)
|
||||
.padding(horizontal = 16.dp) // Internal padding
|
||||
) {
|
||||
item {
|
||||
Column(Modifier.padding(vertical = 10.dp), verticalArrangement = Arrangement.spacedBy(6.dp)) {
|
||||
@@ -161,7 +165,11 @@ private fun CopyableText(
|
||||
.padding(6.dp)
|
||||
.clickable { clipboardManager.setPrimaryClip(ClipData.newPlainText("JSON", text)) }
|
||||
) {
|
||||
Text(text = text, fontFamily = FontFamily.Monospace, fontSize = 14.sp, modifier = Modifier.padding(8.dp))
|
||||
Text(
|
||||
text = text,
|
||||
style = ElementTheme.typography.fontBodyMdRegular.copy(fontFamily = FontFamily.Monospace),
|
||||
modifier = Modifier.padding(8.dp),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -45,9 +45,9 @@ import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@Composable
|
||||
@@ -98,7 +98,7 @@ private fun Indicator(modifier: Modifier = Modifier) {
|
||||
Spacer(modifier = Modifier.width(8.dp))
|
||||
Text(
|
||||
text = stringResource(CommonStrings.common_offline),
|
||||
style = ElementTextStyles.Regular.bodyMD.copy(fontWeight = FontWeight.Medium),
|
||||
style = ElementTheme.typography.fontBodyMdMedium,
|
||||
color = tint,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -44,6 +44,7 @@ import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMo
|
||||
import io.element.android.libraries.designsystem.atomic.pages.OnBoardingPage
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.components.Button
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.OutlinedButton
|
||||
@@ -166,7 +167,7 @@ private fun OnBoardingButtons(
|
||||
Spacer(Modifier.width(14.dp))
|
||||
Text(
|
||||
text = stringResource(id = R.string.screen_onboarding_sign_in_with_qr_code),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -179,7 +180,7 @@ private fun OnBoardingButtons(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(id = signInButtonStringRes),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
if (state.canCreateAccount) {
|
||||
@@ -191,7 +192,7 @@ private fun OnBoardingButtons(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(id = R.string.screen_onboarding_sign_up),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -57,7 +57,6 @@ import io.element.android.features.roomdetails.impl.blockuser.BlockUserDialogs
|
||||
import io.element.android.features.roomdetails.impl.blockuser.BlockUserSection
|
||||
import io.element.android.features.roomdetails.impl.members.details.RoomMemberHeaderSection
|
||||
import io.element.android.features.roomdetails.impl.members.details.RoomMemberMainActionsSection
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarData
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
@@ -77,6 +76,7 @@ import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.matrix.api.room.RoomMember
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalLayoutApi::class)
|
||||
@@ -234,10 +234,10 @@ internal fun RoomHeaderSection(
|
||||
)
|
||||
}
|
||||
Spacer(modifier = Modifier.height(24.dp))
|
||||
Text(roomName, style = ElementTextStyles.Bold.title1)
|
||||
Text(roomName, style = ElementTheme.typography.fontHeadingLgBold)
|
||||
if (roomAlias != null) {
|
||||
Spacer(modifier = Modifier.height(6.dp))
|
||||
Text(roomAlias, style = ElementTextStyles.Regular.body, color = MaterialTheme.colorScheme.secondary)
|
||||
Text(roomAlias, style = ElementTheme.typography.fontBodyLgRegular, color = MaterialTheme.colorScheme.secondary)
|
||||
}
|
||||
Spacer(Modifier.height(32.dp))
|
||||
}
|
||||
|
||||
@@ -52,11 +52,9 @@ import androidx.compose.ui.focus.FocusManager
|
||||
import androidx.compose.ui.input.pointer.pointerInput
|
||||
import androidx.compose.ui.platform.LocalFocusManager
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.roomdetails.impl.R
|
||||
import io.element.android.libraries.architecture.Async
|
||||
import io.element.android.libraries.designsystem.components.LabelledTextField
|
||||
@@ -68,6 +66,8 @@ import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.components.dialogs.ErrorDialog
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
@@ -75,6 +75,7 @@ import io.element.android.libraries.designsystem.theme.components.TextButton
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.matrix.ui.components.AvatarActionBottomSheet
|
||||
import io.element.android.libraries.matrix.ui.components.UnsavedAvatar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import kotlinx.coroutines.launch
|
||||
|
||||
@@ -106,8 +107,7 @@ fun RoomDetailsEditView(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.screen_room_details_edit_room_title),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = { BackButton(onClick = onBackPressed) },
|
||||
@@ -121,7 +121,7 @@ fun RoomDetailsEditView(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.action_save),
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -264,8 +264,7 @@ private fun LabelledReadOnlyField(
|
||||
) {
|
||||
Text(
|
||||
modifier = Modifier.padding(horizontal = 16.dp),
|
||||
style = MaterialTheme.typography.titleSmall,
|
||||
fontWeight = FontWeight.Normal,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
text = title,
|
||||
)
|
||||
|
||||
@@ -29,16 +29,15 @@ import androidx.compose.material3.ExperimentalMaterial3Api
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.roomdetails.impl.R
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Divider
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.SearchBar
|
||||
@@ -52,6 +51,7 @@ import io.element.android.libraries.matrix.ui.components.CheckableUserRow
|
||||
import io.element.android.libraries.matrix.ui.components.SelectedUsersList
|
||||
import io.element.android.libraries.matrix.ui.model.getAvatarData
|
||||
import io.element.android.libraries.matrix.ui.model.getBestName
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
|
||||
@@ -122,8 +122,7 @@ fun RoomInviteMembersTopBar(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(R.string.screen_room_details_invite_people_title),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = { BackButton(onClick = onBackPressed) },
|
||||
@@ -174,8 +173,8 @@ private fun RoomInviteMembersSearchBar(
|
||||
resultState = state,
|
||||
resultHandler = { results ->
|
||||
Text(
|
||||
text = "Search results",
|
||||
fontWeight = FontWeight.Medium,
|
||||
text = stringResource(id = CommonStrings.common_search_results),
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(start = 16.dp, top = 12.dp, end = 16.dp, bottom = 8.dp)
|
||||
|
||||
@@ -36,19 +36,17 @@ import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.pluralStringResource
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.roomdetails.impl.R
|
||||
import io.element.android.libraries.architecture.Async
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.SearchBar
|
||||
@@ -60,6 +58,7 @@ import io.element.android.libraries.matrix.api.core.UserId
|
||||
import io.element.android.libraries.matrix.api.room.RoomMember
|
||||
import io.element.android.libraries.matrix.api.user.MatrixUser
|
||||
import io.element.android.libraries.matrix.ui.components.MatrixUserRow
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
|
||||
@@ -163,10 +162,8 @@ private fun LazyListScope.roomMemberListSection(
|
||||
Text(
|
||||
modifier = Modifier.padding(horizontal = 16.dp, vertical = 12.dp),
|
||||
text = headerText(),
|
||||
fontSize = 16.sp,
|
||||
style = ElementTextStyles.Regular.callout,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
textAlign = TextAlign.Start,
|
||||
)
|
||||
}
|
||||
items(members) { matrixUser ->
|
||||
@@ -208,8 +205,7 @@ private fun RoomMemberListTopBar(
|
||||
title = {
|
||||
Text(
|
||||
text = stringResource(R.string.screen_room_details_people_title),
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
)
|
||||
},
|
||||
navigationIcon = { BackButton(onClick = onBackPressed) },
|
||||
@@ -221,7 +217,7 @@ private fun RoomMemberListTopBar(
|
||||
) {
|
||||
Text(
|
||||
text = stringResource(CommonStrings.action_invite),
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -43,7 +43,6 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.features.roomdetails.impl.blockuser.BlockUserDialogs
|
||||
import io.element.android.features.roomdetails.impl.blockuser.BlockUserSection
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarData
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
@@ -57,6 +56,7 @@ import io.element.android.libraries.designsystem.preview.LargeHeightPreview
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalMaterial3Api::class, ExperimentalLayoutApi::class)
|
||||
@@ -118,10 +118,10 @@ internal fun RoomMemberHeaderSection(
|
||||
}
|
||||
Spacer(modifier = Modifier.height(24.dp))
|
||||
if (userName != null) {
|
||||
Text(userName, style = ElementTextStyles.Bold.title1)
|
||||
Text(userName, style = ElementTheme.typography.fontHeadingLgBold)
|
||||
Spacer(modifier = Modifier.height(6.dp))
|
||||
}
|
||||
Text(userId, style = ElementTextStyles.Regular.body, color = MaterialTheme.colorScheme.secondary)
|
||||
Text(userId, style = ElementTheme.typography.fontBodyLgRegular, color = MaterialTheme.colorScheme.secondary)
|
||||
Spacer(Modifier.height(40.dp))
|
||||
}
|
||||
}
|
||||
|
||||
@@ -40,6 +40,7 @@ import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.ModalBottomSheet
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.matrix.api.core.RoomId
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@OptIn(ExperimentalMaterial3Api::class)
|
||||
@@ -79,13 +80,16 @@ private fun RoomListModalBottomSheetContent(
|
||||
headlineContent = {
|
||||
Text(
|
||||
text = contextMenu.roomName,
|
||||
fontWeight = FontWeight.Bold,
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
)
|
||||
}
|
||||
)
|
||||
ListItem(
|
||||
headlineContent = {
|
||||
Text(text = stringResource(id = CommonStrings.common_settings))
|
||||
Text(
|
||||
text = stringResource(id = CommonStrings.common_settings),
|
||||
style = MaterialTheme.typography.bodyLarge,
|
||||
)
|
||||
},
|
||||
modifier = Modifier.clickable { onRoomSettingsClicked(contextMenu.roomId) },
|
||||
leadingContent = {
|
||||
@@ -102,6 +106,7 @@ private fun RoomListModalBottomSheetContent(
|
||||
Text(
|
||||
text = stringResource(id = CommonStrings.action_leave_room),
|
||||
color = MaterialTheme.colorScheme.error,
|
||||
style = MaterialTheme.typography.bodyLarge,
|
||||
)
|
||||
},
|
||||
modifier = Modifier.clickable { onLeaveRoomClicked(contextMenu.roomId) },
|
||||
|
||||
@@ -35,13 +35,14 @@ import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.features.roomlist.impl.R
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.components.Button
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Surface
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@Composable
|
||||
@@ -65,7 +66,7 @@ internal fun RequestVerificationHeader(
|
||||
Text(
|
||||
stringResource(R.string.session_verification_banner_title),
|
||||
modifier = Modifier.weight(1f),
|
||||
style = ElementTextStyles.Bold.body,
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
textAlign = TextAlign.Start,
|
||||
)
|
||||
@@ -78,7 +79,7 @@ internal fun RequestVerificationHeader(
|
||||
Spacer(modifier = Modifier.height(4.dp))
|
||||
Text(
|
||||
stringResource(R.string.session_verification_banner_message),
|
||||
style = ElementTextStyles.Regular.bodyMD
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
Spacer(modifier = Modifier.height(12.dp))
|
||||
Button(
|
||||
@@ -88,7 +89,7 @@ internal fun RequestVerificationHeader(
|
||||
) {
|
||||
Text(
|
||||
stringResource(CommonStrings.action_continue),
|
||||
style = ElementTextStyles.Button
|
||||
style = ElementTheme.typography.aliasButtonText
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -24,7 +24,6 @@ import androidx.compose.material.icons.filled.Search
|
||||
import androidx.compose.material.icons.outlined.BugReport
|
||||
import androidx.compose.material.icons.outlined.Share
|
||||
import androidx.compose.material3.ExperimentalMaterial3Api
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.material3.TopAppBarDefaults
|
||||
import androidx.compose.material3.TopAppBarScrollBehavior
|
||||
import androidx.compose.material3.rememberTopAppBarState
|
||||
@@ -37,15 +36,14 @@ import androidx.compose.runtime.setValue
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.input.nestedscroll.nestedScroll
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.features.roomlist.impl.R
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.DropdownMenu
|
||||
import io.element.android.libraries.designsystem.theme.components.DropdownMenuItem
|
||||
import io.element.android.libraries.designsystem.theme.components.DropdownMenuItemText
|
||||
@@ -113,10 +111,12 @@ private fun DefaultRoomListTopBar(
|
||||
modifier = modifier
|
||||
.nestedScroll(scrollBehavior.nestedScrollConnection),
|
||||
title = {
|
||||
val fontSize = if (scrollBehavior.state.collapsedFraction > 0.5) 20.sp else 22.sp
|
||||
val fontStyle = if (scrollBehavior.state.collapsedFraction > 0.5)
|
||||
ElementTheme.typography.aliasScreenTitle
|
||||
else
|
||||
ElementTheme.typography.fontHeadingLgBold
|
||||
Text(
|
||||
fontWeight = FontWeight.Bold,
|
||||
style = MaterialTheme.typography.headlineMedium.copy(fontSize = fontSize),
|
||||
style = fontStyle,
|
||||
text = stringResource(id = R.string.screen_roomlist_main_space_title)
|
||||
)
|
||||
},
|
||||
|
||||
@@ -41,16 +41,17 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.libraries.architecture.Async
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.atomic.molecules.ButtonColumnMolecule
|
||||
import io.element.android.libraries.designsystem.atomic.molecules.IconTitleSubtitleMolecule
|
||||
import io.element.android.libraries.designsystem.atomic.pages.HeaderFooterPage
|
||||
import io.element.android.libraries.designsystem.components.button.ButtonWithProgress
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.matrix.api.verification.VerificationEmoji
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
import io.element.android.features.verifysession.impl.VerifySelfSessionState.VerificationStep as FlowStep
|
||||
|
||||
@@ -158,11 +159,14 @@ internal fun ContentVerifying(verificationFlowStep: FlowStep.Verifying, modifier
|
||||
@Composable
|
||||
internal fun EmojiItemView(emoji: VerificationEmoji, modifier: Modifier = Modifier) {
|
||||
Column(horizontalAlignment = Alignment.CenterHorizontally, modifier = modifier) {
|
||||
Text(emoji.code, fontSize = 34.sp)
|
||||
Text(
|
||||
text = emoji.code,
|
||||
style = ElementTheme.typography.fontBodyMdRegular.copy(fontSize = 34.sp),
|
||||
)
|
||||
Spacer(modifier = Modifier.height(16.dp))
|
||||
Text(
|
||||
emoji.name,
|
||||
style = ElementTextStyles.Regular.bodyMD,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
@@ -227,7 +231,10 @@ internal fun BottomMenu(screenState: VerifySelfSessionState, goBack: () -> Unit)
|
||||
onClick = negativeButtonCallback,
|
||||
enabled = negativeButtonEnabled,
|
||||
) {
|
||||
Text(stringResource(negativeButtonTitle), fontSize = 16.sp)
|
||||
Text(
|
||||
text = stringResource(negativeButtonTitle),
|
||||
style = ElementTheme.typography.aliasButtonText,
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,234 +0,0 @@
|
||||
/*
|
||||
* Copyright (c) 2023 New Vector Ltd
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
package io.element.android.libraries.designsystem
|
||||
|
||||
import androidx.compose.ui.text.PlatformTextStyle
|
||||
import androidx.compose.ui.text.TextStyle
|
||||
import androidx.compose.ui.text.font.FontStyle
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.unit.sp
|
||||
|
||||
// TODO Remove
|
||||
object ElementTextStyles {
|
||||
|
||||
@Suppress("DEPRECATION")
|
||||
val Button = TextStyle(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.Medium,
|
||||
lineHeight = 22.sp,
|
||||
fontStyle = FontStyle.Normal,
|
||||
textAlign = TextAlign.Center,
|
||||
platformStyle = PlatformTextStyle(includeFontPadding = false)
|
||||
)
|
||||
|
||||
object Bold {
|
||||
val largeTitle = TextStyle(
|
||||
fontSize = 34.sp,
|
||||
fontWeight = FontWeight.Bold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 41.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val title1 = TextStyle(
|
||||
fontSize = 28.sp,
|
||||
fontWeight = FontWeight.Bold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 34.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val title2 = TextStyle(
|
||||
fontSize = 22.sp,
|
||||
fontWeight = FontWeight.Bold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 28.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val title3 = TextStyle(
|
||||
fontSize = 20.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 25.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val headline = TextStyle(
|
||||
fontSize = 17.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 22.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val body = TextStyle(
|
||||
fontSize = 17.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 22.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val callout = TextStyle(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 21.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val subheadline = TextStyle(
|
||||
fontSize = 15.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 20.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val footnote = TextStyle(
|
||||
fontSize = 13.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 18.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val caption1 = TextStyle(
|
||||
fontSize = 12.sp,
|
||||
fontWeight = FontWeight.Medium,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 16.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val caption2 = TextStyle(
|
||||
fontSize = 11.sp,
|
||||
fontWeight = FontWeight.Medium,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 13.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
}
|
||||
|
||||
object Regular {
|
||||
val largeTitle = TextStyle(
|
||||
fontSize = 34.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 41.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val title1 = TextStyle(
|
||||
fontSize = 28.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 34.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val title2 = TextStyle(
|
||||
fontSize = 22.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 28.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val title3 = TextStyle(
|
||||
fontSize = 20.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 25.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val headline = TextStyle(
|
||||
fontSize = 17.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 22.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val body = TextStyle(
|
||||
fontSize = 17.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 22.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val callout = TextStyle(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 21.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val subheadline = TextStyle(
|
||||
fontSize = 15.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 20.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val formHeader = TextStyle(
|
||||
fontSize = 14.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 20.sp,
|
||||
textAlign = TextAlign.Start
|
||||
)
|
||||
|
||||
val bodyMD = TextStyle(
|
||||
fontSize = 14.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 20.sp,
|
||||
textAlign = TextAlign.Start
|
||||
)
|
||||
|
||||
val footnote = TextStyle(
|
||||
fontSize = 13.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 18.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val caption1 = TextStyle(
|
||||
fontSize = 12.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 16.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
|
||||
val caption2 = TextStyle(
|
||||
fontSize = 11.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
fontStyle = FontStyle.Normal,
|
||||
lineHeight = 13.sp,
|
||||
textAlign = TextAlign.Center
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -36,6 +36,7 @@ import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
/**
|
||||
@@ -59,7 +60,7 @@ fun RoundedIconAtom(
|
||||
modifier = modifier
|
||||
.size(size.toContainerSize())
|
||||
.background(
|
||||
color = ElementTheme.legacyColors.quinary,
|
||||
color = ElementTheme.colors.temporaryColorBgSpecial,
|
||||
shape = RoundedCornerShape(size.toCornerSize())
|
||||
)
|
||||
) {
|
||||
|
||||
@@ -29,13 +29,13 @@ import androidx.compose.ui.graphics.vector.ImageVector
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.R
|
||||
import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtom
|
||||
import io.element.android.libraries.designsystem.atomic.atoms.RoundedIconAtomSize
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
/**
|
||||
* IconTitleSubtitleMolecule is a molecule which displays an icon, a title and a subtitle.
|
||||
@@ -71,7 +71,7 @@ fun IconTitleSubtitleMolecule(
|
||||
modifier = Modifier
|
||||
.fillMaxWidth(),
|
||||
textAlign = TextAlign.Center,
|
||||
style = ElementTextStyles.Bold.title2,
|
||||
style = ElementTheme.typography.fontHeadingMdBold,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
)
|
||||
Spacer(Modifier.height(8.dp))
|
||||
@@ -79,7 +79,7 @@ fun IconTitleSubtitleMolecule(
|
||||
text = subTitle,
|
||||
modifier = Modifier.fillMaxWidth(),
|
||||
textAlign = TextAlign.Center,
|
||||
style = ElementTextStyles.Regular.subheadline,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -23,13 +23,13 @@ import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TextField
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
fun LabelledTextField(
|
||||
@@ -47,8 +47,7 @@ fun LabelledTextField(
|
||||
) {
|
||||
Text(
|
||||
modifier = Modifier.padding(horizontal = 16.dp),
|
||||
style = MaterialTheme.typography.titleSmall,
|
||||
fontWeight = FontWeight.Normal,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
text = label
|
||||
)
|
||||
|
||||
@@ -94,7 +94,7 @@ private fun InitialsAvatar(
|
||||
Text(
|
||||
modifier = Modifier.align(Alignment.Center),
|
||||
text = avatarData.initial,
|
||||
fontSize = avatarData.size.dp.toSp() / 2,
|
||||
style = ElementTheme.typography.fontBodyMdRegular.copy(fontSize = avatarData.size.dp.toSp() / 2),
|
||||
color = Color.White,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -32,13 +32,14 @@ import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Shape
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.preview.ElementThemedPreview
|
||||
import io.element.android.libraries.designsystem.preview.PreviewGroup
|
||||
import io.element.android.libraries.designsystem.theme.aliasButtonText
|
||||
import io.element.android.libraries.designsystem.theme.components.Button
|
||||
import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
|
||||
import io.element.android.libraries.designsystem.theme.components.ElementButtonDefaults
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
/**
|
||||
* A component that will display a button with an indeterminate circular progressbar.
|
||||
@@ -64,7 +65,9 @@ fun ButtonWithProgress(
|
||||
) {
|
||||
Button(
|
||||
onClick = {
|
||||
if (!showProgress) { onClick() }
|
||||
if (!showProgress) {
|
||||
onClick()
|
||||
}
|
||||
},
|
||||
modifier = modifier,
|
||||
enabled = enabled,
|
||||
@@ -85,10 +88,10 @@ fun ButtonWithProgress(
|
||||
)
|
||||
if (progressText != null) {
|
||||
Spacer(Modifier.width(10.dp))
|
||||
Text(progressText, style = ElementTextStyles.Button)
|
||||
Text(progressText, style = ElementTheme.typography.aliasButtonText)
|
||||
}
|
||||
} else if (text != null) {
|
||||
Text(text, style = ElementTextStyles.Button)
|
||||
Text(text, style = ElementTheme.typography.aliasButtonText)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -33,14 +33,13 @@ import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.vector.ImageVector
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.preview.ElementThemedPreview
|
||||
import io.element.android.libraries.designsystem.preview.PreviewGroup
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
fun MainActionButton(
|
||||
@@ -71,7 +70,7 @@ fun MainActionButton(
|
||||
Spacer(modifier = Modifier.height(14.dp))
|
||||
Text(
|
||||
title,
|
||||
style = ElementTextStyles.Regular.bodyMD.copy(fontWeight = FontWeight.Medium),
|
||||
style = ElementTheme.typography.fontBodyMdMedium,
|
||||
color = tintColor,
|
||||
)
|
||||
}
|
||||
|
||||
@@ -38,8 +38,8 @@ import androidx.compose.ui.layout.Layout
|
||||
import androidx.compose.ui.layout.Placeable
|
||||
import androidx.compose.ui.unit.Dp
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import kotlin.math.max
|
||||
|
||||
@Composable
|
||||
@@ -72,24 +72,26 @@ internal fun SimpleAlertDialogContent(
|
||||
// If there is a 3rd item it should be at the end of the dialog
|
||||
// Having this 3rd action is discouraged, see https://m3.material.io/components/dialogs/guidelines#e13b68f5-e367-4275-ad6f-c552ee8e358f
|
||||
TextButton(onClick = onThirdButtonClicked) {
|
||||
Text(thirdButtonText)
|
||||
Text(
|
||||
text = thirdButtonText,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
}
|
||||
}
|
||||
TextButton(onClick = onCancelClicked) {
|
||||
Text(cancelText)
|
||||
Text(
|
||||
text = cancelText,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
}
|
||||
if (submitText != null) {
|
||||
TextButton(
|
||||
onClick = {
|
||||
onSubmitClicked()
|
||||
},
|
||||
) {
|
||||
TextButton(onClick = onSubmitClicked) {
|
||||
Text(
|
||||
submitText,
|
||||
text = submitText,
|
||||
style = if (emphasizeSubmitButton) {
|
||||
ElementTextStyles.Bold.subheadline
|
||||
ElementTheme.typography.fontBodyMdMedium
|
||||
} else {
|
||||
MaterialTheme.typography.labelLarge
|
||||
ElementTheme.typography.fontBodyMdRegular
|
||||
}
|
||||
)
|
||||
}
|
||||
@@ -98,10 +100,18 @@ internal fun SimpleAlertDialogContent(
|
||||
},
|
||||
modifier = modifier,
|
||||
title = {
|
||||
if (title != null) { Text(text = title) }
|
||||
if (title != null) {
|
||||
Text(
|
||||
text = title,
|
||||
style = ElementTheme.typography.fontHeadingSmRegular,
|
||||
)
|
||||
}
|
||||
},
|
||||
text = {
|
||||
Text(content)
|
||||
Text(
|
||||
text = content,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
},
|
||||
shape = shape,
|
||||
containerColor = containerColor,
|
||||
|
||||
@@ -29,6 +29,7 @@ import androidx.compose.ui.unit.Dp
|
||||
import io.element.android.libraries.designsystem.preview.ElementThemedPreview
|
||||
import io.element.android.libraries.designsystem.preview.PreviewGroup
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@Composable
|
||||
@@ -51,19 +52,31 @@ fun RetryDialog(
|
||||
modifier = modifier,
|
||||
onDismissRequest = onDismiss,
|
||||
title = {
|
||||
Text(title)
|
||||
Text(
|
||||
text = title,
|
||||
style = ElementTheme.typography.fontHeadingSmRegular,
|
||||
)
|
||||
},
|
||||
text = {
|
||||
Text(content)
|
||||
Text(
|
||||
text = content,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
},
|
||||
confirmButton = {
|
||||
TextButton(onClick = onRetry) {
|
||||
Text(retryText)
|
||||
Text(
|
||||
text = retryText,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
}
|
||||
},
|
||||
dismissButton = {
|
||||
TextButton(onClick = onDismiss) {
|
||||
Text(dismissText)
|
||||
Text(
|
||||
text = dismissText,
|
||||
style = ElementTheme.typography.fontBodyMdRegular,
|
||||
)
|
||||
}
|
||||
},
|
||||
shape = shape,
|
||||
|
||||
@@ -39,6 +39,7 @@ import androidx.compose.ui.tooling.preview.Preview
|
||||
import io.element.android.libraries.designsystem.components.button.BackButton
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.aliasScreenTitle
|
||||
import io.element.android.libraries.designsystem.theme.components.Scaffold
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.components.TopAppBar
|
||||
@@ -94,7 +95,7 @@ fun PreferenceTopAppBar(
|
||||
title = {
|
||||
Text(
|
||||
text = title,
|
||||
style = ElementTheme.typography.fontHeadingSmMedium,
|
||||
style = ElementTheme.typography.aliasScreenTitle,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis
|
||||
)
|
||||
|
||||
@@ -65,6 +65,10 @@ val SemanticColors.messageFromOtherBackground
|
||||
Color(0xFF26282D)
|
||||
}
|
||||
|
||||
// Temporary color, which is not in the token right now
|
||||
val SemanticColors.temporaryColorBgSpecial
|
||||
get() = if (isLight) Color(0xFFE4E8F0) else Color(0xFF3A4048)
|
||||
|
||||
@Preview
|
||||
@Composable
|
||||
internal fun ColorAliasesLightPreview() = ElementPreviewLight { ContentToPreview() }
|
||||
@@ -86,6 +90,7 @@ private fun ContentToPreview() {
|
||||
"placeholderBackground" to ElementTheme.colors.placeholderBackground,
|
||||
"messageFromMeBackground" to ElementTheme.colors.messageFromMeBackground,
|
||||
"messageFromOtherBackground" to ElementTheme.colors.messageFromOtherBackground,
|
||||
"temporaryColorBgSpecial" to ElementTheme.colors.temporaryColorBgSpecial,
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,30 @@
|
||||
/*
|
||||
* Copyright (c) 2023 New Vector Ltd
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
package io.element.android.libraries.designsystem.theme
|
||||
|
||||
import androidx.compose.ui.text.TextStyle
|
||||
import io.element.android.libraries.theme.compound.generated.TypographyTokens
|
||||
|
||||
/*
|
||||
* This file contains aliases for TypographyTokens.
|
||||
*/
|
||||
|
||||
val TypographyTokens.aliasScreenTitle: TextStyle
|
||||
get() = fontHeadingSmMedium
|
||||
|
||||
val TypographyTokens.aliasButtonText: TextStyle
|
||||
get() = fontBodyLgMedium
|
||||
@@ -156,10 +156,10 @@ object ElementSearchBarDefaults {
|
||||
@OptIn(ExperimentalMaterial3Api::class)
|
||||
@Composable
|
||||
fun inactiveColors() = SearchBarDefaults.colors(
|
||||
containerColor = ElementTheme.legacyColors.gray300,
|
||||
containerColor = ElementTheme.materialColors.surfaceVariant,
|
||||
inputFieldColors = TextFieldDefaults.colors(
|
||||
unfocusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
|
||||
focusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
|
||||
unfocusedPlaceholderColor = ElementTheme.colors.textDisabled,
|
||||
focusedPlaceholderColor = ElementTheme.colors.textDisabled,
|
||||
unfocusedLeadingIconColor = MaterialTheme.colorScheme.primary,
|
||||
focusedLeadingIconColor = MaterialTheme.colorScheme.primary,
|
||||
unfocusedTrailingIconColor = MaterialTheme.colorScheme.primary,
|
||||
@@ -172,8 +172,8 @@ object ElementSearchBarDefaults {
|
||||
fun activeColors() = SearchBarDefaults.colors(
|
||||
containerColor = Color.Transparent,
|
||||
inputFieldColors = TextFieldDefaults.colors(
|
||||
unfocusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
|
||||
focusedPlaceholderColor = ElementTheme.legacyColors.placeholder,
|
||||
unfocusedPlaceholderColor = ElementTheme.colors.textDisabled,
|
||||
focusedPlaceholderColor = ElementTheme.colors.textDisabled,
|
||||
unfocusedLeadingIconColor = MaterialTheme.colorScheme.primary,
|
||||
focusedLeadingIconColor = MaterialTheme.colorScheme.primary,
|
||||
unfocusedTrailingIconColor = MaterialTheme.colorScheme.primary,
|
||||
@@ -243,19 +243,28 @@ internal fun SearchBarPreviewActiveWithContent() = ElementThemedPreview {
|
||||
active = true,
|
||||
resultState = SearchBarResultState.Results("result!"),
|
||||
contentPrefix = {
|
||||
Text(text = "Content that goes before the search results", modifier = Modifier
|
||||
.background(color = Color.Red)
|
||||
.fillMaxWidth())
|
||||
Text(
|
||||
text = "Content that goes before the search results",
|
||||
modifier = Modifier
|
||||
.background(color = Color.Red)
|
||||
.fillMaxWidth()
|
||||
)
|
||||
},
|
||||
contentSuffix = {
|
||||
Text(text = "Content that goes after the search results", modifier = Modifier
|
||||
.background(color = Color.Blue)
|
||||
.fillMaxWidth())
|
||||
Text(
|
||||
text = "Content that goes after the search results",
|
||||
modifier = Modifier
|
||||
.background(color = Color.Blue)
|
||||
.fillMaxWidth()
|
||||
)
|
||||
},
|
||||
resultHandler = {
|
||||
Text(text = "Results go here", modifier = Modifier
|
||||
.background(color = Color.Green)
|
||||
.fillMaxWidth())
|
||||
Text(
|
||||
text = "Results go here",
|
||||
modifier = Modifier
|
||||
.background(color = Color.Green)
|
||||
.fillMaxWidth()
|
||||
)
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
@@ -56,19 +56,9 @@ fun Text(
|
||||
text: String,
|
||||
modifier: Modifier = Modifier,
|
||||
color: Color = Color.Unspecified,
|
||||
// Will be removed, only style should be used
|
||||
fontSize: TextUnit = TextUnit.Unspecified,
|
||||
fontStyle: FontStyle? = null,
|
||||
// Will be removed, only style should be used
|
||||
fontWeight: FontWeight? = null,
|
||||
// Will be removed, only style should be used
|
||||
fontFamily: FontFamily? = null,
|
||||
// Will be removed, only style should be used
|
||||
letterSpacing: TextUnit = TextUnit.Unspecified,
|
||||
textDecoration: TextDecoration? = null,
|
||||
textAlign: TextAlign? = null,
|
||||
// Will be removed, only style should be used
|
||||
lineHeight: TextUnit = TextUnit.Unspecified,
|
||||
overflow: TextOverflow = TextOverflow.Clip,
|
||||
softWrap: Boolean = true,
|
||||
minLines: Int = 1,
|
||||
@@ -80,14 +70,9 @@ fun Text(
|
||||
text = text,
|
||||
modifier = modifier,
|
||||
color = color,
|
||||
fontSize = fontSize,
|
||||
fontStyle = fontStyle,
|
||||
fontWeight = fontWeight,
|
||||
fontFamily = fontFamily,
|
||||
letterSpacing = letterSpacing,
|
||||
textDecoration = textDecoration,
|
||||
textAlign = textAlign,
|
||||
lineHeight = lineHeight,
|
||||
overflow = overflow,
|
||||
softWrap = softWrap,
|
||||
minLines = minLines,
|
||||
|
||||
@@ -34,13 +34,13 @@ import androidx.compose.runtime.rememberCoroutineScope
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.ModalBottomSheetLayout
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.matrix.ui.media.AvatarAction
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
import kotlinx.collections.immutable.persistentListOf
|
||||
import kotlinx.coroutines.launch
|
||||
@@ -93,7 +93,7 @@ private fun AvatarActionBottomSheetContent(
|
||||
headlineContent = {
|
||||
Text(
|
||||
text = stringResource(action.titleResId),
|
||||
fontSize = 16.sp,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
color = if (action.destructive) MaterialTheme.colorScheme.error else MaterialTheme.colorScheme.primary,
|
||||
)
|
||||
},
|
||||
|
||||
@@ -25,22 +25,20 @@ import androidx.compose.material3.MaterialTheme
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.tooling.preview.PreviewParameter
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import io.element.android.libraries.designsystem.components.avatar.Avatar
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarData
|
||||
import io.element.android.libraries.designsystem.components.avatar.AvatarSize
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.noFontPadding
|
||||
import io.element.android.libraries.matrix.api.user.MatrixUser
|
||||
import io.element.android.libraries.matrix.ui.model.getAvatarData
|
||||
import io.element.android.libraries.matrix.ui.model.getBestName
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
@Composable
|
||||
fun MatrixUserRow(
|
||||
@@ -75,23 +73,20 @@ fun UserRow(
|
||||
) {
|
||||
// Name
|
||||
Text(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.Normal,
|
||||
text = name,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
style = noFontPadding,
|
||||
style = ElementTheme.typography.fontBodyLgRegular,
|
||||
)
|
||||
// Id
|
||||
subtext?.let {
|
||||
Text(
|
||||
text = subtext,
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 12.sp,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
style = noFontPadding,
|
||||
style = ElementTheme.typography.fontBodySmRegular,
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -32,7 +32,6 @@ import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.semantics.Role
|
||||
import androidx.compose.ui.text.font.FontWeight
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
@@ -45,8 +44,8 @@ import io.element.android.libraries.designsystem.theme.components.Checkbox
|
||||
import io.element.android.libraries.designsystem.theme.components.Divider
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
import io.element.android.libraries.designsystem.theme.noFontPadding
|
||||
import io.element.android.libraries.matrix.ui.model.getAvatarData
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
import io.element.android.libraries.ui.strings.CommonStrings
|
||||
|
||||
@Composable
|
||||
@@ -70,13 +69,11 @@ fun UnresolvedUserRow(
|
||||
) {
|
||||
// ID
|
||||
Text(
|
||||
fontSize = 16.sp,
|
||||
fontWeight = FontWeight.SemiBold,
|
||||
text = id,
|
||||
maxLines = 1,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
color = MaterialTheme.colorScheme.primary,
|
||||
style = noFontPadding,
|
||||
style = ElementTheme.typography.fontBodyLgMedium,
|
||||
)
|
||||
|
||||
// Warning
|
||||
@@ -98,8 +95,7 @@ fun UnresolvedUserRow(
|
||||
Text(
|
||||
text = stringResource(CommonStrings.common_invite_unknown_profile),
|
||||
color = MaterialTheme.colorScheme.secondary,
|
||||
fontSize = 12.sp,
|
||||
lineHeight = 16.sp,
|
||||
style = ElementTheme.typography.fontBodySmRegular.copy(lineHeight = 16.sp),
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -40,6 +40,7 @@ import io.element.android.libraries.designsystem.preview.ElementPreviewDark
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.preview.debugPlaceholderBackground
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.temporaryColorBgSpecial
|
||||
import io.element.android.libraries.theme.ElementTheme
|
||||
|
||||
/**
|
||||
@@ -69,7 +70,7 @@ fun UnsavedAvatar(
|
||||
contentDescription = null,
|
||||
)
|
||||
} else {
|
||||
Box(modifier = commonModifier.background(ElementTheme.legacyColors.quinary)) {
|
||||
Box(modifier = commonModifier.background(ElementTheme.colors.temporaryColorBgSpecial)) {
|
||||
Icon(
|
||||
imageVector = Icons.Outlined.AddAPhoto,
|
||||
contentDescription = "",
|
||||
|
||||
@@ -68,14 +68,11 @@ import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.text.input.VisualTransformation
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import io.element.android.libraries.designsystem.ElementTextStyles
|
||||
import io.element.android.libraries.designsystem.VectorIcons
|
||||
import io.element.android.libraries.designsystem.modifiers.applyIf
|
||||
import io.element.android.libraries.designsystem.preview.DayNightPreviews
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreview
|
||||
import io.element.android.libraries.designsystem.preview.ElementPreviewLight
|
||||
import io.element.android.libraries.designsystem.theme.components.Icon
|
||||
import io.element.android.libraries.designsystem.theme.components.Surface
|
||||
import io.element.android.libraries.designsystem.theme.components.Text
|
||||
@@ -141,7 +138,7 @@ fun TextComposer(
|
||||
if (composerMode is MessageComposerMode.Special) {
|
||||
ComposerModeView(composerMode = composerMode, onResetComposerMode = onResetComposerMode)
|
||||
}
|
||||
val defaultTypography = ElementTextStyles.Regular.callout.copy(textAlign = TextAlign.Start)
|
||||
val defaultTypography = ElementTheme.typography.fontBodyLgRegular
|
||||
Box {
|
||||
BasicTextField(
|
||||
modifier = Modifier
|
||||
|
||||
@@ -8,14 +8,10 @@ The module contains public tokens and color schemes that are later used in `Mate
|
||||
|
||||
All tokens can be accessed through the `ElementTheme` object, which contains the following properties:
|
||||
|
||||
* `ElementTheme.legacyColors`: contains legacy colors and custom colors not present in either Material or Compound. Usage of these colors should be avoided, and they're usually prefixed in Figma with the `Zzz/` prefix or have no name at all.
|
||||
* `ElementTheme.materialColors`: contains all Material color tokens. In Figma, they're prefixed with `M3/`. It's an alias to `MaterialTheme.colorScheme`.
|
||||
* `ElementTheme.colors`: contains all Compound semantic color tokens. In Figma, they're prefixed with either `Light/` or `Dark/`.
|
||||
* `ElementTheme.materialTypography`: contains the Material `Typography` values. In Figma, they're prefixed with `M3/`. It's an alias to `MaterialTheme.typography`.
|
||||
* `ElementTheme.typography`: contains the Compound `TypographyTokens` values. In Figma, they're prefixed with `Android/font/`.
|
||||
|
||||
## Adding new tokens
|
||||
|
||||
All new tokens **should** come from Compound and added to the `compound.generated` package. To map the literal tokens to the semantic ones, you'll have to update both `compoundColorsLight` and `compoundColorsDark` in `CompoundColors.kt`.
|
||||
|
||||
As we're still migrating to using Compound tokens, it's possible that you might need to add some tokens manually. In that case, you should add them to `LegacyColors.kt` and map them later in `ElementColors.kt` so they can be used in light and dark themes. However, keep in mind this is just a temporary step, as those tokens should either be added later to Compound or replaced by Compound tokens in the future.
|
||||
|
||||
@@ -1,107 +0,0 @@
|
||||
/*
|
||||
* Copyright (c) 2023 New Vector Ltd
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
package io.element.android.libraries.theme
|
||||
|
||||
import androidx.compose.runtime.Stable
|
||||
import androidx.compose.runtime.getValue
|
||||
import androidx.compose.runtime.mutableStateOf
|
||||
import androidx.compose.runtime.setValue
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import io.element.android.libraries.theme.compound.generated.internal.DarkDesignTokens
|
||||
import io.element.android.libraries.theme.compound.generated.internal.LightDesignTokens
|
||||
import io.element.android.libraries.theme.compound.generated.SemanticColors
|
||||
|
||||
/**
|
||||
* Element Android legacy color palette.
|
||||
*
|
||||
* ## IMPORTANT!
|
||||
* **We should not add any new colors here, all new colors should come from [SemanticColors] instead.**
|
||||
*
|
||||
* If a design needs you to add a different color here, talk to some designer first, as they'll probably be using
|
||||
* the legacy color palette.
|
||||
*/
|
||||
@Deprecated("Use SemanticColors instead")
|
||||
@Stable
|
||||
class ElementColors(
|
||||
quaternary: Color,
|
||||
quinary: Color,
|
||||
gray300: Color,
|
||||
accentColor: Color,
|
||||
placeholder: Color,
|
||||
isLight: Boolean
|
||||
) {
|
||||
var quaternary by mutableStateOf(quaternary)
|
||||
private set
|
||||
|
||||
var quinary by mutableStateOf(quinary)
|
||||
private set
|
||||
|
||||
var gray300 by mutableStateOf(gray300)
|
||||
private set
|
||||
|
||||
var accentColor by mutableStateOf(accentColor)
|
||||
private set
|
||||
|
||||
var placeholder by mutableStateOf(placeholder)
|
||||
private set
|
||||
|
||||
var isLight by mutableStateOf(isLight)
|
||||
private set
|
||||
|
||||
fun copy(
|
||||
quaternary: Color = this.quaternary,
|
||||
quinary: Color = this.quinary,
|
||||
gray300: Color = this.gray300,
|
||||
accentColor: Color = this.accentColor,
|
||||
placeholder: Color = this.placeholder,
|
||||
isLight: Boolean = this.isLight,
|
||||
) = ElementColors(
|
||||
quaternary = quaternary,
|
||||
quinary = quinary,
|
||||
gray300 = gray300,
|
||||
accentColor = accentColor,
|
||||
placeholder = placeholder,
|
||||
isLight = isLight,
|
||||
)
|
||||
|
||||
fun updateColorsFrom(other: ElementColors) {
|
||||
quaternary = other.quaternary
|
||||
quinary = other.quinary
|
||||
gray300 = other.gray300
|
||||
accentColor = other.accentColor
|
||||
placeholder = other.placeholder
|
||||
isLight = other.isLight
|
||||
}
|
||||
}
|
||||
|
||||
internal fun elementColorsLight() = ElementColors(
|
||||
quaternary = Gray_100,
|
||||
quinary = Gray_50,
|
||||
gray300 = LightDesignTokens.colorGray300,
|
||||
accentColor = ElementGreen,
|
||||
placeholder = LightDesignTokens.colorGray800,
|
||||
isLight = true,
|
||||
)
|
||||
|
||||
internal fun elementColorsDark() = ElementColors(
|
||||
quaternary = Gray_400,
|
||||
quinary = Gray_450,
|
||||
gray300 = DarkDesignTokens.colorGray300,
|
||||
accentColor = ElementGreen,
|
||||
placeholder = DarkDesignTokens.colorGray800,
|
||||
isLight = false,
|
||||
)
|
||||
@@ -44,15 +44,6 @@ import io.element.android.libraries.theme.compound.generated.TypographyTokens
|
||||
* Inspired from https://medium.com/@lucasyujideveloper/54cbcbde1ace
|
||||
*/
|
||||
object ElementTheme {
|
||||
/**
|
||||
* The current [ElementColors] provided by [ElementTheme]. Usage of these colors is discouraged.
|
||||
* In Figma, they usually have the `Zzz` prefix or have no name at all.
|
||||
*/
|
||||
val legacyColors: ElementColors
|
||||
@Composable
|
||||
@ReadOnlyComposable
|
||||
get() = LocalLegacyColors.current
|
||||
|
||||
/**
|
||||
* The current [SemanticColors] provided by [ElementTheme].
|
||||
* These come from Compound and are the recommended colors to use for custom components.
|
||||
@@ -72,14 +63,6 @@ object ElementTheme {
|
||||
@ReadOnlyComposable
|
||||
get() = MaterialTheme.colorScheme
|
||||
|
||||
/**
|
||||
* Material 3 [Typography] tokens. In Figma, these have the `M3/` prefix.
|
||||
*/
|
||||
val materialTypography: Typography
|
||||
@Composable
|
||||
@ReadOnlyComposable
|
||||
get() = MaterialTheme.typography
|
||||
|
||||
/**
|
||||
* Compound [Typography] tokens. In Figma, these have the `Android/font/` prefix.
|
||||
*/
|
||||
@@ -95,14 +78,12 @@ object ElementTheme {
|
||||
}
|
||||
|
||||
/* Global variables (application level) */
|
||||
internal val LocalLegacyColors = staticCompositionLocalOf { elementColorsLight() }
|
||||
internal val LocalCompoundColors = staticCompositionLocalOf { compoundColorsLight }
|
||||
|
||||
@Composable
|
||||
fun ElementTheme(
|
||||
darkTheme: Boolean = isSystemInDarkTheme(),
|
||||
dynamicColor: Boolean = false, /* true to enable MaterialYou */
|
||||
legacyColors: ElementColors = if (darkTheme) elementColorsDark() else elementColorsLight(),
|
||||
compoundColors: SemanticColors = if (darkTheme) compoundColorsDark else compoundColorsLight,
|
||||
materialLightColors: ColorScheme = materialColorSchemeLight,
|
||||
materialDarkColors: ColorScheme = materialColorSchemeDark,
|
||||
@@ -110,9 +91,6 @@ fun ElementTheme(
|
||||
content: @Composable () -> Unit,
|
||||
) {
|
||||
val systemUiController = rememberSystemUiController()
|
||||
val currentLegacyColor = remember(darkTheme) {
|
||||
legacyColors.copy()
|
||||
}.apply { updateColorsFrom(legacyColors) }
|
||||
val currentCompoundColor = remember(darkTheme) {
|
||||
compoundColors.copy()
|
||||
}.apply { updateColorsFrom(compoundColors) }
|
||||
@@ -128,7 +106,6 @@ fun ElementTheme(
|
||||
systemUiController.applyTheme(colorScheme = colorScheme, darkTheme = darkTheme)
|
||||
}
|
||||
CompositionLocalProvider(
|
||||
LocalLegacyColors provides currentLegacyColor,
|
||||
LocalCompoundColors provides currentCompoundColor,
|
||||
) {
|
||||
MaterialTheme(
|
||||
@@ -149,7 +126,7 @@ fun ForcedDarkElementTheme(
|
||||
) {
|
||||
val systemUiController = rememberSystemUiController()
|
||||
val colorScheme = MaterialTheme.colorScheme
|
||||
val wasDarkTheme = !ElementTheme.legacyColors.isLight
|
||||
val wasDarkTheme = !ElementTheme.colors.isLight
|
||||
DisposableEffect(Unit) {
|
||||
onDispose {
|
||||
systemUiController.applyTheme(colorScheme, wasDarkTheme)
|
||||
|
||||
@@ -17,7 +17,6 @@
|
||||
package io.element.android.libraries.theme
|
||||
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import com.airbnb.android.showkase.annotation.ShowkaseColor
|
||||
|
||||
// =================================================================================================
|
||||
// IMPORTANT!
|
||||
@@ -26,50 +25,4 @@ import com.airbnb.android.showkase.annotation.ShowkaseColor
|
||||
// iterate through the designs. All new colors should come from Compound's Design Tokens.
|
||||
// =================================================================================================
|
||||
|
||||
@ShowkaseColor(name = "LightGrey", group = "Material Design")
|
||||
val LightGrey = Color(0x993C3C43)
|
||||
|
||||
@ShowkaseColor(name = "DarkGrey", group = "Material Design")
|
||||
val DarkGrey = Color(0x99EBEBF5)
|
||||
|
||||
val SystemGreyLight = Color(0xFF8E8E93)
|
||||
val SystemGreyDark = Color(0xFF8E8E93)
|
||||
val SystemGrey2Light = Color(0xFFAEAEB2)
|
||||
val SystemGrey2Dark = Color(0xFF636366)
|
||||
val SystemGrey3Light = Color(0xFFC7C7CC)
|
||||
val SystemGrey3Dark = Color(0xFF48484A)
|
||||
val SystemGrey4Light = Color(0xFFD1D1D6)
|
||||
val SystemGrey4Dark = Color(0xFF3A3A3C)
|
||||
val SystemGrey5Light = Color(0xFFE5E5EA)
|
||||
val SystemGrey5Dark = Color(0xFF2C2C2E)
|
||||
val SystemGrey6Light = Color(0xFFF2F2F7)
|
||||
val SystemGrey6Dark = Color(0xFF1C1C1E)
|
||||
|
||||
// For light themes
|
||||
val Gray_25 = Color(0xFFF4F6FA)
|
||||
val Gray_50 = Color(0xFFE3E8F0)
|
||||
val Gray_100 = Color(0xFFC1C6CD)
|
||||
val Gray_150 = Color(0xFF8D97A5)
|
||||
val Gray_200 = Color(0xFF737D8C)
|
||||
val Black_900 = Color(0xFF17191C)
|
||||
|
||||
// For dark themes
|
||||
val Gray_250 = Color(0xFFA9B2BC)
|
||||
val Gray_300 = Color(0xFF8E99A4)
|
||||
val Gray_400 = Color(0xFF6F7882)
|
||||
val Gray_450 = Color(0xFF394049)
|
||||
val Black_800 = Color(0xFF15191E)
|
||||
val Black_950 = Color(0xFF21262C)
|
||||
|
||||
val Azure = Color(0xFF368BD6)
|
||||
val Kiwi = Color(0xFF74D12C)
|
||||
val Grape = Color(0xFFAC3BA8)
|
||||
val Verde = Color(0xFF03B381)
|
||||
val Polly = Color(0xFFE64F7A)
|
||||
val Melon = Color(0xFFFF812D)
|
||||
|
||||
val ElementGreen = Color(0xFF0DBD8B)
|
||||
val ElementOrange = Color(0xFFD9B072)
|
||||
val Vermilion = Color(0xFFFF5B55)
|
||||
|
||||
val LinkColor = Color(0xFF0086E6)
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user