diff --git a/app/src/main/java/org/sopt/and/component/InfoWithText.kt b/app/src/main/java/org/sopt/and/component/InfoWithText.kt new file mode 100644 index 0000000..39ff622 --- /dev/null +++ b/app/src/main/java/org/sopt/and/component/InfoWithText.kt @@ -0,0 +1,53 @@ +package org.sopt.and.component + +import androidx.annotation.StringRes +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.width +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.outlined.Info +import androidx.compose.material3.Icon +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.res.stringResource +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import org.sopt.and.R +import org.sopt.and.ui.theme.ThirdGrey + +@Composable +fun InfoWithText( + @StringRes textRes: Int, + modifier: Modifier = Modifier, + color: Color = ThirdGrey +) { + Row( + verticalAlignment = Alignment.CenterVertically, + modifier = modifier.padding(top = 4.dp, start = 8.dp, end = 8.dp) + ) { + Icon( + imageVector = Icons.Outlined.Info, + contentDescription = stringResource(R.string.icon_info), + tint = color, + modifier = modifier.height(24.dp) + ) + Spacer(modifier = modifier.width(8.dp)) + Text( + text = stringResource(textRes), + fontSize = 12.sp, + color = color + ) + } +} + +@Preview +@Composable +fun InfoWithTextPreview() { + InfoWithText(textRes = R.string.signup_login_guide) +} \ No newline at end of file diff --git a/app/src/main/java/org/sopt/and/sign/signup/SignUpScreen.kt b/app/src/main/java/org/sopt/and/sign/signup/SignUpScreen.kt index e635612..fb773b5 100644 --- a/app/src/main/java/org/sopt/and/sign/signup/SignUpScreen.kt +++ b/app/src/main/java/org/sopt/and/sign/signup/SignUpScreen.kt @@ -3,16 +3,11 @@ package org.sopt.and.sign.signup 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.width -import androidx.compose.material.icons.Icons -import androidx.compose.material.icons.outlined.Info -import androidx.compose.material3.Icon import androidx.compose.material3.SnackbarHost import androidx.compose.material3.SnackbarHostState import androidx.compose.material3.Text @@ -35,6 +30,7 @@ import androidx.lifecycle.viewmodel.compose.viewModel import org.sopt.and.R import org.sopt.and.component.CloseTopBar import org.sopt.and.component.DividerWithText +import org.sopt.and.component.InfoWithText import org.sopt.and.component.OtherServiceIconRow import org.sopt.and.component.WavveActionTextField import org.sopt.and.component.WavveTextField @@ -118,23 +114,7 @@ fun SignUpScreen( modifier = Modifier.padding(horizontal = 8.dp) ) - Row( - verticalAlignment = Alignment.CenterVertically, - modifier = Modifier.padding(top = 4.dp, start = 8.dp, end = 8.dp) - ) { - Icon( - imageVector = Icons.Outlined.Info, - contentDescription = stringResource(R.string.icon_info), - tint = ThirdGrey, - modifier = Modifier.height(24.dp) - ) - Spacer(modifier = Modifier.width(8.dp)) - Text( - text = stringResource(R.string.signup_login_guide), - fontSize = 12.sp, - color = ThirdGrey - ) - } + InfoWithText(R.string.signup_login_guide) Spacer(modifier = Modifier.height(12.dp)) @@ -145,23 +125,7 @@ fun SignUpScreen( modifier = Modifier.padding(horizontal = 8.dp) ) - Row( - verticalAlignment = Alignment.CenterVertically, - modifier = Modifier.padding(top = 4.dp, start = 8.dp, end = 8.dp) - ) { - Icon( - imageVector = Icons.Outlined.Info, - contentDescription = stringResource(R.string.icon_info), - tint = ThirdGrey, - modifier = Modifier.height(24.dp) - ) - Spacer(modifier = Modifier.width(8.dp)) - Text( - text = stringResource(R.string.signup_password_guide), - fontSize = 12.sp, - color = ThirdGrey - ) - } + InfoWithText(R.string.signup_password_guide) Spacer(modifier = Modifier.padding(32.dp))