null
/
Closer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(theme): replace hardcoded colors with Material3 theme-aware composables + adaptive iOS surface color

This commit is contained in:
null 2026-06-23 12:31:59 -05:00
parent e5c13b6b6d
commit 424ef0e4ab
16 changed files with 123 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/src/main/java/app/closer/ui/answers/AnswerHistoryScreen.kt
View File

@ -2,6 +2,9 @@ package app.closer.ui.answers
import app.closer.R import app.closer.R
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerSoftPurpleColor
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
@ -274,14 +277,14 @@ private fun HistoryFilterPill(
.heightIn(min = 44.dp) .heightIn(min = 44.dp)
.clickable(onClick = onClick), .clickable(onClick = onClick),
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = if (selected) CloserPalette.PurpleMist else Color.White.copy(alpha = 0.74f), color = if (selected) closerSoftPurpleColor() else closerSoftSurfaceColor(alpha = 0.74f),
shadowElevation = if (selected) 2.dp else 0.dp shadowElevation = if (selected) 2.dp else 0.dp
) { ) {
Text( Text(
text = "$label $count", text = "$label $count",
modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp), modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = if (selected) CloserPalette.PurpleDeep else MaterialTheme.colorScheme.onSurfaceVariant, color = if (selected) MaterialTheme.colorScheme.onPrimaryContainer else MaterialTheme.colorScheme.onSurfaceVariant,
fontWeight = if (selected) FontWeight.SemiBold else FontWeight.Medium, fontWeight = if (selected) FontWeight.SemiBold else FontWeight.Medium,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
@ -301,7 +304,7 @@ private fun AnswerHistoryCard(
onClick = onClick, onClick = onClick,
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(24.dp), shape = RoundedCornerShape(24.dp),
colors = CardDefaults.cardColors(containerColor = Color.White), colors = CardDefaults.cardColors(containerColor = closerCardColor(alpha = 0.94f)),
elevation = CardDefaults.cardElevation(defaultElevation = 6.dp) elevation = CardDefaults.cardElevation(defaultElevation = 6.dp)
) { ) {
Row( Row(
@ -348,7 +351,7 @@ private fun AnswerHistoryCard(
Text( Text(
text = if (answer.isRevealed) "Opened" else "Private", text = if (answer.isRevealed) "Opened" else "Private",
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
fontWeight = FontWeight.SemiBold fontWeight = FontWeight.SemiBold
) )
TextButton( TextButton(
@ -368,8 +371,8 @@ private fun AnswerHistoryCard(
@Composable @Composable
private fun HistoryStateBadge(isRevealed: Boolean) { private fun HistoryStateBadge(isRevealed: Boolean) {
val tint = if (isRevealed) CloserPalette.PurpleDeep else CloserPalette.Evergreen val tint = if (isRevealed) MaterialTheme.colorScheme.onPrimaryContainer else CloserPalette.Evergreen
val container = if (isRevealed) CloserPalette.PurpleMist else CloserPalette.Evergreen.copy(alpha = 0.10f) val container = if (isRevealed) closerSoftPurpleColor() else CloserPalette.Evergreen.copy(alpha = 0.10f)
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = container color = container
@ -399,7 +402,7 @@ private fun HistoryStateBadge(isRevealed: Boolean) {
private fun HistoryPill(label: String) { private fun HistoryPill(label: String) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFFFF8FC) color = closerSoftSurfaceColor()
) { ) {
Text( Text(
text = label, text = label,

36
app/src/main/java/app/closer/ui/answers/AnswerRevealScreen.kt
View File

@ -1,6 +1,10 @@
package app.closer.ui.answers package app.closer.ui.answers
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerSoftPinkColor
import app.closer.ui.theme.closerSoftPurpleColor
import app.closer.ui.theme.closerSoftSurfaceColor
import android.provider.Settings import android.provider.Settings
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.core.tween import androidx.compose.animation.core.tween
@ -655,7 +659,7 @@ private fun TinyActionCard(
Card( Card(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(28.dp), shape = RoundedCornerShape(28.dp),
colors = CardDefaults.cardColors(containerColor = Color(0xFFFFF0F8)), colors = CardDefaults.cardColors(containerColor = closerSoftPinkColor(alpha = 0.84f)),
elevation = CardDefaults.cardElevation(defaultElevation = 4.dp) elevation = CardDefaults.cardElevation(defaultElevation = 4.dp)
) { ) {
Column( Column(
@ -667,7 +671,7 @@ private fun TinyActionCard(
Text( Text(
text = mode.actionCopy, text = mode.actionCopy,
style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.SemiBold), style = MaterialTheme.typography.bodyMedium.copy(fontWeight = FontWeight.SemiBold),
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onSecondaryContainer,
maxLines = 3, maxLines = 3,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )
@ -698,7 +702,7 @@ private fun FollowUpSection(
Card( Card(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(28.dp), shape = RoundedCornerShape(28.dp),
colors = CardDefaults.cardColors(containerColor = Color(0xFFFFF8FC)), colors = CardDefaults.cardColors(containerColor = closerCardColor(alpha = 0.94f)),
elevation = CardDefaults.cardElevation(defaultElevation = 6.dp) elevation = CardDefaults.cardElevation(defaultElevation = 6.dp)
) { ) {
Column( Column(
@ -710,7 +714,7 @@ private fun FollowUpSection(
Text( Text(
text = "Want to keep the conversation going?", text = "Want to keep the conversation going?",
style = MaterialTheme.typography.titleMedium, style = MaterialTheme.typography.titleMedium,
color = Color(0xFF24122F), color = MaterialTheme.colorScheme.onSurface,
fontWeight = FontWeight.SemiBold, fontWeight = FontWeight.SemiBold,
maxLines = 2, maxLines = 2,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
@ -743,7 +747,7 @@ private fun FollowUpChip(
.heightIn(min = 52.dp) .heightIn(min = 52.dp)
.clickable(onClick = onClick), .clickable(onClick = onClick),
shape = RoundedCornerShape(18.dp), shape = RoundedCornerShape(18.dp),
color = Color.White color = closerSoftSurfaceColor()
) { ) {
Row( Row(
modifier = Modifier modifier = Modifier
@ -755,7 +759,7 @@ private fun FollowUpChip(
Text( Text(
text = label, text = label,
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
fontWeight = FontWeight.SemiBold, fontWeight = FontWeight.SemiBold,
maxLines = 2, maxLines = 2,
overflow = TextOverflow.Ellipsis, overflow = TextOverflow.Ellipsis,
@ -776,7 +780,7 @@ private fun RevealMessageCard(content: @Composable () -> Unit) {
Card( Card(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(28.dp), shape = RoundedCornerShape(28.dp),
colors = CardDefaults.cardColors(containerColor = Color.White), colors = CardDefaults.cardColors(containerColor = closerCardColor(alpha = 0.94f)),
elevation = CardDefaults.cardElevation(defaultElevation = 10.dp) elevation = CardDefaults.cardElevation(defaultElevation = 10.dp)
) { ) {
Box(modifier = Modifier.padding(20.dp)) { Box(modifier = Modifier.padding(20.dp)) {
@ -813,7 +817,7 @@ private fun AnswerPreview(
Surface( Surface(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(20.dp), shape = RoundedCornerShape(20.dp),
color = if (revealed) Color(0xFFF4E8FF) else Color(0xFFFFF8FC) color = if (revealed) closerSoftPurpleColor() else closerSoftSurfaceColor()
) { ) {
Column( Column(
modifier = Modifier.padding(16.dp), modifier = Modifier.padding(16.dp),
@ -822,13 +826,13 @@ private fun AnswerPreview(
Text( Text(
text = if (revealed) "Opened answer" else "Private preview", text = if (revealed) "Opened answer" else "Private preview",
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
fontWeight = FontWeight.SemiBold fontWeight = FontWeight.SemiBold
) )
Text( Text(
text = if (revealed) answer.revealSummary() else answer.privatePreview(), text = if (revealed) answer.revealSummary() else answer.privatePreview(),
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
color = Color(0xFF3E3346), color = MaterialTheme.colorScheme.onSurface,
maxLines = 6, maxLines = 6,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )
@ -840,7 +844,7 @@ private fun AnswerPreview(
private fun RevealPill(label: String) { private fun RevealPill(label: String) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFFFF8FC), color = closerSoftSurfaceColor(),
modifier = Modifier.heightIn(min = 32.dp) modifier = Modifier.heightIn(min = 32.dp)
) { ) {
Text( Text(
@ -868,7 +872,7 @@ private fun PartnerAnswerPreview(answer: LocalAnswer) {
Surface( Surface(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(20.dp), shape = RoundedCornerShape(20.dp),
color = Color(0xFFE8F4FF) color = MaterialTheme.colorScheme.tertiaryContainer.copy(alpha = 0.78f)
) { ) {
Column( Column(
modifier = Modifier.padding(16.dp), modifier = Modifier.padding(16.dp),
@ -877,13 +881,13 @@ private fun PartnerAnswerPreview(answer: LocalAnswer) {
Text( Text(
text = "Your partner answered", text = "Your partner answered",
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF30566F), color = MaterialTheme.colorScheme.onTertiaryContainer,
fontWeight = FontWeight.SemiBold fontWeight = FontWeight.SemiBold
) )
Text( Text(
text = answer.partnerRevealSummary(), text = answer.partnerRevealSummary(),
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
color = Color(0xFF33463E), color = MaterialTheme.colorScheme.onSurface,
maxLines = 6, maxLines = 6,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )
@ -896,7 +900,7 @@ private fun WaitingForPartnerCard() {
Surface( Surface(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(20.dp), shape = RoundedCornerShape(20.dp),
color = Color.White.copy(alpha = 0.60f) color = closerSoftSurfaceColor(alpha = 0.60f)
) { ) {
Column( Column(
modifier = Modifier.padding(16.dp), modifier = Modifier.padding(16.dp),
@ -905,7 +909,7 @@ private fun WaitingForPartnerCard() {
Text( Text(
text = "Partner answer", text = "Partner answer",
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
fontWeight = FontWeight.SemiBold fontWeight = FontWeight.SemiBold
) )
Text( Text(

3
app/src/main/java/app/closer/ui/components/PlaceholderScreen.kt
View File

@ -1,6 +1,7 @@
package app.closer.ui.components package app.closer.ui.components
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.foundation.Canvas import androidx.compose.foundation.Canvas
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.border import androidx.compose.foundation.border
@ -300,7 +301,7 @@ private fun DetailRow(
modifier = Modifier modifier = Modifier
.fillMaxWidth() .fillMaxWidth()
.clip(RoundedCornerShape(18.dp)) .clip(RoundedCornerShape(18.dp))
.background(Color(0xFFFFF8FC)) .background(closerSoftSurfaceColor())
.padding(14.dp), .padding(14.dp),
verticalAlignment = Alignment.CenterVertically verticalAlignment = Alignment.CenterVertically
) { ) {

6
app/src/main/java/app/closer/ui/components/SpecialDatesSection.kt
View File

@ -1,5 +1,7 @@
package app.closer.ui.components package app.closer.ui.components
import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerSoftPurpleColor
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
@ -41,7 +43,7 @@ fun SpecialDatesSection(
Card( Card(
modifier = modifier.fillMaxWidth(), modifier = modifier.fillMaxWidth(),
shape = RoundedCornerShape(if (compact) 24.dp else 28.dp), shape = RoundedCornerShape(if (compact) 24.dp else 28.dp),
colors = CardDefaults.cardColors(containerColor = Color.White), colors = CardDefaults.cardColors(containerColor = closerCardColor(alpha = 0.94f)),
elevation = CardDefaults.cardElevation(defaultElevation = if (compact) 4.dp else 8.dp) elevation = CardDefaults.cardElevation(defaultElevation = if (compact) 4.dp else 8.dp)
) { ) {
Column( Column(
@ -66,7 +68,7 @@ fun SpecialDatesSection(
// Anniversary featured card // Anniversary featured card
Surface( Surface(
shape = RoundedCornerShape(20.dp), shape = RoundedCornerShape(20.dp),
color = PurpleLight, color = closerSoftPurpleColor(),
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) { ) {
Row( Row(

5
app/src/main/java/app/closer/ui/dates/DateBuilderScreen.kt
View File

@ -2,6 +2,7 @@ package app.closer.ui.dates
import app.closer.ui.theme.closerCardColor import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
@ -283,7 +284,7 @@ private fun DateTimeField(
Column( Column(
modifier = modifier modifier = modifier
.clickable(onClick = onClick) .clickable(onClick = onClick)
.background(Color(0xFFFFF8FC), RoundedCornerShape(16.dp)) .background(closerSoftSurfaceColor(), RoundedCornerShape(16.dp))
.padding(16.dp), .padding(16.dp),
verticalArrangement = Arrangement.spacedBy(6.dp) verticalArrangement = Arrangement.spacedBy(6.dp)
) { ) {
@ -399,7 +400,7 @@ private fun DurationChip(
) { ) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = if (selected) Color(0xFFB98AF4) else Color(0xFFFFF8FC), color = if (selected) MaterialTheme.colorScheme.primary else closerSoftSurfaceColor(),
tonalElevation = if (selected) 0.dp else 2.dp, tonalElevation = if (selected) 0.dp else 2.dp,
shadowElevation = if (selected) 0.dp else 2.dp, shadowElevation = if (selected) 0.dp else 2.dp,
modifier = modifier modifier = modifier

28
app/src/main/java/app/closer/ui/dates/DateMatchScreen.kt
View File

@ -1,6 +1,10 @@
package app.closer.ui.dates package app.closer.ui.dates
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerSoftPinkColor
import app.closer.ui.theme.closerSoftPurpleColor
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.animation.core.animateFloatAsState import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.animation.core.spring import androidx.compose.animation.core.spring
import androidx.compose.foundation.background import androidx.compose.foundation.background
@ -330,7 +334,7 @@ private fun DateCard(
modifier = modifier, modifier = modifier,
shape = RoundedCornerShape(32.dp), shape = RoundedCornerShape(32.dp),
colors = CardDefaults.cardColors( colors = CardDefaults.cardColors(
containerColor = Color.White.copy(alpha = if (dimmed) 0.7f else 0.96f) containerColor = closerCardColor(alpha = if (dimmed) 0.70f else 0.96f)
), ),
elevation = CardDefaults.cardElevation(defaultElevation = if (dimmed) 1.dp else 6.dp) elevation = CardDefaults.cardElevation(defaultElevation = if (dimmed) 1.dp else 6.dp)
) { ) {
@ -385,7 +389,7 @@ private fun DateCard(
private fun PremiumBadge() { private fun PremiumBadge() {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFFFD8EB) color = closerSoftPinkColor()
) { ) {
Row( Row(
modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp), modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp),
@ -396,12 +400,12 @@ private fun PremiumBadge() {
imageVector = Icons.Filled.Star, imageVector = Icons.Filled.Star,
contentDescription = null, contentDescription = null,
modifier = Modifier.size(14.dp), modifier = Modifier.size(14.dp),
tint = Color(0xFF8A226F) tint = MaterialTheme.colorScheme.onSecondaryContainer
) )
Text( Text(
text = "Premium", text = "Premium",
style = MaterialTheme.typography.labelSmall, style = MaterialTheme.typography.labelSmall,
color = Color(0xFF8A226F), color = MaterialTheme.colorScheme.onSecondaryContainer,
fontWeight = FontWeight.SemiBold fontWeight = FontWeight.SemiBold
) )
} }
@ -412,13 +416,13 @@ private fun PremiumBadge() {
private fun CategoryPill(label: String) { private fun CategoryPill(label: String) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFF3E8FF) color = closerSoftPurpleColor()
) { ) {
Text( Text(
text = label, text = label,
modifier = Modifier.padding(horizontal = 12.dp, vertical = 7.dp), modifier = Modifier.padding(horizontal = 12.dp, vertical = 7.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
fontWeight = FontWeight.SemiBold, fontWeight = FontWeight.SemiBold,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
@ -430,7 +434,7 @@ private fun CategoryPill(label: String) {
private fun InfoChip(label: String) { private fun InfoChip(label: String) {
Surface( Surface(
shape = RoundedCornerShape(12.dp), shape = RoundedCornerShape(12.dp),
color = Color(0xFFFFF8FC) color = closerSoftSurfaceColor()
) { ) {
Text( Text(
text = label, text = label,
@ -457,14 +461,14 @@ private fun ActionButtons(
CircularActionButton( CircularActionButton(
icon = Icons.Filled.Close, icon = Icons.Filled.Close,
contentDescription = "Skip", contentDescription = "Skip",
color = Color(0xFFFFE5E7), color = MaterialTheme.colorScheme.errorContainer,
iconColor = Color(0xFF8D2D35), iconColor = Color(0xFF8D2D35),
onClick = onSkip onClick = onSkip
) )
CircularActionButton( CircularActionButton(
icon = Icons.Filled.Star, icon = Icons.Filled.Star,
contentDescription = "Maybe", contentDescription = "Maybe",
color = Color(0xFFFFF8E1), color = MaterialTheme.colorScheme.tertiaryContainer.copy(alpha = 0.74f),
iconColor = Color(0xFF6B5D00), iconColor = Color(0xFF6B5D00),
onClick = onMaybe, onClick = onMaybe,
size = 72.dp size = 72.dp
@ -472,7 +476,7 @@ private fun ActionButtons(
CircularActionButton( CircularActionButton(
icon = Icons.Filled.Favorite, icon = Icons.Filled.Favorite,
contentDescription = "Love", contentDescription = "Love",
color = Color(0xFFFFE3F0), color = closerSoftPinkColor(),
iconColor = Color(0xFF9B1B5A), iconColor = Color(0xFF9B1B5A),
onClick = onLove onClick = onLove
) )
@ -528,7 +532,7 @@ private fun MatchOverlay(
) { ) {
Card( Card(
shape = RoundedCornerShape(28.dp), shape = RoundedCornerShape(28.dp),
colors = CardDefaults.cardColors(containerColor = Color.White) colors = CardDefaults.cardColors(containerColor = closerCardColor(alpha = 0.96f))
) { ) {
Column( Column(
modifier = Modifier.padding(28.dp), modifier = Modifier.padding(28.dp),
@ -537,7 +541,7 @@ private fun MatchOverlay(
) { ) {
Surface( Surface(
shape = CircleShape, shape = CircleShape,
color = Color(0xFFFFE3F0), color = closerSoftPinkColor(),
modifier = Modifier.size(72.dp) modifier = Modifier.size(72.dp)
) { ) {
Box(contentAlignment = Alignment.Center) { Box(contentAlignment = Alignment.Center) {

17
app/src/main/java/app/closer/ui/dates/DateMatchesScreen.kt
View File

@ -2,6 +2,9 @@ package app.closer.ui.dates
import app.closer.ui.theme.closerCardColor import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftPinkColor
import app.closer.ui.theme.closerSoftPurpleColor
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
@ -203,7 +206,7 @@ private fun SectionHeader(
} }
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFFFF8FC) color = closerSoftSurfaceColor()
) { ) {
Text( Text(
text = count.toString(), text = count.toString(),
@ -223,7 +226,7 @@ private fun MatchCard(match: DateMatch) {
badge = { badge = {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFFFE3F0) color = closerSoftPinkColor()
) { ) {
Row( Row(
modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp), modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp),
@ -255,7 +258,7 @@ private fun SuggestionCard(suggestion: DateMatchSuggestion) {
badge = { badge = {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFFFF8E1) color = MaterialTheme.colorScheme.tertiaryContainer.copy(alpha = 0.74f)
) { ) {
Row( Row(
modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp), modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp),
@ -304,13 +307,13 @@ private fun IdeaCard(
) { ) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFF3E8FF) color = closerSoftPurpleColor()
) { ) {
Text( Text(
text = idea.category.displayDateCategory(), text = idea.category.displayDateCategory(),
modifier = Modifier.padding(horizontal = 11.dp, vertical = 7.dp), modifier = Modifier.padding(horizontal = 11.dp, vertical = 7.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
fontWeight = FontWeight.SemiBold, fontWeight = FontWeight.SemiBold,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
@ -356,13 +359,13 @@ private fun InfoChip(
) { ) {
Surface( Surface(
shape = RoundedCornerShape(12.dp), shape = RoundedCornerShape(12.dp),
color = if (emphasis) Color(0xFFFFD8EB) else Color(0xFFFFF8FC) color = if (emphasis) closerSoftPinkColor() else closerSoftSurfaceColor()
) { ) {
Text( Text(
text = label, text = label,
modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp), modifier = Modifier.padding(horizontal = 10.dp, vertical = 6.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = if (emphasis) Color(0xFF8A226F) else MaterialTheme.colorScheme.onSurfaceVariant, color = if (emphasis) MaterialTheme.colorScheme.onSecondaryContainer else MaterialTheme.colorScheme.onSurfaceVariant,
fontWeight = if (emphasis) FontWeight.SemiBold else FontWeight.Medium fontWeight = if (emphasis) FontWeight.SemiBold else FontWeight.Medium
) )
} }

3
app/src/main/java/app/closer/ui/paywall/PaywallScreen.kt
View File

@ -2,6 +2,7 @@ package app.closer.ui.paywall
import app.closer.ui.theme.closerCardColor import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftSurfaceColor
import android.app.Activity import android.app.Activity
import android.content.Context import android.content.Context
import android.content.ContextWrapper import android.content.ContextWrapper
@ -390,7 +391,7 @@ private fun ActionButtons(
Card( Card(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(16.dp), shape = RoundedCornerShape(16.dp),
colors = CardDefaults.cardColors(containerColor = Color.White.copy(alpha = 0.54f)), colors = CardDefaults.cardColors(containerColor = closerSoftSurfaceColor(alpha = 0.54f)),
elevation = CardDefaults.cardElevation(0.dp) elevation = CardDefaults.cardElevation(0.dp)
) { ) {
Row( Row(

6
app/src/main/java/app/closer/ui/questions/QuestionCategoryScreen.kt
View File

@ -2,6 +2,8 @@ package app.closer.ui.questions
import app.closer.ui.theme.closerCardColor import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftPurpleColor
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.foundation.Image import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.horizontalScroll import androidx.compose.foundation.horizontalScroll
@ -285,14 +287,14 @@ private fun CategoryPill(
) { ) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = if (emphasis) Color(0xFFF3E8FF) else Color(0xFFFFF8FC), color = if (emphasis) closerSoftPurpleColor() else closerSoftSurfaceColor(),
modifier = Modifier.heightIn(min = 32.dp) modifier = Modifier.heightIn(min = 32.dp)
) { ) {
Text( Text(
text = label, text = label,
modifier = Modifier.padding(horizontal = 11.dp, vertical = 7.dp), modifier = Modifier.padding(horizontal = 11.dp, vertical = 7.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = if (emphasis) Color(0xFF56306F) else MaterialTheme.colorScheme.onSurface, color = if (emphasis) MaterialTheme.colorScheme.onPrimaryContainer else MaterialTheme.colorScheme.onSurface,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )

17
app/src/main/java/app/closer/ui/questions/QuestionPackLibraryScreen.kt
View File

@ -2,6 +2,8 @@ package app.closer.ui.questions
import app.closer.ui.theme.closerCardColor import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftPurpleColor
import app.closer.ui.theme.closerSoftSurfaceColor
import androidx.compose.foundation.Image import androidx.compose.foundation.Image
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
@ -200,10 +202,7 @@ private fun QuestionPackCard(
item: QuestionPackItem, item: QuestionPackItem,
onClick: () -> Unit onClick: () -> Unit
) { ) {
val containerColor = if (item.isLocked) val containerColor = if (item.isLocked) closerSoftSurfaceColor(alpha = 0.9f) else closerCardColor(alpha = 0.9f)
Color(0xFFFFF8FC).copy(alpha = 0.9f)
else
closerCardColor(alpha = 0.9f)
val accent = packAccent(item.category.id) val accent = packAccent(item.category.id)
Card( Card(
@ -231,7 +230,7 @@ private fun QuestionPackCard(
.align(Alignment.BottomStart) .align(Alignment.BottomStart)
.fillMaxWidth() .fillMaxWidth()
.height(5.dp) .height(5.dp)
.background(if (item.isLocked) Color(0xFFE3D4EB) else accent) .background(if (item.isLocked) MaterialTheme.colorScheme.outlineVariant else accent)
) )
} }
Column( Column(
@ -321,7 +320,7 @@ private fun FilterPill(
.heightIn(min = 44.dp) .heightIn(min = 44.dp)
.clickable(onClick = onClick), .clickable(onClick = onClick),
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = if (selected) Color(0xFFF3E8FF) else Color.White.copy(alpha = 0.74f), color = if (selected) closerSoftPurpleColor() else closerSoftSurfaceColor(alpha = 0.74f),
tonalElevation = 0.dp, tonalElevation = 0.dp,
shadowElevation = if (selected) 3.dp else 0.dp shadowElevation = if (selected) 3.dp else 0.dp
) { ) {
@ -329,7 +328,7 @@ private fun FilterPill(
text = label, text = label,
modifier = Modifier.padding(horizontal = 13.dp, vertical = 8.dp), modifier = Modifier.padding(horizontal = 13.dp, vertical = 8.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = if (selected) Color(0xFF56306F) else MaterialTheme.colorScheme.onSurface, color = if (selected) MaterialTheme.colorScheme.onPrimaryContainer else MaterialTheme.colorScheme.onSurface,
fontWeight = if (selected) FontWeight.SemiBold else FontWeight.Medium, fontWeight = if (selected) FontWeight.SemiBold else FontWeight.Medium,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
@ -344,14 +343,14 @@ private fun PackPill(
) { ) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = if (emphasis) Color(0xFFF3E8FF) else Color(0xFFFFF8FC), color = if (emphasis) closerSoftPurpleColor() else closerSoftSurfaceColor(),
modifier = Modifier.heightIn(min = 32.dp) modifier = Modifier.heightIn(min = 32.dp)
) { ) {
Text( Text(
text = label, text = label,
modifier = Modifier.padding(horizontal = 11.dp, vertical = 7.dp), modifier = Modifier.padding(horizontal = 11.dp, vertical = 7.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = if (emphasis) Color(0xFF56306F) else MaterialTheme.colorScheme.onSurface, color = if (emphasis) MaterialTheme.colorScheme.onPrimaryContainer else MaterialTheme.colorScheme.onSurface,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )

3
app/src/main/java/app/closer/ui/questions/components/QuestionHeader.kt
View File

@ -17,6 +17,7 @@ import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import app.closer.domain.model.Question import app.closer.domain.model.Question
import app.closer.ui.theme.closerCardColor
@Composable @Composable
fun QuestionHeader( fun QuestionHeader(
@ -31,7 +32,7 @@ fun QuestionHeader(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(26.dp), shape = RoundedCornerShape(26.dp),
colors = CardDefaults.cardColors( colors = CardDefaults.cardColors(
containerColor = Color(0xFFFFF8FC).copy(alpha = 0.94f) containerColor = closerCardColor(alpha = 0.94f)
), ),
elevation = CardDefaults.cardElevation(defaultElevation = 5.dp) elevation = CardDefaults.cardElevation(defaultElevation = 5.dp)
) { ) {

4
app/src/main/java/app/closer/ui/settings/SettingsScreen.kt
View File

@ -314,7 +314,7 @@ fun SettingsScreen(
onClick = { onNavigate(AppRoute.ACCOUNT) }, onClick = { onNavigate(AppRoute.ACCOUNT) },
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(22.dp), shape = RoundedCornerShape(22.dp),
colors = CardDefaults.cardColors(containerColor = Color(0xFFFFF8FC).copy(alpha = 0.96f)), colors = CardDefaults.cardColors(containerColor = SettingsCard.copy(alpha = 0.96f)),
elevation = CardDefaults.cardElevation(defaultElevation = 5.dp) elevation = CardDefaults.cardElevation(defaultElevation = 5.dp)
) { ) {
Row( Row(
@ -366,7 +366,7 @@ fun SettingsScreen(
}, },
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
shape = RoundedCornerShape(22.dp), shape = RoundedCornerShape(22.dp),
colors = CardDefaults.cardColors(containerColor = Color(0xFFF8F0FF).copy(alpha = 0.96f)), colors = CardDefaults.cardColors(containerColor = SettingsSoft.copy(alpha = 0.52f)),
elevation = CardDefaults.cardElevation(defaultElevation = 5.dp) elevation = CardDefaults.cardElevation(defaultElevation = 5.dp)
) { ) {
Row( Row(

25
app/src/main/java/app/closer/ui/theme/CloserPalette.kt
View File

@ -1,6 +1,7 @@
package app.closer.ui.theme package app.closer.ui.theme
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Brush
@ -59,6 +60,30 @@ fun closerElevatedCardColor(): Color = closerCardColor(alpha = 0.92f)
@Composable @Composable
fun closerSolidCardColor(): Color = MaterialTheme.colorScheme.surface fun closerSolidCardColor(): Color = MaterialTheme.colorScheme.surface
@Composable
fun closerSoftSurfaceColor(alpha: Float = 0.92f): Color =
if (isSystemInDarkTheme()) {
MaterialTheme.colorScheme.surfaceVariant.copy(alpha = alpha)
} else {
Color.White.copy(alpha = alpha)
}
@Composable
fun closerSoftPurpleColor(alpha: Float = 1f): Color =
if (isSystemInDarkTheme()) {
MaterialTheme.colorScheme.primaryContainer.copy(alpha = alpha)
} else {
CloserPalette.PurpleMist.copy(alpha = alpha)
}
@Composable
fun closerSoftPinkColor(alpha: Float = 1f): Color =
if (isSystemInDarkTheme()) {
MaterialTheme.colorScheme.secondaryContainer.copy(alpha = alpha)
} else {
CloserPalette.PinkMist.copy(alpha = alpha)
}
@Composable @Composable
fun closerScrimColor(alpha: Float = 0.54f): Color = fun closerScrimColor(alpha: Float = 0.54f): Color =
MaterialTheme.colorScheme.onSurface.copy(alpha = alpha) MaterialTheme.colorScheme.onSurface.copy(alpha = alpha)

9
app/src/main/java/app/closer/ui/wheel/WheelSessionScreen.kt
View File

@ -2,6 +2,7 @@ package app.closer.ui.wheel
import app.closer.ui.theme.closerCardColor import app.closer.ui.theme.closerCardColor
import app.closer.ui.theme.closerBackgroundBrush import app.closer.ui.theme.closerBackgroundBrush
import app.closer.ui.theme.closerSoftPurpleColor
import androidx.compose.foundation.BorderStroke import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
@ -137,14 +138,14 @@ private fun WheelSessionContent(
if (state.categoryName.isNotBlank()) { if (state.categoryName.isNotBlank()) {
Surface( Surface(
shape = RoundedCornerShape(999.dp), shape = RoundedCornerShape(999.dp),
color = Color(0xFFF0EDF9), color = closerSoftPurpleColor(),
modifier = Modifier.heightIn(min = 32.dp) modifier = Modifier.heightIn(min = 32.dp)
) { ) {
Text( Text(
text = state.categoryName, text = state.categoryName,
modifier = Modifier.padding(horizontal = 12.dp, vertical = 6.dp), modifier = Modifier.padding(horizontal = 12.dp, vertical = 6.dp),
style = MaterialTheme.typography.labelMedium, style = MaterialTheme.typography.labelMedium,
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.onPrimaryContainer,
maxLines = 1, maxLines = 1,
overflow = TextOverflow.Ellipsis overflow = TextOverflow.Ellipsis
) )
@ -163,8 +164,8 @@ private fun WheelSessionContent(
LinearProgressIndicator( LinearProgressIndicator(
progress = { progress }, progress = { progress },
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
color = Color(0xFF56306F), color = MaterialTheme.colorScheme.primary,
trackColor = Color(0xFFF4E8FF) trackColor = MaterialTheme.colorScheme.primaryContainer
) )
// Question card // Question card

2
iphone/Closer/Settings/SettingsViews.swift
View File

@ -877,7 +877,7 @@ struct SettingsSectionCard<Content: View>: View {
VStack(spacing: 0) { VStack(spacing: 0) {
content content
} }
.background(Color.white.opacity(0.58)) .background(Color.closerSurface.opacity(0.72))
.clipShape(RoundedRectangle(cornerRadius: CloserRadius.large, style: .continuous)) .clipShape(RoundedRectangle(cornerRadius: CloserRadius.large, style: .continuous))
} }
.padding(CloserSpacing.md) .padding(CloserSpacing.md)

9
iphone/Closer/Theme/CloserTheme.swift
View File

@ -1,12 +1,19 @@
import SwiftUI import SwiftUI
#if canImport(UIKit)
import UIKit
#endif
// MARK: - Theme // MARK: - Theme
extension Color { extension Color {
private static func adaptive(light: String, dark: String) -> Color { private static func adaptive(light: String, dark: String) -> Color {
#if canImport(UIKit)
Color(UIColor { traitCollection in Color(UIColor { traitCollection in
UIColor(hex: traitCollection.userInterfaceStyle == .dark ? dark : light) UIColor(hex: traitCollection.userInterfaceStyle == .dark ? dark : light)
}) })
#else
Color(hex: light)
#endif
} }
// Primary palette // Primary palette
@ -59,6 +66,7 @@ extension Color {
} }
} }
#if canImport(UIKit)
private extension UIColor { private extension UIColor {
convenience init(hex: String) { convenience init(hex: String) {
let hex = hex.trimmingCharacters(in: CharacterSet.alphanumerics.inverted) let hex = hex.trimmingCharacters(in: CharacterSet.alphanumerics.inverted)
@ -81,6 +89,7 @@ private extension UIColor {
) )
} }
} }
#endif
// MARK: - Typography // MARK: - Typography