Worked on forgot password screen and update textalign property for all textfield to start instead of center

app/src/main/java/com/fastest/pass/forgotpassword/presentation/components/ForgotPasswordScreen.kt

@@ -0,0 +1,237 @@
+package com.fastest.pass.forgotpassword.presentation.components
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.ColumnScope
+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.statusBarsPadding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
+import androidx.compose.material3.TextField
+import androidx.compose.material3.TextFieldDefaults
+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.draw.clip
+import androidx.compose.ui.focus.FocusManager
+import androidx.compose.ui.platform.LocalFocusManager
+import androidx.compose.ui.platform.LocalSoftwareKeyboardController
+import androidx.compose.ui.platform.SoftwareKeyboardController
+import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.fastest.pass.R
+import com.fastest.pass.login.presentation.components.ClickType
+
+@Composable
+fun ForgotPasswordScreen() {
+    val keyboardController = LocalSoftwareKeyboardController.current
+    val focusManager = LocalFocusManager.current
+
+    Box(
+        modifier = Modifier
+            .background(colorResource(id = R.color.blue_login))
+            .fillMaxSize()
+            .statusBarsPadding()
+    ) {
+        Column(
+            modifier = Modifier
+                .fillMaxSize()
+                .padding(top = 0.dp)
+                .statusBarsPadding()
+        ) {
+            ShowHeaderFP(text = stringResource(id = R.string.forgot_password)) {}
+            Column(
+                modifier = Modifier
+                    .fillMaxSize()
+                    .padding(top = 25.dp)
+                    .clip(RoundedCornerShape(topStart = 35.dp, topEnd = 35.dp))
+                    .background(
+                        colorResource(id = R.color.light_gray_login),
+                    )
+            ) {
+                ForgotText()
+                LoginTextFieldFP(keyboardController = keyboardController, focusManager = focusManager)
+                Spacer(modifier = Modifier.height(25.dp))
+                SendCodeButton(buttonText = R.string.send_code)
+            }
+
+        }
+    }
+}
+
+@Composable
+fun ColumnScope.ShowHeaderFP(text: String, clickType: (ClickType) -> Unit) {
+    Row(
+        modifier = Modifier
+            .align(Alignment.Start)
+            .padding(top = 30.dp)
+            .fillMaxWidth(),
+        verticalAlignment = Alignment.CenterVertically
+    ) {
+        IconButton(
+            onClick = {
+                clickType.invoke(ClickType.GO_BACK)
+            },
+            modifier = Modifier
+                .padding(start = 30.dp)
+                .size(24.dp, 24.dp)
+        ) {
+            Image(
+                painter = painterResource(id = R.drawable.arrow_left),
+                contentDescription = "Arrow-Back",
+                modifier = Modifier.size(24.dp, 24.dp)
+            )
+        }
+        Surface(
+            modifier = Modifier
+                .padding(start = 15.dp),
+            color = colorResource(id = R.color.transparent)
+        ) {
+            Text(
+                text = text,
+                color = colorResource(id = R.color.white),
+                style = MaterialTheme.typography.displayLarge.copy(
+                    fontSize = 24.sp
+                ),
+            )
+        }
+    }
+}
+
+@Composable
+fun ColumnScope.ForgotText() {
+    Text(
+        text = stringResource(id = R.string.email_associated_account),
+        color = colorResource(id = R.color.gray_splash),
+        style = MaterialTheme.typography.displayLarge.copy(
+            fontSize = 18.sp
+        ),
+        lineHeight = 25.sp,
+        modifier = Modifier
+            .align(Alignment.Start)
+            .padding(start = 30.dp, top = 35.dp, end = 50.dp)
+
+    )
+}
+
+@Composable
+fun ColumnScope.LoginTextFieldFP(
+    keyboardController: SoftwareKeyboardController?,
+    focusManager: FocusManager
+) {
+    var emailText by remember { mutableStateOf("") }
+
+    TextField(
+        value = emailText,
+        onValueChange = {
+            emailText = it
+        },
+        textStyle = MaterialTheme.typography.displaySmall,
+        modifier = Modifier
+            .padding(start = 30.dp, end = 30.dp, top = 50.dp)
+            .align(Alignment.Start)
+            .fillMaxWidth()
+            .height(60.dp)
+            .border(
+                1.dp,
+                color = colorResource(id = R.color.gray_border_textfield),
+                shape = RoundedCornerShape(16.dp)
+            )
+            .background(color = colorResource(id = R.color.transparent)),
+        shape = RoundedCornerShape(16.dp),
+        placeholder = {
+            Text(
+                text = "Enter email address",
+                color = colorResource(id = R.color.gray_splash))
+        },
+//        label = {
+//            Text(text = stringResource(R.string.send_code),
+//                style = MaterialTheme.typography.displaySmall
+//            )
+//        },
+        leadingIcon = {
+            Image(
+                painter = painterResource(id = R.drawable.profile_circle),
+                contentDescription = "Email Logo",
+                modifier = Modifier
+                    .size(24.dp, 24.dp)
+            )
+        },
+        maxLines = 1,
+        colors = TextFieldDefaults.colors(
+            focusedLabelColor = colorResource(id = R.color.gray_splash),
+            unfocusedContainerColor = colorResource(id = R.color.transparent),
+            focusedContainerColor = colorResource(id = R.color.transparent),
+            focusedIndicatorColor = colorResource(id = R.color.transparent),
+            disabledIndicatorColor = colorResource(id = R.color.transparent),
+            unfocusedIndicatorColor = colorResource(id = R.color.transparent),
+            cursorColor = colorResource(id = R.color.gray_splash),
+        ),
+        keyboardOptions = KeyboardOptions(
+            keyboardType = KeyboardType.Email,
+            imeAction = ImeAction.Done
+        ),
+        keyboardActions = KeyboardActions(
+            onDone = {
+                focusManager.clearFocus()
+                keyboardController?.hide()
+            }
+        ),
+    )
+}
+
+@Composable
+fun ColumnScope.SendCodeButton(buttonText: Int) {
+    Button(
+        modifier = Modifier
+            .padding(start = 30.dp, end = 30.dp,)
+            .background(colorResource(id = R.color.transparent))
+            .fillMaxWidth()
+            .height(60.dp)
+            .clickable() { },
+        onClick = {},
+        shape = RoundedCornerShape(15.dp),
+//            border = BorderStroke(25.dp, colorResource(id = R.color.black)),
+        colors = ButtonDefaults.buttonColors(
+            contentColor = colorResource(id = R.color.white),
+            containerColor = colorResource(id = R.color.red_login_button),
+        ),
+    )
+    {
+        Text(
+            text = stringResource(id = buttonText),
+            style = MaterialTheme.typography.bodyMedium.copy(
+                fontSize = 20.sp,
+                color = colorResource(id = R.color.white)
+            ),
+            textAlign = TextAlign.Center
+        )
+    }
+}

