refactor: layout and spacing adjustments

This commit is contained in:
Diego Beraldin 2023-09-05 18:53:18 +02:00
parent b371950d7b
commit 056aae12ee
23 changed files with 60 additions and 21 deletions

View File

@ -67,25 +67,25 @@ val md_theme_dark_scrim = Color(0xFF000000)
val md_theme_black_primary = Color(0xFFCBBEFF)
val md_theme_black_onPrimary = Color(0xFF330098)
val md_theme_black_primaryContainer = Color(0xFF000000)
val md_theme_black_onPrimaryContainer = Color(0xFFE6DEFF)
val md_theme_black_onPrimaryContainer = Color(0xFFFFFFFF)
val md_theme_black_secondary = Color(0xFF5BD5FC)
val md_theme_black_onSecondary = Color(0xFF003543)
val md_theme_black_secondaryContainer = Color(0xFF000000)
val md_theme_black_onSecondaryContainer = Color(0xFFB7EAFF)
val md_theme_black_onSecondaryContainer = Color(0xFFFFFFFF)
val md_theme_black_tertiary = Color(0xFFBAC3FF)
val md_theme_black_onTertiary = Color(0xFF00218D)
val md_theme_black_tertiaryContainer = Color(0xFF000000)
val md_theme_black_onTertiaryContainer = Color(0xFFDEE1FF)
val md_theme_black_onTertiaryContainer = Color(0xFFFFFFFF)
val md_theme_black_error = Color(0xFFFFB4AB)
val md_theme_black_errorContainer = Color(0xFF000000)
val md_theme_black_onError = Color(0xFF690005)
val md_theme_black_onErrorContainer = Color(0xFFFFDAD6)
val md_theme_black_onErrorContainer = Color(0xFFFFFFFF)
val md_theme_black_background = Color(0xFF000000)
val md_theme_black_onBackground = Color(0xFFA6EEFF)
val md_theme_black_onBackground = Color(0xFFFFFFFF)
val md_theme_black_surface = Color(0xFF000000)
val md_theme_black_onSurface = Color(0xFFA6EEFF)
val md_theme_black_onSurface = Color(0xFFFFFFFF)
val md_theme_black_surfaceVariant = Color(0xFF000000)
val md_theme_black_onSurfaceVariant = Color(0xFFC9C4D0)
val md_theme_black_onSurfaceVariant = Color(0xFFFFFFFF)
val md_theme_black_outline = Color(0xFF938F99)
val md_theme_black_inverseOnSurface = Color(0xFF001F25)
val md_theme_black_inverseSurface = Color(0xFFA6EEFF)

View File

@ -258,7 +258,7 @@ class CommunityDetailScreen(
Column(
modifier = Modifier.graphicsLayer(translationY = -(iconSize / 2).toLocalPixel()),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
) {
if (communityIcon.isNotEmpty()) {
val painterResource =

View File

@ -80,6 +80,7 @@ fun CommunityItem(
}
},
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}

View File

@ -51,7 +51,7 @@ fun InboxMentionCard(
},
) {
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
) {
InboxReplyHeader(
mention = mention,

View File

@ -31,5 +31,6 @@ fun InboxReplyHeader(mention: PersonMentionModel) {
modifier = Modifier.padding(vertical = Spacing.xs),
text = header,
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onBackground,
)
}

View File

@ -99,6 +99,7 @@ fun InboxReplySubtitle(
}
},
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}

View File

