diff --git a/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/AddRemoveButtons.kt b/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/AddRemoveButtons.kt index 02bc66459..6618f95ad 100644 --- a/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/AddRemoveButtons.kt +++ b/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/AddRemoveButtons.kt @@ -35,12 +35,12 @@ import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.vitorpamplona.amethyst.R import com.vitorpamplona.amethyst.ui.theme.ButtonBorder -import com.vitorpamplona.amethyst.ui.theme.ThemeComparison +import com.vitorpamplona.amethyst.ui.theme.ThemeComparisonColumn @Composable @Preview fun AddButtonPreview() { - ThemeComparison( + ThemeComparisonColumn( onDark = { Row { Column { diff --git a/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/DisplayPoW.kt b/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/DisplayPoW.kt index db6f0b1e8..5705eb2e7 100644 --- a/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/DisplayPoW.kt +++ b/app/src/main/java/com/vitorpamplona/amethyst/ui/elements/DisplayPoW.kt @@ -27,13 +27,13 @@ import androidx.compose.runtime.remember import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.tooling.preview.Preview import com.vitorpamplona.amethyst.ui.theme.Font14SP -import com.vitorpamplona.amethyst.ui.theme.ThemeComparison +import com.vitorpamplona.amethyst.ui.theme.ThemeComparisonColumn import com.vitorpamplona.amethyst.ui.theme.lessImportantLink @Composable @Preview fun DisplayPoWPreview() { - ThemeComparison( + ThemeComparisonColumn( onDark = { DisplayPoW(pow = 24) }, onLight = { DisplayPoW(pow = 24) }, ) diff --git a/app/src/main/java/com/vitorpamplona/amethyst/ui/layouts/LeftPictureLayout.kt b/app/src/main/java/com/vitorpamplona/amethyst/ui/layouts/LeftPictureLayout.kt index 94f3a89a9..31477f48c 100644 --- a/app/src/main/java/com/vitorpamplona/amethyst/ui/layouts/LeftPictureLayout.kt +++ b/app/src/main/java/com/vitorpamplona/amethyst/ui/layouts/LeftPictureLayout.kt @@ -51,13 +51,13 @@ import com.vitorpamplona.amethyst.ui.theme.QuoteBorder import com.vitorpamplona.amethyst.ui.theme.Size16Modifier import com.vitorpamplona.amethyst.ui.theme.Size20Modifier import com.vitorpamplona.amethyst.ui.theme.StdHorzSpacer -import com.vitorpamplona.amethyst.ui.theme.ThemeComparison +import com.vitorpamplona.amethyst.ui.theme.ThemeComparisonColumn import com.vitorpamplona.amethyst.ui.theme.placeholderText @Composable @Preview fun LeftPictureLayoutPreview() { - ThemeComparison( + ThemeComparisonColumn( onDark = { LeftPictureLayoutPreviewCard() }, onLight = { LeftPictureLayoutPreviewCard() }, ) diff --git a/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/LoginScreen.kt b/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/LoginScreen.kt index e2841be9b..e4ce9040e 100644 --- a/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/LoginScreen.kt +++ b/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/LoginScreen.kt @@ -96,6 +96,7 @@ import com.vitorpamplona.amethyst.ui.screen.loggedIn.ConnectOrbotDialog import com.vitorpamplona.amethyst.ui.theme.Size20dp import com.vitorpamplona.amethyst.ui.theme.Size35dp import com.vitorpamplona.amethyst.ui.theme.Size40dp +import com.vitorpamplona.amethyst.ui.theme.ThemeComparisonRow import com.vitorpamplona.amethyst.ui.theme.placeholderText import com.vitorpamplona.quartz.signers.ExternalSignerLauncher import com.vitorpamplona.quartz.signers.SignerType @@ -103,13 +104,19 @@ import kotlinx.coroutines.Dispatchers import kotlinx.coroutines.launch import java.util.UUID -@Preview +@Preview(device = "spec:width=2160px,height=2340px,dpi=440") @Composable fun LoginPage() { val accountViewModel: AccountStateViewModel = viewModel() - LoginPage(accountViewModel, true) { - } + ThemeComparisonRow( + onDark = { + LoginPage(accountViewModel, true) {} + }, + onLight = { + LoginPage(accountViewModel, true) {} + }, + ) } @OptIn(ExperimentalComposeUiApi::class) diff --git a/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/SignUpScreen.kt b/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/SignUpScreen.kt index 34d2216eb..e34a0c7bf 100644 --- a/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/SignUpScreen.kt +++ b/app/src/main/java/com/vitorpamplona/amethyst/ui/screen/loggedOff/SignUpScreen.kt @@ -72,16 +72,23 @@ import com.vitorpamplona.amethyst.ui.theme.Size10dp import com.vitorpamplona.amethyst.ui.theme.Size20dp import com.vitorpamplona.amethyst.ui.theme.Size35dp import com.vitorpamplona.amethyst.ui.theme.Size40dp +import com.vitorpamplona.amethyst.ui.theme.ThemeComparisonRow import com.vitorpamplona.amethyst.ui.theme.placeholderText import kotlinx.coroutines.launch -@Preview +@Preview(device = "spec:width=2160px,height=2340px,dpi=440") @Composable fun SignUpPage() { val accountViewModel: AccountStateViewModel = viewModel() - SignUpPage(accountViewModel) { - } + ThemeComparisonRow( + onDark = { + SignUpPage(accountViewModel) {} + }, + onLight = { + SignUpPage(accountViewModel) {} + }, + ) } @Composable diff --git a/app/src/main/java/com/vitorpamplona/amethyst/ui/theme/Theme.kt b/app/src/main/java/com/vitorpamplona/amethyst/ui/theme/Theme.kt index 8b2d21198..288893215 100644 --- a/app/src/main/java/com/vitorpamplona/amethyst/ui/theme/Theme.kt +++ b/app/src/main/java/com/vitorpamplona/amethyst/ui/theme/Theme.kt @@ -24,7 +24,9 @@ import android.app.Activity import androidx.compose.foundation.background import androidx.compose.foundation.border import androidx.compose.foundation.isSystemInDarkTheme +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size @@ -128,62 +130,92 @@ val RepostPictureBorderDark = Modifier.border(2.dp, DarkColorPalette.background, val RepostPictureBorderLight = Modifier.border(2.dp, LightColorPalette.background, CircleShape) val DarkImageModifier = - Modifier.fillMaxWidth().clip(shape = QuoteBorder).border(1.dp, DarkSubtleBorder, QuoteBorder) + Modifier + .fillMaxWidth() + .clip(shape = QuoteBorder) + .border(1.dp, DarkSubtleBorder, QuoteBorder) val LightImageModifier = - Modifier.fillMaxWidth().clip(shape = QuoteBorder).border(1.dp, LightSubtleBorder, QuoteBorder) + Modifier + .fillMaxWidth() + .clip(shape = QuoteBorder) + .border(1.dp, LightSubtleBorder, QuoteBorder) -val DarkProfile35dpModifier = Modifier.size(Size35dp).clip(shape = CircleShape) +val DarkProfile35dpModifier = + Modifier + .size(Size35dp) + .clip(shape = CircleShape) -val LightProfile35dpModifier = Modifier.fillMaxWidth().clip(shape = CircleShape) +val LightProfile35dpModifier = + Modifier + .fillMaxWidth() + .clip(shape = CircleShape) val DarkReplyBorderModifier = - Modifier.padding(top = 5.dp) + Modifier + .padding(top = 5.dp) .fillMaxWidth() .clip(shape = QuoteBorder) .border(1.dp, DarkSubtleBorder, QuoteBorder) val LightReplyBorderModifier = - Modifier.padding(top = 2.dp, bottom = 0.dp, start = 0.dp, end = 0.dp) + Modifier + .padding(top = 2.dp, bottom = 0.dp, start = 0.dp, end = 0.dp) .fillMaxWidth() .clip(shape = QuoteBorder) .border(1.dp, LightSubtleBorder, QuoteBorder) val DarkInnerPostBorderModifier = - Modifier.padding(top = 5.dp) + Modifier + .padding(top = 5.dp) .fillMaxWidth() .clip(shape = QuoteBorder) .border(1.dp, DarkSubtleBorder, QuoteBorder) val LightInnerPostBorderModifier = - Modifier.padding(top = 5.dp) + Modifier + .padding(top = 5.dp) .fillMaxWidth() .clip(shape = QuoteBorder) .border(1.dp, LightSubtleBorder, QuoteBorder) val DarkChannelNotePictureModifier = - Modifier.size(30.dp) + Modifier + .size(30.dp) .clip(shape = CircleShape) .background(DarkColorPalette.background) .border(2.dp, DarkColorPalette.background, CircleShape) val LightChannelNotePictureModifier = - Modifier.size(30.dp) + Modifier + .size(30.dp) .clip(shape = CircleShape) .background(LightColorPalette.background) .border(2.dp, LightColorPalette.background, CircleShape) val LightRelayIconModifier = - Modifier.size(Size13dp).clip(shape = CircleShape).background(LightColorPalette.background) + Modifier + .size(Size13dp) + .clip(shape = CircleShape) + .background(LightColorPalette.background) val DarkRelayIconModifier = - Modifier.size(Size13dp).clip(shape = CircleShape).background(DarkColorPalette.background) + Modifier + .size(Size13dp) + .clip(shape = CircleShape) + .background(DarkColorPalette.background) val LightLargeRelayIconModifier = - Modifier.size(Size55dp).clip(shape = CircleShape).background(LightColorPalette.background) + Modifier + .size(Size55dp) + .clip(shape = CircleShape) + .background(LightColorPalette.background) val DarkLargeRelayIconModifier = - Modifier.size(Size55dp).clip(shape = CircleShape).background(DarkColorPalette.background) + Modifier + .size(Size55dp) + .clip(shape = CircleShape) + .background(DarkColorPalette.background) val RichTextDefaults = RichTextStyle().resolveDefaults() @@ -203,7 +235,8 @@ val MarkDownStyleOnDark = fontSize = Font14SP, ), modifier = - Modifier.padding(0.dp) + Modifier + .padding(0.dp) .fillMaxWidth() .clip(shape = QuoteBorder) .border(1.dp, DarkSubtleBorder, QuoteBorder) @@ -240,7 +273,8 @@ val MarkDownStyleOnLight = fontSize = Font14SP, ), modifier = - Modifier.padding(0.dp) + Modifier + .padding(0.dp) .fillMaxWidth() .clip(shape = QuoteBorder) .border(1.dp, LightSubtleBorder, QuoteBorder) @@ -402,19 +436,49 @@ fun AmethystTheme( } @Composable -fun ThemeComparison( +fun ThemeComparisonColumn( onDark: @Composable () -> Unit, onLight: @Composable () -> Unit, ) { Column { - val darkTheme: SharedPreferencesViewModel = viewModel() - darkTheme.updateTheme(ThemeType.DARK) - AmethystTheme(darkTheme) { Surface(color = MaterialTheme.colorScheme.background) { onDark() } } - - val lightTheme: SharedPreferencesViewModel = viewModel() - lightTheme.updateTheme(ThemeType.LIGHT) - AmethystTheme(lightTheme) { - Surface(color = MaterialTheme.colorScheme.background) { onLight() } + Box { + val darkTheme: SharedPreferencesViewModel = viewModel() + darkTheme.updateTheme(ThemeType.DARK) + AmethystTheme(darkTheme) { + Surface(color = MaterialTheme.colorScheme.background) { onDark() } + } + } + + Box { + val lightTheme: SharedPreferencesViewModel = viewModel() + lightTheme.updateTheme(ThemeType.LIGHT) + AmethystTheme(lightTheme) { + Surface(color = MaterialTheme.colorScheme.background) { onLight() } + } + } + } +} + +@Composable +fun ThemeComparisonRow( + onDark: @Composable () -> Unit, + onLight: @Composable () -> Unit, +) { + Row { + Box(modifier = Modifier.weight(1f)) { + val darkTheme: SharedPreferencesViewModel = viewModel() + darkTheme.updateTheme(ThemeType.DARK) + AmethystTheme(darkTheme) { + Surface(color = MaterialTheme.colorScheme.background) { onDark() } + } + } + + Box(modifier = Modifier.weight(1f)) { + val lightTheme: SharedPreferencesViewModel = viewModel() + lightTheme.updateTheme(ThemeType.LIGHT) + AmethystTheme(lightTheme) { + Surface(color = MaterialTheme.colorScheme.background) { onLight() } + } } } }