diff --git a/SodaLive/Sources/User/Login/LoginView.swift b/SodaLive/Sources/User/Login/LoginView.swift index 489d9c9..bdf230a 100644 --- a/SodaLive/Sources/User/Login/LoginView.swift +++ b/SodaLive/Sources/User/Login/LoginView.swift @@ -12,6 +12,8 @@ struct LoginView: View { @ObservedObject var viewModel = LoginViewModel() + @State private var isPasswordVisible: Bool = false + var body: some View { BaseView(isLoading: $viewModel.isLoading) { VStack(spacing: 0) { @@ -19,24 +21,44 @@ struct LoginView: View { Spacer() - UserTextField( - title: "이메일", - hint: "이메일 주소를 입력해 주세요", - isSecure: false, - variable: $viewModel.email, - keyboardType: .emailAddress - ) - .padding(.horizontal, 26.7) + TextField("이메일", text: $viewModel.email) + .autocapitalization(.none) + .disableAutocorrection(true) + .font(.custom(Font.medium.rawValue, size: 15)) + .foregroundColor(.grayee) + .padding(.vertical, 18) + .padding(.horizontal, 13.3) + .frame(height: 56) + .background(RoundedRectangle(cornerRadius: 6.7).fill(Color.gray33.opacity(0.7))) + .padding(.horizontal, 13.3) - UserTextField( - title: "비밀번호", - hint: "비밀번호를 입력해 주세요", - isSecure: true, - variable: $viewModel.password, - isPasswordVisibleButton: true - ) + HStack { + Group { + if isPasswordVisible { + TextField("비밀번호", text: $viewModel.password) + } else { + SecureField("비밀번호", text: $viewModel.password) + } + } + .autocapitalization(.none) + .disableAutocorrection(true) + .font(.custom(Font.medium.rawValue, size: 15)) + .foregroundColor(.grayee) + + Spacer() + + Image(systemName: isPasswordVisible ? "eye.slash.fill" : "eye.fill") + .foregroundColor(.grayee) + .onTapGesture { + isPasswordVisible.toggle() + } + } + .padding(.vertical, 18) + .padding(.horizontal, 13.3) + .frame(height: 56) + .background(RoundedRectangle(cornerRadius: 6.7).fill(Color.gray33.opacity(0.7))) + .padding(.horizontal, 13.3) .padding(.top, 33.3) - .padding(.horizontal, 26.7) Button(action: { viewModel.login() }) { Text("로그인") @@ -48,22 +70,19 @@ struct LoginView: View { } .padding(.top, 40) - HStack(spacing: 10) { - Text("비밀번호 재설정") - .font(.custom(Font.medium.rawValue, size: 13.3)) - .foregroundColor(Color.graybb) - .onTapGesture { AppState.shared.setAppStep(step: .findPassword) } - - Text("|") - .font(.custom(Font.medium.rawValue, size: 13.3)) - .foregroundColor(Color.graybb) - - Text("회원가입") - .font(.custom(Font.medium.rawValue, size: 13.3)) - .foregroundColor(Color.graybb) - .onTapGesture { AppState.shared.setAppStep(step: .signUp) } - } - .padding(.top, 40) + Text("비밀번호를 잊으셨나요?") + .font(.custom(Font.medium.rawValue, size: 13.3)) + .foregroundColor(Color.graybb) + .padding(.vertical, 10) + .onTapGesture { AppState.shared.setAppStep(step: .findPassword) } + .padding(.top, 30) + + Text("보이스온 회원이 아닌가요? 지금 가입하세요.") + .font(.custom(Font.medium.rawValue, size: 13.3)) + .foregroundColor(Color.graybb) + .padding(.vertical, 10) + .onTapGesture { AppState.shared.setAppStep(step: .signUp) } + .padding(.top, 20) Spacer() }