@ -60,7 +60,7 @@ fun PostCard(
),
) {
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
) {
PostCardTitle(post)
PostCardSubtitle(

View File

@ -1,8 +1,10 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.Markdown
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.model.markdownColor
@Composable
fun PostCardBody(
@ -13,6 +15,10 @@ fun PostCardBody(
Markdown(
modifier = modifier,
content = text,
colors = markdownColor(
text = MaterialTheme.colorScheme.onSurfaceVariant,
backgroundCode = MaterialTheme.colorScheme.surfaceVariant,
)
)
}
}

View File

@ -60,7 +60,8 @@ fun PostCardFooter(
Text(
modifier = Modifier.padding(end = Spacing.s),
text = "$comments",
style = MaterialTheme.typography.labelSmall,
style = MaterialTheme.typography.labelLarge,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
if (date != null) {
@ -99,7 +100,8 @@ fun PostCardFooter(
}
}
},
style = MaterialTheme.typography.labelSmall,
style = MaterialTheme.typography.labelLarge,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
Spacer(modifier = Modifier.weight(1f))
@ -151,7 +153,8 @@ fun PostCardFooter(
)
Text(
text = "$score",
style = MaterialTheme.typography.labelSmall,
style = MaterialTheme.typography.labelLarge,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
Image(
modifier = buttonModifier

View File

@ -77,6 +77,7 @@ fun PostCardSubtitle(
}
},
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}
@ -86,6 +87,7 @@ fun PostCardSubtitle(
Text(
text = "",
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
Surface(
@ -122,6 +124,7 @@ fun PostCardSubtitle(
}
},
style = MaterialTheme.typography.bodySmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}

View File

@ -10,5 +10,6 @@ fun PostCardTitle(post: PostModel) {
Text(
text = post.title,
style = MaterialTheme.typography.titleMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}

View File

@ -43,10 +43,12 @@ fun UserCounters(
thousandLabel = stringResource(MR.strings.profile_thousand_short),
),
style = MaterialTheme.typography.headlineSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
Text(
text = stringResource(MR.strings.profile_post_score),
style = MaterialTheme.typography.titleSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
Box(
@ -65,10 +67,12 @@ fun UserCounters(
thousandLabel = stringResource(MR.strings.profile_thousand_short),
),
style = MaterialTheme.typography.headlineSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
Text(
text = stringResource(MR.strings.profile_comment_score),
style = MaterialTheme.typography.titleSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
Box(
@ -111,10 +115,12 @@ fun UserCounters(
}
},
style = MaterialTheme.typography.headlineSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
Text(
text = stringResource(MR.strings.profile_account_age),
style = MaterialTheme.typography.titleSmall,
color = MaterialTheme.colorScheme.onSurfaceVariant,
)
}
}

View File

@ -54,7 +54,7 @@ fun UserHeader(
Column(
modifier = Modifier.graphicsLayer(translationY = -(iconSize / 2).toLocalPixel()),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
) {
if (userAvatar.isNotEmpty()) {
val painterResource =

View File

@ -35,7 +35,7 @@ fun CommentCard(
),
) {
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.s),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
) {
PostCardSubtitle(
creator = comment.creator,

View File

@ -30,6 +30,7 @@ private fun MarkdownCode(
code,
modifier = Modifier.horizontalScroll(rememberScrollState()).padding(8.dp),
style = style,
color = LocalMarkdownColors.current.text,
)
}
}

View File

@ -7,6 +7,7 @@ import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalMarkdownColors
import org.intellij.markdown.MarkdownTokenTypes
import org.intellij.markdown.ast.ASTNode
import org.intellij.markdown.ast.findChildOfType
@ -23,6 +24,7 @@ internal fun MarkdownHeader(
it.getTextInNode(content).trim().toString(),
modifier = Modifier.fillMaxWidth().padding(top = 16.dp),
style = style,
color = LocalMarkdownColors.current.text,
)
}
}

View File

@ -11,6 +11,7 @@ import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.unit.dp
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalBulletListHandler
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalMarkdownColors
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalMarkdownPadding
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalMarkdownTypography
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalOrderedListHandler
@ -73,6 +74,7 @@ internal fun MarkdownOrderedList(
child.findChildOfType(MarkdownTokenTypes.LIST_NUMBER)?.getTextInNode(content),
),
style = style,
color = LocalMarkdownColors.current.text,
)
val text = buildAnnotatedString {
pushStyle(style.toSpanStyle())
@ -99,6 +101,7 @@ internal fun MarkdownBulletList(
child.findChildOfType(MarkdownTokenTypes.LIST_BULLET)?.getTextInNode(content),
),
style = style,
color = LocalMarkdownColors.current.text,
)
val text = buildAnnotatedString {
pushStyle(style.toSpanStyle())

View File

@ -17,6 +17,7 @@ import androidx.compose.ui.text.PlaceholderVerticalAlign
import androidx.compose.ui.text.TextLayoutResult
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.sp
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalMarkdownColors
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalMarkdownTypography
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.compose.LocalReferenceLinkHandler
import com.github.diegoberaldin.raccoonforlemmy.core.markdown.utils.TAG_IMAGE_URL
@ -80,6 +81,7 @@ internal fun MarkdownText(
)
},
),
color = LocalMarkdownColors.current.text,
onTextLayout = { layoutResult.value = it },
)
}

View File

@ -50,11 +50,12 @@ internal fun PostsTopBar(
colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.onBackground),
)
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
) {
Text(
text = listingType.toReadableName(),
style = MaterialTheme.typography.titleMedium,
color = MaterialTheme.colorScheme.onBackground,
)
Text(
text = stringResource(
@ -62,6 +63,7 @@ internal fun PostsTopBar(
currentInstance,
),
style = MaterialTheme.typography.titleSmall,
color = MaterialTheme.colorScheme.onBackground,
)
}
}

View File

@ -58,7 +58,7 @@ class InboxScreen : Screen {
TopAppBar(
title = {
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
) {
Text(
text = title,
@ -108,6 +108,7 @@ class InboxScreen : Screen {
verticalArrangement = Arrangement.spacedBy(Spacing.s),
) {
SectionSelector(
modifier = Modifier.padding(vertical = Spacing.s),
titles = listOf(
stringResource(MR.strings.inbox_section_replies),
stringResource(MR.strings.inbox_section_mentions),

View File

@ -110,7 +110,7 @@ class LoginBottomSheet(
Column(
modifier = Modifier.padding(it).fillMaxWidth()
.verticalScroll(rememberScrollState()),
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
horizontalAlignment = Alignment.CenterHorizontally,
) {
val instanceFocusRequester = remember { FocusRequester() }

View File

@ -21,7 +21,6 @@ import androidx.compose.material.icons.filled.Search
import androidx.compose.material.pullrefresh.PullRefreshIndicator
import androidx.compose.material.pullrefresh.pullRefresh
import androidx.compose.material.pullrefresh.rememberPullRefreshState
import androidx.compose.material3.Button
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
@ -101,7 +100,7 @@ class CommunityListScreen : Screen {
colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.onBackground),
)
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
) {
Text(
text = stringResource(MR.strings.instance_detail_communities),
@ -118,7 +117,7 @@ class CommunityListScreen : Screen {
) { padding ->
Column(
modifier = Modifier.padding(padding),
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
) {
TextField(
modifier = Modifier.padding(
@ -199,6 +198,10 @@ class CommunityListScreen : Screen {
}
}
}
item {
Spacer(modifier = Modifier.height(Spacing.xxl))
}
}
PullRefreshIndicator(

View File

@ -29,11 +29,13 @@ internal fun SettingsRow(
Text(
text = title,
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onBackground,
)
Spacer(modifier = Modifier.weight(1f))
Text(
text = value,
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onBackground,
)
}
}
@ -50,6 +52,7 @@ internal fun SettingsSwitchRow(
Text(
text = title,
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onBackground,
)
Spacer(modifier = Modifier.weight(1f))
Switch(