Conversation
| @@ -1,14 +1,11 @@ | |||
| * { | |||
| box-sizing: border-box; | |||
| margin: 0; | |||
| font-family: 'Pretendard-Regular'; | |||
| font-family: 'Pretendard'; | |||
There was a problem hiding this comment.
body에만 적용하셔도 됩니다.body에 저번에 말씀드린-webkit-font-smoothing: antialiased;를 적용하시면 Figma 시안과 폰트 굵기가 같아집니다.Pretendard가 설치되지 않은 유저를 위해 다른 폰트를 보여주는 게 좋은데, 이건 Pretendard 공식 GitHub를 참고해보세요(https://github.com/orioncactus/pretendard?tab=readme-ov-file#font-family)
font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;| 비밀번호 | ||
| </Input> | ||
| <div> | ||
| <button type='submit' className={styles.loginBtn} id='signInBtn'> |
There was a problem hiding this comment.
정보를 다 채워넣었으면 버튼이 파란색으로 변해야 하는데, 여전히 회색인 것 같습니다.
| </div> | ||
|
|
||
| <form className={styles.formContainer} onSubmit={handleSubmit}> | ||
| <Input |
There was a problem hiding this comment.
이메일이나 비밀번호를 틀리게 입력했을 때 validation 메시지가 표시되는 것도 구현하시면 좋을 것 같아요. 참고 삼아서 말씀드립니다.
| password: '', | ||
| }); | ||
|
|
||
| useEffect(() => { |
| <div className={styles.signupWrap}> | ||
| <span>판다마켓이 처음이신가요?</span> | ||
| <Link href='/auth/signup' className={styles.signupLink}> | ||
| <span>회원가입</span> |
There was a problem hiding this comment.
굳이 따지자면 Link 안에 span이 또 들어갈 필요는 없는 것 같습니다.
| setShowPassword1(!showPassword1); | ||
| }; | ||
|
|
||
| const [showPassword2, setShowPassword2] = useState(false); |
There was a problem hiding this comment.
1/2 보다는 명시적으로 passwordConfirm 같은 표현을 쓰는 게 더 좋을 것 같아요.
| // 비밀번호 | ||
| const [showPassword1, setShowPassword1] = useState(false); | ||
| const togglePasswordVisibility1 = () => { | ||
| setShowPassword1(!showPassword1); |
There was a problem hiding this comment.
toggle을 할 때는 setShowPassword1(value => !value) 처럼 작성할 수도 있습니다.
| })); | ||
| }; | ||
|
|
||
| const handleSubmit = async (event) => { |
There was a problem hiding this comment.
단순히 button에 click 이벤트를 붙인 게 아니라 form에 submit 이벤트를 활용하신 것 좋네요. 👍
| SignUp.hideNav = true; | ||
| SignUp.customContainer = true; |
| placeholder='이메일을 입력해주세요' | ||
| onChange={handleChange} | ||
| > | ||
| 이메일 |
There was a problem hiding this comment.
이걸 <Input /> 컴포넌트의 label 이라는 prop으로 돌려도 좋을 듯 합니다. 열고 닫는 태그 사이에는 children을 넣는 게 일반적이라 label을 위한 공간만은 아닌 것 같기도 해요. 😅
요구사항
기본
회원가입
로그인
메인
주요 변경사항
스크린샷
멘토에게