提取App颜色

2024-10-24 17:22:05 +08:00
parent 9e55043a17
commit 9cf6a338ea
17 changed files with 245 additions and 141 deletions
--- a/app/src/main/java/com/aiosman/riderpro/Colors.kt
+++ b/app/src/main/java/com/aiosman/riderpro/Colors.kt
@@ -2,6 +2,65 @@ package com.aiosman.riderpro

 import androidx.compose.ui.graphics.Color

-object AppColors {
-    val mainColor = Color(0xffED1C24)
-}
+var AppColors = LightThemeColors()
+//var AppColors = DarkThemeColors()
+
+open class AppThemeData(
+    var main: Color,
+    var mainText: Color,
+    var basicMain: Color,
+    var nonActive: Color,
+    var text: Color,
+    var nonActiveText: Color,
+    var secondaryText: Color,
+    var loadingMain: Color,
+    var loadingText: Color,
+    var disabledBackground: Color,
+    var background: Color,
+    var divider: Color,
+    var inputBackground: Color,
+    var inputHint: Color,
+    var error : Color,
+    var checkedBackground: Color,
+    var checkedText: Color,
+    )
+
+class LightThemeColors : AppThemeData(
+    main = Color(0xffda3832),
+    mainText = Color(0xffffffff),
+    basicMain = Color(0xfff0f0f0),
+    nonActive = Color(0xfff5f5f5),
+    text = Color(0xff333333),
+    nonActiveText = Color(0xff333333),
+    secondaryText = Color(0x99000000),
+    loadingMain = Color(0xFFD95757),
+    loadingText = Color(0xffffffff),
+    disabledBackground = Color(0xFFD0D0D0),
+    background = Color(0xFFFFFFFF),
+    divider = Color(0xFFEbEbEb),
+    inputBackground = Color(0xFFF7f7f7),
+    inputHint = Color(0xffdadada),
+    error = Color(0xffFF0000),
+    checkedBackground = Color(0xff000000),
+    checkedText = Color(0xffFFFFFF),
+)
+
+class DarkThemeColors : AppThemeData(
+    main = Color(0xffda3832),
+    mainText = Color(0xffffffff),
+    basicMain = Color(0xFF1C1C1C),
+    nonActive = Color(0xff1f1f1f),
+    text = Color(0xffffffff),
+    nonActiveText = Color(0xff888888),
+    secondaryText = Color(0x99ffffff),
+    loadingMain = Color(0xFFD95757),
+    loadingText = Color(0xff000000),
+    disabledBackground = Color(0xFF3A3A3A),
+    background = Color(0xFF121212),
+    divider = Color(0xFF282828),
+    inputBackground = Color(0xFF1C1C1C),
+    inputHint = Color(0xff888888),
+    error = Color(0xffFF0000),
+    checkedBackground = Color(0xffffffff),
+    checkedText = Color(0xff000000),
+)
--- a/app/src/main/java/com/aiosman/riderpro/ui/account/ResetPassword.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/account/ResetPassword.kt
@@ -19,13 +19,13 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.ConstVars
 import com.aiosman.riderpro.ErrorCode
 import com.aiosman.riderpro.LocalNavController
@@ -35,7 +35,6 @@ import com.aiosman.riderpro.data.AccountServiceImpl
 import com.aiosman.riderpro.data.DictService
 import com.aiosman.riderpro.data.DictServiceImpl
 import com.aiosman.riderpro.data.ServiceException
-import com.aiosman.riderpro.getErrorMessageCode
 import com.aiosman.riderpro.ui.comment.NoticeScreenHeader
 import com.aiosman.riderpro.ui.composables.ActionButton
 import com.aiosman.riderpro.ui.composables.StatusBarSpacer
