Sulkta-OSS/element-x-ada
3
0
Fork 0
Code Issues 1 Pull requests 10 Projects Releases Packages Wiki Activity Actions

ElementTheme + MaterialTheme3

Browse source
This commit is contained in:
Benoit Marty 2023-02-03 10:15:30 +01:00 • committed by Benoit Marty
parent 1f44550624
commit decd3a9585
52 changed files with 202 additions and 446 deletions
Download patch file Download diff file Expand all files Collapse all files

6
features/messages/src/main/kotlin/io/element/android/features/messages/actionlist/ActionListView.kt
View file

@ -32,6 +32,7 @@ import androidx.compose.material.LocalContentColor
import androidx.compose.material.ModalBottomSheetState
import androidx.compose.material.ModalBottomSheetValue
import androidx.compose.material.Text
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.rememberCoroutineScope
@ -42,7 +43,6 @@ import androidx.compose.ui.unit.dp
import io.element.android.features.messages.actionlist.model.TimelineItemAction
import io.element.android.features.messages.timeline.model.TimelineItem
import io.element.android.libraries.designsystem.components.VectorIcon
import io.element.android.libraries.designsystem.theme.ElementTheme
import io.element.android.libraries.designsystem.theme.components.ModalBottomSheetLayout
import kotlinx.coroutines.flow.filter
import kotlinx.coroutines.launch
@ -115,13 +115,13 @@ private fun SheetContent(
text = {
Text(
text = action.title,
color = if (action.destructive) ElementTheme.colors.error else Color.Unspecified,
color = if (action.destructive) MaterialTheme.colorScheme.error else Color.Unspecified,
)
},
icon = {
VectorIcon(
resourceId = action.icon,
tint = if (action.destructive) ElementTheme.colors.error else LocalContentColor.current,
tint = if (action.destructive) MaterialTheme.colorScheme.error else LocalContentColor.current,
)
}
)

9
features/messages/src/main/kotlin/io/element/android/features/messages/timeline/TimelineView.kt
View file

@ -39,6 +39,7 @@ import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDownward
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.derivedStateOf
@ -269,7 +270,7 @@ private fun MessageSenderInformation(
}
Text(
text = sender,
style = ElementTheme.typography.titleMedium,
style = MaterialTheme.typography.titleMedium,
modifier = Modifier
.alignBy(LastBaseline)
)
@ -328,8 +329,8 @@ internal fun BoxScope.TimelineScrollHelper(
modifier = Modifier
.align(Alignment.BottomCenter)
.size(40.dp),
containerColor = ElementTheme.colors.surfaceVariant,
contentColor = ElementTheme.colors.onSurfaceVariant
containerColor = MaterialTheme.colorScheme.surfaceVariant,
contentColor = MaterialTheme.colorScheme.onSurfaceVariant
) {
Icon(Icons.Default.ArrowDownward, "")
}
@ -347,7 +348,7 @@ internal fun TimelineLoadingMoreIndicator() {
) {
CircularProgressIndicator(
strokeWidth = 2.dp,
color = ElementTheme.colors.primary
color = MaterialTheme.colorScheme.primary
)
}
}

7
features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/TimelineItemImageView.kt
View file