app/src/main/java/com/fastest/pass/forgotpassword/presentation/ui/ForgotPasswordFragment.kt

@@ -0,0 +1,30 @@
+package com.fastest.pass.forgotpassword.presentation.ui
+
+import android.os.Bundle
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.compose.ui.platform.ComposeView
+import androidx.fragment.app.Fragment
+import com.fastest.pass.forgotpassword.presentation.components.ForgotPasswordScreen
+import com.fastest.pass.ui.theme.FastestPassTheme
+
+class ForgotPasswordFragment : Fragment() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+    }
+
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View? {
+        return ComposeView(requireActivity()).apply {
+            setContent {
+                FastestPassTheme {
+                    ForgotPasswordScreen()
+                }
+            }
+        }
+    }
+}

app/src/main/java/com/fastest/pass/login/presentation/components/LoginScreen.kt

@@ -173,7 +173,9 @@ fun ColumnScope.ShowWelcomeText(
         Spacer(modifier = Modifier.height(25.dp))
         LoginButton(buttonText = buttonText)
         if (isFromLogin) {
-            ForgotPasswordText()
+            ForgotPasswordText() { clickType ->
+                clickType(clickType)
+            }
             CreateAccountText { clickType ->
                 clickType(clickType)
             }
@@ -193,7 +195,7 @@ fun ColumnScope.LoginTextField(
         onValueChange = {
             emailText = it
         },
-        textStyle = MaterialTheme.typography.bodyMedium,
+        textStyle = MaterialTheme.typography.displaySmall,
         modifier = Modifier
             .padding(start = 30.dp, end = 30.dp, top = 50.dp)
             .align(Alignment.Start)
@@ -260,7 +262,7 @@ fun ColumnScope.PasswordTextField(
         onValueChange = {
             passwordText = it
         },
-        textStyle = MaterialTheme.typography.bodyMedium,
+        textStyle = MaterialTheme.typography.displaySmall,
         modifier = Modifier
             .padding(start = 30.dp, end = 30.dp)
             .align(Alignment.Start)
@@ -367,14 +369,17 @@ fun ColumnScope.LoginButton(buttonText: Int) {
 }
 
 @Composable
-fun ColumnScope.ForgotPasswordText() {
-    Text(
-        text = stringResource(id = R.string.forgot_your_password),
-        color = colorResource(id = R.color.sky_green),
+fun ColumnScope.ForgotPasswordText(clickType: (ClickType) -> Unit) {
+    ClickableText(
+        text = AnnotatedString(stringResource(id = R.string.forgot_your_password)),
+        onClick = {
+            clickType.invoke(ClickType.FORGOT_PASSWORD_CLICK)
+        },
         style = MaterialTheme.typography.displayLarge.copy(
-            fontSize = 16.sp
+            fontSize = 16.sp,
+            lineHeight = 25.sp,
+            color = colorResource(id = R.color.sky_green),
         ),
-        lineHeight = 25.sp,
         modifier = Modifier
             .align(Alignment.End)
             .padding(start = 30.dp, top = 15.dp, end = 30.dp)

app/src/main/java/com/fastest/pass/login/utils/LoginNavigation.kt

@@ -14,7 +14,9 @@ class LoginNavigation {
                     LoginRoute.OpenSignUp -> {
                         loginFragment.findNavController().navigate(R.id.signupFragment)
                     }
-                    LoginRoute.OpenForgotPassword -> {}
+                    LoginRoute.OpenForgotPassword -> {
+                        loginFragment.findNavController().navigate(R.id.forgotPasswordFragment)
+                    }
                     LoginRoute.OpenNoneScreen -> {}
                     LoginRoute.GoBack -> {
                         loginFragment.findNavController().popBackStack()

app/src/main/res/navigation/nav_graph.xml

@@ -21,4 +21,10 @@
         android:id="@+id/welcomeFragment"
         android:name="com.fastest.pass.welcome.presentation.ui.fragment.WelcomeFragment"
         android:label="WelcomeFragment" />
+
+    <fragment
+        android:id="@+id/forgotPasswordFragment"
+        android:name="com.fastest.pass.forgotpassword.presentation.ui.ForgotPasswordFragment"
+        android:label="ForgotPasswordFragment" />
+
 </navigation>

app/src/main/res/values/strings.xml

@@ -9,4 +9,7 @@
     <string name="create_account">Create Account</string>
     <string name="new_account">New Account</string>
     <string name="signup">Sign Up</string>
+    <string name="forgot_password">Forgot Password</string>
+    <string name="email_associated_account">Enter the email address associated with your account.</string>
+    <string name="send_code">Send Code</string>
 </resources>