@@ -148,7 +147,7 @@ fun ResetPasswordScreen() {
                        Text(
                            text = stringResource(R.string.reset_mail_send_success),
                            style = TextStyle(
-                                color = Color(0xFF333333),
+                                color = AppColors.text,
                                fontSize = 14.sp,
                                fontWeight = FontWeight.Bold
                            ),
@@ -158,7 +157,7 @@ fun ResetPasswordScreen() {
                        Text(
                            text = stringResource(R.string.reset_mail_send_failed),
                            style = TextStyle(
-                                color = Color(0xFF333333),
+                                color = AppColors.text,
                                fontSize = 14.sp,
                                fontWeight = FontWeight.Bold
                            ),
@@ -177,8 +176,8 @@ fun ResetPasswordScreen() {
                } else {
                    stringResource(R.string.recover)
                },
-                backgroundColor = Color(0xffda3832),
-                color = Color.White,
+                backgroundColor = AppColors.main,
+                color = AppColors.mainText,
                isLoading = isLoading,
                contentPadding = PaddingValues(0.dp),
                enabled = countDown == null,
--- a/app/src/main/java/com/aiosman/riderpro/ui/account/changepassword.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/account/changepassword.kt
@@ -127,7 +127,6 @@ fun ChangePasswordScreen() {
                    .width(345.dp)
                    .height(48.dp),
                text = "Let's Ride",
-                backgroundImage = R.mipmap.rider_pro_signup_red_bg
            ) {
                if (validate()) {
                    scope.launch {
--- a/app/src/main/java/com/aiosman/riderpro/ui/account/edit2.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/account/edit2.kt
@@ -130,7 +130,7 @@ fun AccountEditScreen2() {
                    modifier = Modifier
                        .size(32.dp)
                        .clip(CircleShape)
-                        .background(AppColors.mainColor)
+                        .background(AppColors.main)
                        .align(Alignment.BottomEnd)
                        .noRippleClickable {
                            navController.navigate(NavigationRoute.ImageCrop.route)
--- a/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentsScreen.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentsScreen.kt
@@ -20,11 +20,13 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.res.painterResource
 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 com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.LocalNavController
 import com.aiosman.riderpro.R
 import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout
@@ -72,17 +74,18 @@ fun NoticeScreenHeader(
        verticalAlignment = Alignment.CenterVertically,
    ) {
        Image(
-            painter = painterResource(id = R.drawable.rider_pro_back_icon),
+            painter = painterResource(id = R.drawable.rider_pro_back_icon,),
            contentDescription = title,
            modifier = Modifier.size(16.dp).clickable(
                indication = null,
                interactionSource = remember { MutableInteractionSource() }
            ) {
                nav.popBackStack()
-            }
+            },
+            colorFilter = ColorFilter.tint(AppColors.text)
        )
        Spacer(modifier = Modifier.size(12.dp))
-        Text(title, fontWeight = FontWeight.W800, fontSize = 17.sp)
+        Text(title, fontWeight = FontWeight.W800, fontSize = 17.sp, color = AppColors.text)
        if (moreIcon) {
            Spacer(modifier = Modifier.weight(1f))
            Image(
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/ActionButton.kt
@@ -1,16 +1,12 @@
 package com.aiosman.riderpro.ui.composables

-import androidx.annotation.DrawableRes
+//import androidx.compose.foundation.layout.ColumnScopeInstance.weight
 import androidx.compose.animation.animateColorAsState
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
-//import androidx.compose.foundation.layout.ColumnScopeInstance.weight
 import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.RoundedCornerShape
@@ -26,23 +22,23 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.ui.modifiers.noRippleClickable

@Composable
 fun ActionButton(
    modifier: Modifier = Modifier,
    text: String,
-    color: Color = Color.Black,
-    @DrawableRes backgroundImage: Int? = null,
-    backgroundColor: Color = Color(0xfff0f0f0),
+    color: Color = AppColors.text,
+    backgroundColor: Color = AppColors.basicMain,
    leading: @Composable (() -> Unit)? = null,
    expandText: Boolean = false,
    contentPadding: PaddingValues = PaddingValues(vertical = 16.dp),
    isLoading: Boolean = false,
-    loadingTextColor: Color = Color.White,
+    loadingTextColor: Color = AppColors.loadingText,
    loadingText: String = "Loading",
-    loadingBackgroundColor: Color = Color(0xFFD95757),
-    disabledBackgroundColor: Color = Color(0xFFD0D0D0),
+    loadingBackgroundColor: Color = AppColors.loadingMain,
+    disabledBackgroundColor: Color = AppColors.disabledBackground,
    enabled: Boolean = true,
    fullWidth:Boolean = false,
    click: () -> Unit = {}
@@ -124,7 +120,7 @@ fun ActionButton(
                ) {
                    CircularProgressIndicator(
                        modifier = Modifier.size(24.dp),
-                        color = Color.White
+                        color = AppColors.text
                    )
                    Text(
                        loadingText,
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/Checkbox.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/Checkbox.kt
@@ -17,6 +17,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.ui.modifiers.noRippleClickable


@@ -26,8 +27,8 @@ fun Checkbox(
    checked: Boolean = false,
    onCheckedChange: (Boolean) -> Unit = {}
 ) {
-    val backgroundColor by animateColorAsState(if (checked) Color.Black else Color.Transparent)
-    val borderColor by animateColorAsState(if (checked) Color.Transparent else Color(0xffebebeb))
+    val backgroundColor by animateColorAsState(if (checked) AppColors.checkedBackground else Color.Transparent)
+    val borderColor by animateColorAsState(if (checked) Color.Transparent else AppColors.secondaryText)
    val borderWidth by animateDpAsState(if (checked) 0.dp else 2.dp)

    Box(
@@ -45,7 +46,7 @@ fun Checkbox(
            Icon(
                Icons.Default.Check,
                contentDescription = "Checked",
-                tint = Color.White,
+                tint = AppColors.checkedText
            )
        }
    }
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/CheckboxWithLabel.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/CheckboxWithLabel.kt
@@ -9,6 +9,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors

@Composable
 fun CheckboxWithLabel(
@@ -33,7 +34,7 @@ fun CheckboxWithLabel(
            modifier = Modifier.padding(start = 8.dp),
            fontSize = fontSize.sp,
            style = TextStyle(
-                color = if (error) Color.Red else Color.Black
+                color = if (error) AppColors.error else AppColors.text
            )
        )
    }
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/FollowButton.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/FollowButton.kt
@@ -1,25 +1,22 @@
 package com.aiosman.riderpro.ui.composables

-import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.wrapContentWidth
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.layout.ContentScale
-import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.TextUnit
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.R
 import com.aiosman.riderpro.ui.modifiers.noRippleClickable

@@ -27,30 +24,27 @@ import com.aiosman.riderpro.ui.modifiers.noRippleClickable
 fun FollowButton(
    isFollowing: Boolean,
    fontSize: TextUnit = 12.sp,
-    imageModifier: Modifier = Modifier,
    onFollowClick: () -> Unit,
 ){
    Box(
        modifier = Modifier
            .wrapContentWidth()
-            .padding(start = 6.dp)
+            .clip(RoundedCornerShape(8.dp))
+            .background(
+                color = if (isFollowing) AppColors.main else AppColors.nonActive
+            )
+            .padding(horizontal = 16.dp, vertical = 8.dp)
            .noRippleClickable {
                onFollowClick()
            },
        contentAlignment = Alignment.Center
    ) {
-        Image(
-            modifier = imageModifier,
-            painter = painterResource(id = R.drawable.follow_bg),
-            contentDescription = "",
-            contentScale = ContentScale.FillWidth
-        )
        Text(
            text = if (isFollowing) stringResource(R.string.following_upper) else stringResource(
                R.string.follow_upper
            ),
            fontSize = fontSize,
-            color = Color.White,
+            color = if (isFollowing) AppColors.mainText else AppColors.nonActiveText,
            style = TextStyle(fontWeight = FontWeight.Bold)
        )
    }
--- a/app/src/main/java/com/aiosman/riderpro/ui/composables/TextInputField.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/composables/TextInputField.kt
@@ -32,6 +32,7 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.onFocusChanged
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.SolidColor
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
@@ -41,6 +42,7 @@ import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.text.style.TextIndent
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.R
 import com.aiosman.riderpro.ui.modifiers.noRippleClickable

@@ -59,17 +61,17 @@ fun TextInputField(
    var isFocused by remember { mutableStateOf(false) }
    Column(modifier = modifier) {
        label?.let {
-            Text(it, color = Color(0xFFCCCCCC))
+            Text(it, color = AppColors.secondaryText)
            Spacer(modifier = Modifier.height(16.dp))
        }
        Box(
            contentAlignment = Alignment.CenterStart,
            modifier = Modifier
                .clip(RoundedCornerShape(24.dp))
-                .background(Color(0xFFF7f7f7))
+                .background(AppColors.inputBackground)
                .border(
                    width = 2.dp,
-                    color = if (error == null) Color.Transparent  else Color(0xFFE53935),
+                    color = if (error == null) Color.Transparent  else AppColors.error,
                    shape = RoundedCornerShape(24.dp)
                )
                .padding(horizontal = 16.dp, vertical = 16.dp)
@@ -86,7 +88,7 @@ fun TextInputField(
                    textStyle = TextStyle(
                        fontSize = 16.sp,
                        fontWeight = FontWeight.W500,
-                        color = Color(0xff333333)
+                        color = AppColors.text
                    ),
                    keyboardOptions = KeyboardOptions(
                        keyboardType = if (password) KeyboardType.Password else KeyboardType.Text
@@ -94,6 +96,7 @@ fun TextInputField(
                    visualTransformation = if (showPassword) VisualTransformation.None else PasswordVisualTransformation(),
                    singleLine = true,
                    enabled = enabled,
+                    cursorBrush = SolidColor(AppColors.text),
                )
                if (password) {
                    Image(
@@ -104,14 +107,14 @@ fun TextInputField(
                            .noRippleClickable {
                                showPassword = !showPassword
                            },
-                        colorFilter = ColorFilter.tint(Color.Black)
+                        colorFilter = ColorFilter.tint(AppColors.text)
                    )
                }
            }

            if (text.isEmpty()) {
                hint?.let {
-                    Text(it, modifier = Modifier.padding(start = 5.dp), color = Color(0xffdadada), fontWeight = FontWeight.W600)
+                    Text(it, modifier = Modifier.padding(start = 5.dp), color = AppColors.inputHint, fontWeight = FontWeight.W600)
                }
            }
        }
@@ -135,7 +138,7 @@ fun TextInputField(
                    )
                    Spacer(modifier = Modifier.size(4.dp))
                    AnimatedContent(targetState = error) { targetError ->
-                        Text(targetError ?: "", color = Color(0xFFE53935), fontSize = 12.sp)
+                        Text(targetError ?: "", color = AppColors.text, fontSize = 12.sp)
                    }
                }
            }
--- a/app/src/main/java/com/aiosman/riderpro/ui/follower/FollowerList.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/follower/FollowerList.kt
@@ -22,6 +22,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.UiMode
 import androidx.compose.ui.unit.dp
 import androidx.paging.compose.collectAsLazyPagingItems
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.R
 import com.aiosman.riderpro.ui.comment.NoticeScreenHeader
 import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout
@@ -41,16 +42,15 @@ fun FollowerListScreen(userId: Int) {
    }
    StatusBarMaskLayout(
        modifier = Modifier
-            .background(color = Color(0xFFFFFFFF))
+            .background(color = AppColors.background)
            .padding(horizontal = 16.dp),
-        maskBoxBackgroundColor = Color(0xFFFFFFFF)
+        maskBoxBackgroundColor = AppColors.background,
    ) {
        var dataFlow = model.usersFlow
        var users = dataFlow.collectAsLazyPagingItems()
        Box(
            modifier = Modifier
                .fillMaxWidth()
-                .background(color = Color(0xFFFFFFFF))
                .padding(vertical = 16.dp)
        ) {
            NoticeScreenHeader(stringResource(R.string.followers_upper), moreIcon = false)
@@ -59,12 +59,10 @@ fun FollowerListScreen(userId: Int) {
            modifier = Modifier
                .fillMaxWidth()
                .weight(1f)
-                .background(color = Color(0xFFFFFFFF))
                .pullRefresh(refreshState)
        ) {
            LazyColumn(
                modifier = Modifier.fillMaxSize()
-                    .background(color = Color(0xFFFFFFFF))
            ) {
                items(users.itemCount) { index ->
                    users[index]?.let { user ->
--- a/app/src/main/java/com/aiosman/riderpro/ui/follower/FollowingList.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/follower/FollowingList.kt
@@ -19,6 +19,7 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import androidx.paging.compose.collectAsLazyPagingItems
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.R
 import com.aiosman.riderpro.ui.comment.NoticeScreenHeader
 import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout
@@ -37,9 +38,9 @@ fun FollowingListScreen(userId: Int) {
    }
    StatusBarMaskLayout(
        modifier = Modifier
-            .background(color = Color(0xFFFFFFFF))
+            .background(color = AppColors.background)
            .padding(horizontal = 16.dp),
-        maskBoxBackgroundColor = Color(0xFFFFFFFF)
+        maskBoxBackgroundColor = AppColors.background
    ) {
        var dataFlow = model.usersFlow
        var users = dataFlow.collectAsLazyPagingItems()
--- a/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/message/MessageList.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/index/tabs/message/MessageList.kt
@@ -36,6 +36,7 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.lifecycle.viewModelScope
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.LocalNavController
 import com.aiosman.riderpro.R
 import com.aiosman.riderpro.ui.NavigationRoute
@@ -110,18 +111,6 @@ fun NotificationsScreen() {
                        }
                        navController.navigate(NavigationRoute.Followers.route)
                    }
-//                    NotificationIndicator(
-//                        MessageListViewModel.favouriteNoticeCount,
-//                        R.drawable.rider_pro_favoriate,
-//                        stringResource(R.string.favourites_upper)
-//                    ) {
-//                        if (MessageListViewModel.favouriteNoticeCount > 0) {
-//                            // 刷新收藏消息列表
-//                            FavouriteNoticeViewModel.isFirstLoad = true
-//                            MessageListViewModel.clearFavouriteNoticeCount()
-//                        }
-//                        navController.navigate(NavigationRoute.FavouritesScreen.route)
-//                    }
                    NotificationIndicator(
                        MessageListViewModel.commentNoticeCount,
                        R.drawable.rider_pro_comment,
@@ -130,7 +119,7 @@ fun NotificationsScreen() {
                        navController.navigate(NavigationRoute.CommentNoticeScreen.route)
                    }
                }
-                HorizontalDivider(color = Color(0xFFEbEbEb), modifier = Modifier.padding(16.dp))
+                HorizontalDivider(color = AppColors.divider, modifier = Modifier.padding(16.dp))
                NotificationCounterItem(MessageListViewModel.unReadConversationCount.toInt())
                Box(
                    modifier = Modifier
@@ -178,13 +167,13 @@ fun NotificationIndicator(
            if (notificationCount > 0) {
                Box(
                    modifier = Modifier
-                        .background(Color(0xFFE53935), RoundedCornerShape(16.dp))
+                        .background(AppColors.main, RoundedCornerShape(16.dp))
                        .padding(4.dp)
                        .align(Alignment.TopEnd)
                ) {
                    Text(
                        text = notificationCount.toString(),
-                        color = Color.White,
+                        color = AppColors.mainText,
                        fontSize = 10.sp,
                        fontWeight = FontWeight.Bold,
                        modifier = Modifier.align(Alignment.Center)
@@ -239,12 +228,12 @@ fun NotificationCounterItem(count: Int) {
        if (count > 0) {
            Box(
                modifier = Modifier
-                    .background(Color(0xFFE53935), RoundedCornerShape(16.dp))
+                    .background(AppColors.main, RoundedCornerShape(16.dp))
                    .padding(horizontal = 8.dp, vertical = 2.dp)
            ) {
                Text(
                    text = count.toString(),
-                    color = Color.White,
+                    color = AppColors.mainText,
                    fontSize = 12.sp,
                    fontWeight = FontWeight.Bold,
                )
@@ -300,7 +289,7 @@ fun ChatMessageList(
                        Text(
                            text = item.lastMessageTime,
                            fontSize = 14.sp,
-                            color = Color(0x66000000)
+                            color = AppColors.secondaryText,
                        )
                    }
                    Spacer(modifier = Modifier.height(6.dp))
@@ -309,7 +298,7 @@ fun ChatMessageList(
                            text = "${if (item.isSelf) "Me: " else ""}${item.displayText}",
                            fontSize = 14.sp,
                            maxLines = 1,
-                            color = Color(0x99000000),
+                            color = AppColors.secondaryText,
                            modifier = Modifier.weight(1f),
                            overflow = TextOverflow.Ellipsis
                        )
@@ -317,12 +306,12 @@ fun ChatMessageList(
                        if (item.unreadCount > 0) {
                            Box(
                                modifier = Modifier
-                                    .background(Color(0xFFE53935), CircleShape)
+                                    .background(AppColors.main, CircleShape)
                                    .padding(horizontal = 8.dp, vertical = 2.dp)
                            ) {
                                Text(
                                    text = item.unreadCount.toString(),
-                                    color = Color.White,
+                                    color = AppColors.mainText,
                                    fontSize = 12.sp,
                                    fontWeight = FontWeight.Bold,
                                    modifier = Modifier.align(Alignment.Center)
--- a/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt
@@ -48,6 +48,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.AppState
 import com.aiosman.riderpro.AppStore
 import com.aiosman.riderpro.LocalNavController
@@ -131,7 +132,7 @@ fun LoginPage() {
    Box(
        modifier = Modifier
            .fillMaxSize()
-            .background(Color.White)
+            .background(AppColors.background)
    ) {
        Box(
            modifier = Modifier
@@ -157,15 +158,21 @@ fun LoginPage() {
            Text(
                "Connecting Riders",
                fontSize = 28.sp,
-                fontWeight = FontWeight.W900
+                fontWeight = FontWeight.W900,
+                color = AppColors.text
+            )
+            Text(
+                "Worldwide",
+                fontSize = 28.sp,
+                fontWeight = FontWeight.W900,
+                color = AppColors.text
            )
-            Text("Worldwide", fontSize = 28.sp, fontWeight = FontWeight.W900)
            Spacer(modifier = Modifier.height(32.dp))
            ActionButton(
                modifier = Modifier.fillMaxWidth(),
                text = stringResource(R.string.sign_up_upper),
-                color = Color.White,
-                backgroundColor = Color(0xffda3832)
+                color = AppColors.mainText,
+                backgroundColor = AppColors.main
            ) {
                navController.navigate(
                    NavigationRoute.EmailSignUp.route,
@@ -175,7 +182,7 @@ fun LoginPage() {
            ActionButton(
                modifier = Modifier.fillMaxWidth(),
                text = stringResource(R.string.sign_in_with_google),
-                color = Color.Black,
+                color = AppColors.text,
                leading = {
                    Image(
                        painter = painterResource(id = R.drawable.rider_pro_google),
@@ -197,7 +204,7 @@ fun LoginPage() {
                    stringResource(R.string.login_upper),
                    fontSize = 17.sp,
                    fontWeight = FontWeight.W900,
-                    color = Color(0xff333333),
+                    color = AppColors.text,
                    modifier = Modifier.noRippleClickable {
                        navController.navigate(
                            NavigationRoute.UserAuth.route,
@@ -213,9 +220,36 @@ fun LoginPage() {

@Composable
 fun MovingImageWall(resources: Resources) {
-    val imageList1 = remember { mutableStateListOf(R.drawable.wall_1_1, R.drawable.wall_1_2, R.drawable.wall_1_3,R.drawable.wall_1_1, R.drawable.wall_1_2, R.drawable.wall_1_3) }
-    val imageList2 = remember { mutableStateListOf(R.drawable.wall_2_1, R.drawable.wall_2_2, R.drawable.wall_2_3,R.drawable.wall_2_1, R.drawable.wall_2_2, R.drawable.wall_2_3) }
-    val imageList3 = remember { mutableStateListOf(R.drawable.wall_3_1, R.drawable.wall_3_2, R.drawable.wall_3_3,R.drawable.wall_3_1, R.drawable.wall_3_2, R.drawable.wall_3_3) }
+    val imageList1 = remember {
+        mutableStateListOf(
+            R.drawable.wall_1_1,
+            R.drawable.wall_1_2,
+            R.drawable.wall_1_3,
+            R.drawable.wall_1_1,
+            R.drawable.wall_1_2,
+            R.drawable.wall_1_3
+        )
+    }
+    val imageList2 = remember {
+        mutableStateListOf(
+            R.drawable.wall_2_1,
+            R.drawable.wall_2_2,
+            R.drawable.wall_2_3,
+            R.drawable.wall_2_1,
+            R.drawable.wall_2_2,
+            R.drawable.wall_2_3
+        )
+    }
+    val imageList3 = remember {
+        mutableStateListOf(
+            R.drawable.wall_3_1,
+            R.drawable.wall_3_2,
+            R.drawable.wall_3_3,
+            R.drawable.wall_3_1,
+            R.drawable.wall_3_2,
+            R.drawable.wall_3_3
+        )
+    }

    val density = resources.displayMetrics.density // 获取屏幕密度
    val imageHeight = 208.dp
@@ -232,13 +266,23 @@ fun MovingImageWall(resources: Resources) {
    // 使用 LaunchedEffect 在每次 recomposition 时启动动画
    LaunchedEffect(Unit) {
        coroutineScope.launch {
-            animateImageWall(imageList1, offset1, speed = 1f, resources = resources) { offset1 = it }
+            animateImageWall(imageList1, offset1, speed = 1f, resources = resources) {
+                offset1 = it
+            }
        }
        coroutineScope.launch {
-            animateImageWall(imageList2, offset2, speed = 1.5f, reverse = true, resources = resources) { offset2 = it }
+            animateImageWall(
+                imageList2,
+                offset2,
+                speed = 1.5f,
+                reverse = true,
+                resources = resources
+            ) { offset2 = it }
        }
        coroutineScope.launch {
-            animateImageWall(imageList3, offset3, speed = 2f, resources = resources) { offset3 = it }
+            animateImageWall(imageList3, offset3, speed = 2f, resources = resources) {
+                offset3 = it
+            }
        }
    }

@@ -261,35 +305,43 @@ fun MovingImageWall(resources: Resources) {
            // 消耗所有滚动事件，阻止用户滚动
            delta
        }
-        Row (modifier = Modifier
-            .fillMaxWidth()){
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+        ) {
            // 第1列
-            ImageColumn(imageList1, offset1,
+            ImageColumn(
+                imageList1, offset1,
                Modifier
                    .verticalScroll(scrollState1)
                    .scrollable(
                        state = scrollableState1,
                        orientation = Orientation.Vertical
                    )
-                    .weight(1f))
+                    .weight(1f)
+            )
            // 第2列
-            ImageColumn(imageList2, offset2,
+            ImageColumn(
+                imageList2, offset2,
                Modifier
                    .verticalScroll(scrollState2)
                    .scrollable(
                        state = scrollableState2,
                        orientation = Orientation.Vertical
                    )
-                    .weight(1f), reverse = true)
+                    .weight(1f), reverse = true
+            )
            // 第3列
-            ImageColumn(imageList3, offset3,
+            ImageColumn(
+                imageList3, offset3,
                Modifier
                    .verticalScroll(scrollState3)
                    .scrollable(
                        state = scrollableState3,
                        orientation = Orientation.Vertical
                    )
-                    .weight(1f))
+                    .weight(1f)
+            )
        }

        // 白色叠加层
@@ -297,7 +349,7 @@ fun MovingImageWall(resources: Resources) {
            modifier = Modifier
                .fillMaxWidth()
                .fillMaxHeight()
-                .background(Color.White.copy(alpha = 0.3f)),
+                .background(AppColors.background.copy(alpha = 0.3f)),
            contentAlignment = Alignment.BottomCenter
        ) {
            Box(
@@ -308,7 +360,7 @@ fun MovingImageWall(resources: Resources) {
                        Brush.verticalGradient(
                            colors = listOf(
                                Color.Transparent,
-                                Color.White
+                                AppColors.background
                            ),
                            startY = 0f,
                            endY = 500f
@@ -361,6 +413,7 @@ fun ImageColumn(
        }
    }
 }
+
 suspend fun animateImageWall(
    imageList: MutableList<Int>,
    initialOffset: Float,
--- a/app/src/main/java/com/aiosman/riderpro/ui/login/signup.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/login/signup.kt
@@ -161,7 +161,6 @@ fun SignupScreen() {
                            .width(345.dp)
                            .height(48.dp),
                        text = stringResource(R.string.sign_in_with_email),
-                        backgroundImage = R.mipmap.rider_pro_signup_red_bg,
                        leading = {
                            Image(
                                painter = painterResource(id = R.mipmap.rider_pro_email),
@@ -204,7 +203,6 @@ fun SignupScreen() {
                            Spacer(modifier = Modifier.width(8.dp))
                        },
                        text = stringResource(R.string.sign_in_with_google),
-                        backgroundImage = R.mipmap.rider_pro_signup_white_bg
                    ) {
                        googleLogin()

--- a/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt
@@ -31,6 +31,7 @@ import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
+import com.aiosman.riderpro.AppColors
 import com.aiosman.riderpro.AppState
 import com.aiosman.riderpro.AppStore
 import com.aiosman.riderpro.ErrorCode
@@ -120,22 +121,24 @@ fun UserAuthScreen() {
                }
            } catch (e: ServiceException) {
                // handle error
-                if (e.code == 12005) {
+                when (e.code) {
+                    12005 -> {
                        emailError = context.getString(R.string.error_invalidate_username_password)
                        passwordError = context.getString(R.string.error_invalidate_username_password)
-                } else if (e.code == ErrorCode.InvalidateCaptcha.code) {
+                    }
+                    ErrorCode.InvalidateCaptcha.code -> {
                        loadLoginCaptcha()
                        Toast.makeText(
                            context,
                            context.getString(R.string.incorrect_captcha_please_try_again),
                            Toast.LENGTH_SHORT
                        ).show()
-                } else {
-
+                    }
+                    else -> {
                        Toast.makeText(context, e.message, Toast.LENGTH_SHORT).show()
                    }
+                }
            } catch (e: Exception) {
-
                Toast.makeText(context, e.message, Toast.LENGTH_SHORT).show()
            } finally {
                captchaData = null
@@ -206,7 +209,7 @@ fun UserAuthScreen() {
        horizontalAlignment = Alignment.CenterHorizontally,
        modifier = Modifier
            .fillMaxSize()
-            .background(Color.White)
+            .background(AppColors.background)
    ) {
        StatusBarSpacer()
        Box(
@@ -220,10 +223,12 @@ fun UserAuthScreen() {
            modifier = Modifier
                .fillMaxWidth()
                .weight(1f)
+
                .padding(horizontal = 24.dp),
            horizontalAlignment = Alignment.CenterHorizontally,
+
        ) {
-            Spacer(modifier = Modifier.padding(48.dp))
+            StatusBarSpacer()
            TextInputField(
                modifier = Modifier
                    .fillMaxWidth(),
@@ -263,7 +268,8 @@ fun UserAuthScreen() {
                    fontSize = 12.sp,
                    style = TextStyle(
                        fontWeight = FontWeight.W500
-                    )
+                    ),
+                    color = AppColors.text
                )
                Spacer(modifier = Modifier.weight(1f))
                Text(
@@ -274,7 +280,8 @@ fun UserAuthScreen() {
                    },
                    style = TextStyle(
                        fontWeight = FontWeight.W500
-                    )
+                    ),
+                    color = AppColors.text
                )

            }
@@ -282,18 +289,18 @@ fun UserAuthScreen() {
            ActionButton(
                modifier = Modifier.fillMaxWidth(),
                text = stringResource(R.string.lets_ride_upper),
-                backgroundColor = Color(0xffda3832),
-                color = Color.White
+                backgroundColor = AppColors.main,
+                color = AppColors.mainText,
            ) {
                onLogin()
            }
            Spacer(modifier = Modifier.height(16.dp))
-            Text(stringResource(R.string.or_login_with), color = Color(0xFF999999))
+            Text(stringResource(R.string.or_login_with), color = AppColors.secondaryText)
            Spacer(modifier = Modifier.height(16.dp))
            ActionButton(
                modifier = Modifier.fillMaxWidth(),
                text = stringResource(R.string.sign_in_with_google),
-                color = Color.Black,
+                color = AppColors.text,
                leading = {
                    Image(
                        painter = painterResource(id = R.drawable.rider_pro_google),
--- a/app/src/main/java/com/aiosman/riderpro/ui/post/Post.kt
+++ b/app/src/main/java/com/aiosman/riderpro/ui/post/Post.kt
@@ -16,6 +16,7 @@ import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
@@ -84,6 +85,7 @@ import com.aiosman.riderpro.exp.formatPostTime
 import com.aiosman.riderpro.exp.timeAgo
 import com.aiosman.riderpro.ui.NavigationRoute
 import com.aiosman.riderpro.ui.comment.NoticeScreenHeader
+import com.aiosman.riderpro.ui.composables.ActionButton
 import com.aiosman.riderpro.ui.composables.AnimatedFavouriteIcon
 import com.aiosman.riderpro.ui.composables.AnimatedLikeIcon
 import com.aiosman.riderpro.ui.composables.BottomNavigationPlaceholder
@@ -687,19 +689,20 @@ fun Header(
        }

        Spacer(modifier = Modifier.width(8.dp))
-        Text(text = nickname ?: "", fontWeight = FontWeight.Bold)
-//        if (AppState.UserId != userId) {
-//            FollowButton(
-//                isFollowing = isFollowing,
-//                onFollowClick = onFollowClick,
-//                imageModifier = Modifier
-//                    .height(18.dp)
-//                    .width(80.dp),
-//                fontSize = 12.sp
-//            )
-//        }
+        Text(
+            text = nickname ?: "",
+            fontWeight = FontWeight.Bold,
+            modifier = Modifier.weight(1f)
+        )
+        if (AppState.UserId != userId) {
+            FollowButton(
+                isFollowing = isFollowing,
+                onFollowClick = onFollowClick,
+                fontSize = 12.sp
+            )
+            Spacer(modifier = Modifier.width(8.dp))
+        }
        if (AppState.UserId == userId) {
-            Spacer(modifier = Modifier.weight(1f))
            Box {
                Image(
                    modifier = Modifier