Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jyh0521
approved these changes
Jun 16, 2024
| @@ -45,7 +45,7 @@ | |||
| font-weight: 400; | |||
| line-height: 16.71px; | |||
There was a problem hiding this comment.
px 값으로 소수는 사용하시지 않는 것이 좋습니다. 브라우저 마다 소수점을 변환하는 방식이 다르기 때문에 예측못한 버그가 발생할 수 있어요!
| @@ -20,7 +20,7 @@ | |||
| font-weight: 600; | |||
| line-height: 23px; | |||
| text-align: left; | |||
| color: #1f2937; | |||
| color: var(--gray-800); | |||
| @@ -0,0 +1,17 @@ | |||
| .Input { | |||
There was a problem hiding this comment.
class 명은 첫글자를 대문자로 사용하시지 않아도 괜찮습니다!
| width: 100%; | ||
| } | ||
|
|
||
| .Input:focus { |
There was a problem hiding this comment.
focus와 placeholder 가상선택자 활용 좋네요!
| @@ -1,3 +1,4 @@ | |||
| import '../styles/global.css'; | |||
There was a problem hiding this comment.
alias path라는 것을 찾아보고 적용해보시는 것도 좋을 것 같습니다. 그럼 경로가 ../.. 이렇게 길어지는 것을 방지할 수 있어서 더 깔끔해보입니다.
|
|
||
| .login_signup a { | ||
| text-decoration-line: underline; | ||
| color: #3182f6; |
Comment on lines
+89
to
+94
| @media (max-width: 767px) { | ||
| .login-container { | ||
| width: 344px; | ||
| margin: 0 auto; | ||
| } | ||
| } |
There was a problem hiding this comment.
개인적으로는 해당 클래스 내부에 미디어 쿼리를 넣어주시는 방법을 추천드립니다. 그렇게 하면 해당 클래스가 사이즈 별로 어떻게 변화하는지 한눈에 알아볼 수 있기 때문에 좀 더 편리한 것 같아요!
Comment on lines
+30
to
+50
| const handleEmailBlur = () => { | ||
| if (values.email === "") { | ||
| setErrorEmail("이메일을 입력해주세요."); | ||
| return; | ||
| } else if (!validateEmail(values.email)) { | ||
| setErrorEmail("잘못된 이메일 형식입니다."); | ||
| } else { | ||
| setErrorEmail(""); | ||
| } | ||
| }; | ||
|
|
||
| const handlePasswordBlur = () => { | ||
| if (values.password === "") { | ||
| setErrorPassword("비밀번호를 입력해주세요."); | ||
| return; | ||
| } else if (values.password.length < 8) { | ||
| setErrorPassword("비밀번호를 8자 이상 입력해주세요"); | ||
| } else { | ||
| setErrorPassword(""); | ||
| } | ||
| }; |
There was a problem hiding this comment.
이 함수는 공통으로 사용되는 것 같아서 커스텀 훅으로 만드신 다음에 두 곳에서 꺼내서 사용하게 만드셔도 좋을 것 같습니다.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
요구사항
Github에 PR(Pull Request)을 만들어서 미션을 제출합니다.
피그마 디자인에 맞게 페이지를 만들어 주세요.
기존의 스프린트 미션 8에 이어서 React, Typescript를 사용합니다.
기본
회원가입
로그인
메인
멘토에게