@ -14,14 +14,12 @@
* limitations under the License.
*/
@file:OptIn(ExperimentalFoundationApi::class)
package io.element.android.features.messages.timeline.components
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.aspectRatio
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
@ -33,7 +31,6 @@ import androidx.compose.ui.platform.LocalContext
import coil.compose.AsyncImage
import coil.request.ImageRequest
import io.element.android.features.messages.timeline.model.content.TimelineItemImageContent
import io.element.android.libraries.designsystem.theme.ElementTheme
@Composable
fun TimelineItemImageView(
@ -60,7 +57,7 @@ fun TimelineItemImageView(
AsyncImage(
model = model,
contentDescription = null,
placeholder = ColorPainter(ElementTheme.colors.surfaceVariant),
placeholder = ColorPainter(MaterialTheme.colorScheme.surfaceVariant),
contentScale = ContentScale.Crop,
onSuccess = { isLoading.value = false },
)

6
features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/TimelineItemInformativeView.kt
View file

@ -22,6 +22,7 @@ import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Delete
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -32,7 +33,6 @@ import androidx.compose.ui.unit.dp
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.ElementTheme
import io.element.android.libraries.designsystem.theme.components.Icon
import io.element.android.libraries.designsystem.theme.components.Text
@ -49,14 +49,14 @@ fun TimelineItemInformativeView(
) {
Icon(
imageVector = icon,
tint = ElementTheme.colors.secondary,
tint = MaterialTheme.colorScheme.secondary,
contentDescription = iconDescription,
modifier = Modifier.size(16.dp)
)
Spacer(modifier = Modifier.width(4.dp))
Text(
fontStyle = FontStyle.Italic,
color = ElementTheme.colors.secondary,
color = MaterialTheme.colorScheme.secondary,
fontSize = 14.sp,
text = text
)

8
features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/TimelineItemReactionsView.kt
View file

@ -23,6 +23,7 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.CornerSize
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -31,7 +32,6 @@ import androidx.compose.ui.unit.sp
import com.google.accompanist.flowlayout.FlowRow
import io.element.android.features.messages.timeline.model.AggregatedReaction
import io.element.android.features.messages.timeline.model.TimelineItemReactions
import io.element.android.libraries.designsystem.theme.ElementTheme
import io.element.android.libraries.designsystem.theme.components.Surface
import io.element.android.libraries.designsystem.theme.components.Text
@ -56,8 +56,8 @@ fun TimelineItemReactionsView(
fun MessagesReactionButton(reaction: AggregatedReaction, modifier: Modifier = Modifier) {
Surface(
modifier = modifier,
color = ElementTheme.colors.surfaceVariant,
border = BorderStroke(2.dp, ElementTheme.colors.background),
color = MaterialTheme.colorScheme.surfaceVariant,
border = BorderStroke(2.dp, MaterialTheme.colorScheme.background),
shape = RoundedCornerShape(corner = CornerSize(12.dp)),
) {
Row(
@ -66,7 +66,7 @@ fun MessagesReactionButton(reaction: AggregatedReaction, modifier: Modifier = Mo
) {
Text(text = reaction.key, fontSize = 12.sp)
Spacer(modifier = Modifier.width(4.dp))
Text(text = reaction.count, color = ElementTheme.colors.secondary, fontSize = 12.sp)
Text(text = reaction.count, color = MaterialTheme.colorScheme.secondary, fontSize = 12.sp)
}
}
}

38
features/messages/src/main/kotlin/io/element/android/features/messages/timeline/components/html/HtmlDocument.kt
View file

@ -25,7 +25,9 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.InlineTextContent
import androidx.compose.foundation.text.appendInlineContent
import androidx.compose.material3.ColorScheme
import androidx.compose.material3.LocalTextStyle
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.drawBehind
@ -45,8 +47,6 @@ import androidx.compose.ui.unit.sp
import com.google.accompanist.flowlayout.FlowRow
import io.element.android.libraries.designsystem.LinkColor
import io.element.android.libraries.designsystem.components.ClickableLinkText
import io.element.android.libraries.designsystem.theme.ElementColors
import io.element.android.libraries.designsystem.theme.ElementTheme
import io.element.android.libraries.designsystem.theme.components.Surface
import io.element.android.libraries.designsystem.theme.components.Text
import io.element.android.libraries.matrix.permalink.PermalinkData
@ -214,7 +214,7 @@ private fun HtmlInline(
) {
Box(modifier) {
val styledText = buildAnnotatedString {
appendInlineElement(element, ElementTheme.colors)
appendInlineElement(element, MaterialTheme.colorScheme)
}
HtmlText(
text = styledText,
@ -232,7 +232,7 @@ private fun HtmlPreformatted(
) {
val isCode = pre.firstElementChild()?.normalName() == "code"
val backgroundColor =
if (isCode) ElementTheme.colors.codeBackground() else Color.Unspecified
if (isCode) MaterialTheme.colorScheme.codeBackground() else Color.Unspecified
Box(
modifier
.background(color = backgroundColor)
@ -255,7 +255,7 @@ private fun HtmlParagraph(
) {
Box(modifier) {
val styledText = buildAnnotatedString {
appendInlineChildrenElements(paragraph.childNodes(), ElementTheme.colors)
appendInlineChildrenElements(paragraph.childNodes(), MaterialTheme.colorScheme)
}
HtmlText(
text = styledText, onClick = onTextClicked,
@ -272,7 +272,7 @@ private fun HtmlBlockquote(
onTextClicked: () -> Unit = {},
onTextLongClicked: () -> Unit = {},
) {
val color = ElementTheme.colors.onBackground
val color = MaterialTheme.colorScheme.onBackground
Box(
modifier = modifier
.drawBehind {
@ -287,7 +287,7 @@ private fun HtmlBlockquote(
) {
val text = buildAnnotatedString {
withStyle(style = SpanStyle(fontStyle = FontStyle.Italic)) {
appendInlineChildrenElements(blockquote.childNodes(), ElementTheme.colors)
appendInlineChildrenElements(blockquote.childNodes(), MaterialTheme.colorScheme)
}
}
HtmlText(
@ -306,19 +306,19 @@ private fun HtmlHeading(
onTextLongClicked: () -> Unit = {},
) {
val style = when (heading.normalName()) {
"h1" -> ElementTheme.typography.headlineLarge.copy(fontSize = 30.sp)
"h2" -> ElementTheme.typography.headlineLarge.copy(fontSize = 26.sp)
"h3" -> ElementTheme.typography.headlineMedium.copy(fontSize = 22.sp)
"h4" -> ElementTheme.typography.headlineMedium.copy(fontSize = 18.sp)
"h5" -> ElementTheme.typography.headlineSmall.copy(fontSize = 14.sp)
"h6" -> ElementTheme.typography.headlineSmall.copy(fontSize = 12.sp)
"h1" -> MaterialTheme.typography.headlineLarge.copy(fontSize = 30.sp)
"h2" -> MaterialTheme.typography.headlineLarge.copy(fontSize = 26.sp)
"h3" -> MaterialTheme.typography.headlineMedium.copy(fontSize = 22.sp)
"h4" -> MaterialTheme.typography.headlineMedium.copy(fontSize = 18.sp)
"h5" -> MaterialTheme.typography.headlineSmall.copy(fontSize = 14.sp)
"h6" -> MaterialTheme.typography.headlineSmall.copy(fontSize = 12.sp)
else -> {
return
}
}
Box(modifier) {
val text = buildAnnotatedString {
appendInlineChildrenElements(heading.childNodes(), ElementTheme.colors)
appendInlineChildrenElements(heading.childNodes(), MaterialTheme.colorScheme)
}
HtmlText(
text = text,
@ -344,7 +344,7 @@ private fun HtmlMxReply(
modifier = modifier
.padding(bottom = 4.dp)
.offset(x = -(8.dp)),
color = ElementTheme.colors.background,
color = MaterialTheme.colorScheme.background,
shape = shape,
) {
val text = buildAnnotatedString {
@ -354,7 +354,7 @@ private fun HtmlMxReply(
withStyle(
style = SpanStyle(
fontSize = 12.sp,
color = ElementTheme.colors.secondary
color = MaterialTheme.colorScheme.secondary
)
) {
append(blockquoteNode.text())
@ -462,13 +462,13 @@ private fun HtmlListItems(
}
}
private fun ElementColors.codeBackground(): Color {
private fun ColorScheme.codeBackground(): Color {
return background.copy(alpha = 0.3f)
}
private fun AnnotatedString.Builder.appendInlineChildrenElements(
childNodes: List<Node>,
colors: ElementColors
colors: ColorScheme
) {
for (node in childNodes) {
when (node) {
@ -482,7 +482,7 @@ private fun AnnotatedString.Builder.appendInlineChildrenElements(
}
}
private fun AnnotatedString.Builder.appendInlineElement(element: Element, colors: ElementColors) {
private fun AnnotatedString.Builder.appendInlineElement(element: Element, colors: ColorScheme) {
when (element.normalName()) {
"br" -> {
append('\n')