From 406caa3702fc7c79adbcf4e25f7745d764abb0c7 Mon Sep 17 00:00:00 2001 From: AllenTom Date: Tue, 30 Jul 2024 09:04:07 +0800 Subject: [PATCH] =?UTF-8?q?=E7=99=BB=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../main/java/com/aiosman/riderpro/ui/Navi.kt | 17 +- .../riderpro/ui/comment/CommentsScreen.kt | 20 +- .../aiosman/riderpro/ui/login/emailsignup.kt | 155 +++++++++++++++ .../com/aiosman/riderpro/ui/login/login.kt | 116 ++++++++++-- .../com/aiosman/riderpro/ui/login/signup.kt | 172 +++++++++++++++++ .../com/aiosman/riderpro/ui/login/userauth.kt | 178 ++++++++++++++++++ 6 files changed, 637 insertions(+), 21 deletions(-) create mode 100644 app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt create mode 100644 app/src/main/java/com/aiosman/riderpro/ui/login/signup.kt create mode 100644 app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt diff --git a/app/src/main/java/com/aiosman/riderpro/ui/Navi.kt b/app/src/main/java/com/aiosman/riderpro/ui/Navi.kt index bd652cb..7414816 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/Navi.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/Navi.kt @@ -29,7 +29,10 @@ import com.aiosman.riderpro.ui.gallery.ProfileTimelineScreen import com.aiosman.riderpro.ui.index.IndexScreen import com.aiosman.riderpro.ui.like.LikeScreen import com.aiosman.riderpro.ui.location.LocationDetailScreen +import com.aiosman.riderpro.ui.login.EmailSignupScreen import com.aiosman.riderpro.ui.login.LoginPage +import com.aiosman.riderpro.ui.login.SignupScreen +import com.aiosman.riderpro.ui.login.UserAuthScreen import com.aiosman.riderpro.ui.message.NotificationsScreen import com.aiosman.riderpro.ui.modification.EditModificationScreen import com.aiosman.riderpro.ui.post.NewPostScreen @@ -54,6 +57,9 @@ sealed class NavigationRoute( data object EditModification : NavigationRoute("EditModification") data object Login : NavigationRoute("Login") data object AccountProfile : NavigationRoute("AccountProfile/{id}") + data object SignUp : NavigationRoute("SignUp") + data object UserAuth : NavigationRoute("UserAuth") + data object EmailSignUp : NavigationRoute("EmailSignUp") } @@ -65,7 +71,7 @@ fun NavigationController(navController: NavHostController) { NavHost( navController = navController, - startDestination = NavigationRoute.Login.route, + startDestination = NavigationRoute.Index.route, ) { composable(route = NavigationRoute.Index.route) { CompositionLocalProvider( @@ -148,6 +154,15 @@ fun NavigationController(navController: NavHostController) { ) { AccountProfile(it.arguments?.getString("id")!!) } + composable(route = NavigationRoute.SignUp.route) { + SignupScreen() + } + composable(route = NavigationRoute.UserAuth.route) { + UserAuthScreen() + } + composable(route = NavigationRoute.EmailSignUp.route) { + EmailSignupScreen() + } } diff --git a/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentsScreen.kt b/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentsScreen.kt index 75a33ef..8e763c6 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentsScreen.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/comment/CommentsScreen.kt @@ -62,7 +62,8 @@ fun CommentsScreen() { @Composable fun NoticeScreenHeader( - title:String + title:String, + moreIcon: Boolean = true ) { val nav = LocalNavController.current Row( @@ -80,13 +81,16 @@ fun NoticeScreenHeader( } ) Spacer(modifier = Modifier.size(12.dp)) - Text(title, fontWeight = FontWeight.Bold, fontSize = 17.sp) - Spacer(modifier = Modifier.weight(1f)) - Image( - painter = painterResource(id = R.drawable.rider_pro_more_horizon), - contentDescription = "More", - modifier = Modifier.size(24.dp) - ) + Text(title, fontWeight = FontWeight.W800, fontSize = 17.sp) + if (moreIcon) { + Spacer(modifier = Modifier.weight(1f)) + Image( + painter = painterResource(id = R.drawable.rider_pro_more_horizon), + contentDescription = "More", + modifier = Modifier.size(24.dp) + ) + } + } } diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt new file mode 100644 index 0000000..87800ea --- /dev/null +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/emailsignup.kt @@ -0,0 +1,155 @@ +package com.aiosman.riderpro.ui.login + +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +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.width +import androidx.compose.material3.Checkbox +import androidx.compose.material3.CheckboxDefaults +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +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.unit.dp +import androidx.compose.ui.unit.sp +import com.aiosman.riderpro.R +import com.aiosman.riderpro.ui.comment.NoticeScreenHeader +import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout + +@Composable +fun EmailSignupScreen() { + var email by remember { mutableStateOf("") } + var password by remember { mutableStateOf("") } + var rememberMe by remember { mutableStateOf(false) } + var acceptTerms by remember { mutableStateOf(false) } + var acceptPromotions by remember { mutableStateOf(false) } + StatusBarMaskLayout { + Column( + horizontalAlignment = Alignment.CenterHorizontally, + ) { + Box( + modifier = Modifier + .fillMaxWidth() + .padding(top = 16.dp, start = 16.dp, end = 16.dp) + ) { + NoticeScreenHeader("SIGNUP", moreIcon = false) + } + + Spacer(modifier = Modifier.padding(68.dp)) + TextInputField( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 24.dp), + text = email, + onValueChange = { + email = it + }, + label = "What's your email?", + hint = "Enter your email" + ) + Spacer(modifier = Modifier.padding(16.dp)) + TextInputField( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 24.dp), + text = password, + onValueChange = { + password = it + }, + password = true, + label = "What's your password?", + hint = "Enter your password" + ) + Spacer(modifier = Modifier.padding(16.dp)) + TextInputField( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 24.dp), + text = password, + onValueChange = { + password = it + }, + password = true, + label = "Confirm password", + hint = "Enter your password" + ) + Spacer(modifier = Modifier.height(32.dp)) + Column( + modifier = Modifier.fillMaxWidth(), + horizontalAlignment = Alignment.Start, + ) { + Row( + verticalAlignment = Alignment.CenterVertically + ) { + Checkbox( + checked = rememberMe, + onCheckedChange = { + rememberMe = it + }, + modifier = Modifier.padding(start = 16.dp), + colors = CheckboxDefaults.colors( + checkedColor = Color.Black + ), + ) + Text("Remember me", modifier = Modifier.padding(start = 4.dp)) + } + Row( + verticalAlignment = Alignment.CenterVertically + ) { + Checkbox( + checked = acceptTerms, + onCheckedChange = { + acceptTerms = it + }, + modifier = Modifier.padding(start = 16.dp), + colors = CheckboxDefaults.colors( + checkedColor = Color.Black + ), + ) + Text( + "Yes, I have read and agree to RiderPro’s Terms of Service.", + modifier = Modifier.padding(start = 4.dp), + fontSize = 12.sp + ) + } + Row( + verticalAlignment = Alignment.CenterVertically + ) { + Checkbox( + checked = acceptPromotions, + onCheckedChange = { + acceptPromotions = it + }, + modifier = Modifier.padding(start = 16.dp), + colors = CheckboxDefaults.colors( + checkedColor = Color.Black + ), + ) + Text( + "Yes, Send me news and promotional content from RiderPro.", + modifier = Modifier.padding(start = 4.dp), + fontSize = 12.sp + ) + } + } + + Spacer(modifier = Modifier.height(64.dp)) + ActionButton( + modifier = Modifier + .width(345.dp) + .height(48.dp), + text = "LET'S RIDE".uppercase(), + backgroundImage = R.mipmap.rider_pro_signup_red_bg + ) + } + } +} \ No newline at end of file diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt index c9fc403..146d388 100644 --- a/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/login.kt @@ -1,41 +1,133 @@ package com.aiosman.riderpro.ui.login +import androidx.annotation.DrawableRes +import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding -import androidx.compose.material3.ElevatedButton +import androidx.compose.foundation.layout.width import androidx.compose.material3.Scaffold import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect 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.text.font.FontWeight import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.aiosman.riderpro.LocalNavController +import com.aiosman.riderpro.R import com.aiosman.riderpro.ui.NavigationRoute +import com.aiosman.riderpro.ui.modifiers.noRippleClickable @Composable fun LoginPage() { val navController = LocalNavController.current LaunchedEffect(Unit) { - navController.navigate(NavigationRoute.Index.route) +// navController.navigate(NavigationRoute.Index.route) } - Scaffold { paddingValues -> - Column( - modifier = Modifier.padding(paddingValues).padding(horizontal = 16.dp).fillMaxSize(), - verticalArrangement = Arrangement.Center, - horizontalAlignment = Alignment.CenterHorizontally + Scaffold { + it + Box( + modifier = Modifier.fillMaxSize() ) { - Text("Login", fontSize = 24.sp) - ElevatedButton( - onClick = { /*TODO*/ }, - modifier = Modifier.fillMaxWidth() + // to bottom + Box( + contentAlignment = Alignment.TopCenter, + modifier = Modifier.padding(top = 211.dp) ) { - Text("Login with Google") + Column( + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier.fillMaxWidth() + ) { + Image( + painter = painterResource(id = R.mipmap.rider_pro_logo), + contentDescription = "Rider Pro", + modifier = Modifier + .width(108.dp) + .height(45.dp) + ) + Spacer(modifier = Modifier.height(32.dp)) + Text( + "Connecting Riders".uppercase(), + fontSize = 28.sp, + fontWeight = FontWeight.Bold + ) + Text("Worldwide".uppercase(), fontSize = 28.sp, fontWeight = FontWeight.Bold) + } + + } + Box( + modifier = Modifier + .align(Alignment.BottomCenter) + .padding(bottom = 82.dp + 162.dp) + + ) { + Row( + modifier = Modifier.fillMaxWidth(), + horizontalArrangement = Arrangement.Center + ) { + ActionButton( + modifier = Modifier + .width(162.dp) + .height(48.dp), + text = "Login in".uppercase(), + backgroundImage = R.mipmap.rider_pro_grey_bg_big + ) { + navController.navigate(NavigationRoute.UserAuth.route) + } + ActionButton( + modifier = Modifier + .width(162.dp) + .height(48.dp), + text = "Sign In".uppercase(), + backgroundImage = R.mipmap.rider_pro_red_bg_big + ){ + navController.navigate(NavigationRoute.SignUp.route) + } + } } } + + } +} + +@Composable +fun ActionButton( + modifier: Modifier, + text: String, + color: Color = Color.White, + @DrawableRes backgroundImage: Int, + leading: @Composable (() -> Unit)? = null, + click: () -> Unit = {} +) { + Box( + modifier = modifier.noRippleClickable { + click() + } + ) { + Image( + painter = painterResource(id = backgroundImage), + contentDescription = "Rider Pro", + modifier = Modifier.fillMaxSize(), + contentScale = ContentScale.FillBounds + ) + Row( + modifier = Modifier.align(Alignment.Center), + verticalAlignment = Alignment.CenterVertically + ) { + leading?.invoke() + Text(text, fontSize = 16.sp, color = color, fontWeight = FontWeight.W400) + } + } } \ No newline at end of file diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/signup.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/signup.kt new file mode 100644 index 0000000..6b3a780 --- /dev/null +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/signup.kt @@ -0,0 +1,172 @@ +package com.aiosman.riderpro.ui.login + +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.fillMaxSize +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.layout.width +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Scaffold +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.aiosman.riderpro.LocalNavController +import com.aiosman.riderpro.R +import com.aiosman.riderpro.ui.NavigationRoute +import com.aiosman.riderpro.ui.modifiers.noRippleClickable + +@Composable +fun SignupScreen() { + val navController = LocalNavController.current + Scaffold( + modifier = Modifier + .fillMaxSize() + .background(Color(0xFFECECEC)) + ) { + it + Box( + modifier = Modifier.fillMaxSize() + ) { + // to bottom + Box( + contentAlignment = Alignment.TopCenter, + modifier = Modifier.padding(top = 211.dp) + ) { + Column( + horizontalAlignment = Alignment.CenterHorizontally, + modifier = Modifier.fillMaxWidth() + ) { + Image( + painter = painterResource(id = R.mipmap.rider_pro_logo), + contentDescription = "Rider Pro", + modifier = Modifier + .width(108.dp) + .height(45.dp) + ) + Spacer(modifier = Modifier.height(32.dp)) + Text( + "Connecting Riders".uppercase(), + fontSize = 28.sp, + fontWeight = FontWeight.Bold + ) + Text("Worldwide".uppercase(), fontSize = 28.sp, fontWeight = FontWeight.Bold) + } + + } + Box( + modifier = Modifier + .align(Alignment.BottomCenter) + .padding(bottom = 82.dp, start = 24.dp, end = 24.dp) + + ) { + Column( + modifier = Modifier.fillMaxWidth(), + horizontalAlignment = Alignment.CenterHorizontally, + ) { + ActionButton( + modifier = Modifier + .width(345.dp) + .height(48.dp), + text = "CONTINUE WITH EMAIL".uppercase(), + backgroundImage = R.mipmap.rider_pro_signup_red_bg, + leading = { + Image( + painter = painterResource(id = R.mipmap.rider_pro_email), + contentDescription = "Email", + modifier = Modifier.size(24.dp) + ) + Spacer(modifier = Modifier.width(8.dp)) + } + ) { + navController.navigate(NavigationRoute.EmailSignUp.route) + } + Spacer(modifier = Modifier.height(16.dp)) + ActionButton( + modifier = Modifier + .width(345.dp) + .height(48.dp), + text = "CONTINUE WITH FACEBOOK".uppercase(), + backgroundImage = R.mipmap.rider_pro_signup_facebook_bg, + leading = { + Image( + painter = painterResource(id = R.mipmap.rider_pro_signup_facebook), + contentDescription = "Facebook", + modifier = Modifier.size(24.dp) + ) + Spacer(modifier = Modifier.width(8.dp)) + } + ) + Spacer(modifier = Modifier.height(16.dp)) + ActionButton( + modifier = Modifier + .width(345.dp) + .height(48.dp), + color = Color.Black, + leading = { + Image( + painter = painterResource(id = R.mipmap.rider_pro_signup_google), + contentDescription = "Google", + modifier = Modifier.size(24.dp) + ) + Spacer(modifier = Modifier.width(8.dp)) + }, + text = "CONTINUE WITH GOOGLE".uppercase(), + backgroundImage = R.mipmap.rider_pro_signup_white_bg + ) + Spacer(modifier = Modifier.height(16.dp)) + Box( + modifier = Modifier + .width(345.dp) + .height(48.dp) + .clip(RoundedCornerShape(8.dp)) + .background(Color.Black) + + ) { + Text( + "Sign in with Apple", + color = Color.White, + modifier = Modifier.align(Alignment.Center), + fontSize = 16.sp, + fontWeight = FontWeight.Bold + ) + } + Spacer(modifier = Modifier.height(40.dp)) + Row( + verticalAlignment = Alignment.CenterVertically, + modifier = Modifier.noRippleClickable { + navController.popBackStack() + } + ) { + Image( + painter = painterResource(id = R.drawable.rider_pro_nav_back), + contentDescription = "Back", + modifier = Modifier.size(24.dp) + ) + Spacer(modifier = Modifier.width(8.dp)) + Text( + "BACK", + color = Color.Black, + fontSize = 16.sp, + fontWeight = FontWeight.Bold + ) + } + } + } + } + + } +} \ No newline at end of file diff --git a/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt b/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt new file mode 100644 index 0000000..8a9adf2 --- /dev/null +++ b/app/src/main/java/com/aiosman/riderpro/ui/login/userauth.kt @@ -0,0 +1,178 @@ +package com.aiosman.riderpro.ui.login + +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +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.layout.width +import androidx.compose.foundation.text.BasicTextField +import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.material3.Checkbox +import androidx.compose.material3.CheckboxDefaults +import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +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.res.painterResource +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.text.input.PasswordVisualTransformation +import androidx.compose.ui.text.input.VisualTransformation +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import com.aiosman.riderpro.R +import com.aiosman.riderpro.ui.comment.NoticeScreenHeader +import com.aiosman.riderpro.ui.composables.StatusBarMaskLayout +import com.aiosman.riderpro.ui.modifiers.noRippleClickable + +@OptIn(ExperimentalMaterial3Api::class) +@Composable +fun UserAuthScreen() { + var email by remember { mutableStateOf("") } + var password by remember { mutableStateOf("") } + var rememberMe by remember { mutableStateOf(false) } + StatusBarMaskLayout { + Column( + horizontalAlignment = Alignment.CenterHorizontally, + ) { + Box( + modifier = Modifier + .fillMaxWidth() + .padding(top = 16.dp, start = 16.dp, end = 16.dp) + ) { + NoticeScreenHeader("LOGIN", moreIcon = false) + } + + Spacer(modifier = Modifier.padding(68.dp)) + TextInputField( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 24.dp), + text = email, + onValueChange = { + email = it + }, + label = "What's your email?", + hint = "Enter your email" + ) + Spacer(modifier = Modifier.padding(16.dp)) + TextInputField( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = 24.dp), + text = password, + onValueChange = { + password = it + }, + password = true, + label = "What's your password?", + hint = "Enter your password" + ) + Spacer(modifier = Modifier.height(32.dp)) + Row( + verticalAlignment = Alignment.CenterVertically + ) { + Checkbox( + checked = rememberMe, + onCheckedChange = { + rememberMe = it + }, + modifier = Modifier.padding(start = 24.dp), + colors = CheckboxDefaults.colors( + checkedColor = Color.Black + ), + ) + Text("Remember me", modifier = Modifier.padding(start = 4.dp)) + Spacer(modifier = Modifier.weight(1f)) + Text("Forgot password?", modifier = Modifier.padding(end = 24.dp)) + } + Spacer(modifier = Modifier.height(64.dp)) + ActionButton( + modifier = Modifier + .width(345.dp) + .height(48.dp), + text = "LET'S RIDE".uppercase(), + backgroundImage = R.mipmap.rider_pro_signup_red_bg + ) + + Spacer(modifier = Modifier.height(121.dp)) + Text("or login with", color = Color(0xFF999999)) + } + } + +} + +@Composable +fun TextInputField( + modifier: Modifier = Modifier, + text: String, + onValueChange: (String) -> Unit, + password: Boolean = false, + label: String? = null, + hint: String? = null + +) { + var showPassword by remember { mutableStateOf(!password) } + Column(modifier = modifier) { + label?.let { + Text(it, color = Color(0xFFCCCCCC)) + Spacer(modifier = Modifier.height(16.dp)) + } + Box( + contentAlignment = Alignment.CenterStart + ) { + Row { + BasicTextField( + value = text, + onValueChange = onValueChange, + modifier = Modifier.weight(1f), + textStyle = TextStyle( + fontSize = 16.sp, + fontWeight = FontWeight.W500 + ), + keyboardOptions = KeyboardOptions( + keyboardType = if (password) KeyboardType.Password else KeyboardType.Text + ), + visualTransformation = if (showPassword) VisualTransformation.None else PasswordVisualTransformation(), + singleLine = true + ) + if (password) { + Image( + painter = painterResource(id = R.drawable.rider_pro_eye), + contentDescription = "Password", + modifier = Modifier.size(24.dp).noRippleClickable { + showPassword = !showPassword + }, + colorFilter = androidx.compose.ui.graphics.ColorFilter.tint(Color.Black) + ) + } + } + + if (text.isEmpty()) { + hint?.let { + Text(it, color = Color(0xFFCCCCCC), fontWeight = FontWeight.W600) + } + } + } + Spacer(modifier = Modifier.height(16.dp)) + Box( + modifier = Modifier + .fillMaxWidth() + .height(1.dp) + .background(Color(0xFFF5F5F5)) + ) + } +} \ No newline at end of file